Git Product home page Git Product logo

timeseries-data-organizations-displayer's Introduction

This project is a full-stack application that leverages FastAPI for the backend and React with Vite for the frontend.

Things that should be improved, but due to a lack of time couldn't be done

  • Separate react components in a more intuitive way
  • Don't directly use fetch. Instead abstract away all the external api calls using Axios
  • In the backend, create a separate controller, instead of creating the endpoints in the main.py file
  • The Chart is not that good looking, more improvements can definitely be done
  • The UI in general is not the most UX friendly. Although is not that ugly, it could be much better.
  • The table is not mobile responsive.

Prerequisites

Before you begin, ensure you have met the following requirements:

  • You have installed Python 3.7 or later.
  • You have installed pip, the Python package installer.
  • You have installed Node.js and npm (Node Package Manager).

Installing the Backend

Step 1: Clone the Repository

First, clone the repository to your local machine:

Step 2: Install Dependencies

Next, install the required Python packages using pip and venv:

python -m venv venv
source venv/bin/activate
pip install -r requirements.txt

Step 3: Set Up the Database

Ensure you have PostgreSQL installed and running. The automatically creates the database and seeds it with the .CSV files data at boot time.

Update the DATABASE_URL in your .env file with your database credentials.

Step 4: Run the Backend

First you need to go to the server folder:

cd server

You can start the FastAPI server using Uvicorn:

bash uvicorn app.main:app --reload

The --reload flag enables hot reloading, which means the server will automatically update whenever you make changes to your code.

Installing the Frontend

Step 1: Install Dependencies

Navigate to the frontend directory and install the necessary Node.js packages:

bash cd frontend npm install

Step 2: Run the Frontend

You can start the Vite development server with:

npm run start

Tthis command starts the development server and opens your application in a web browser.

Accessing the Application

Once both the backend and frontend are running, you can access the application by opening a web browser and navigating to http://localhost:5173 (or the port specified by Vite).

Images

image image

Database tables

image image

timeseries-data-organizations-displayer's People

Contributors

tomassar avatar

Watchers

 avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.