Skip to content

This web application was designed to visualize data sourced from the public Hydro-Quebec REST API.

Notifications You must be signed in to change notification settings

Ali-VB/hydro-quebecAPI_project

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

20 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Hydro-Québec Data Visualization

This web application allows you to visualize public data from Hydro-Québec, specifically the total demand and production information. It provides both a grid view and charts for an intuitive representation of the data.

Features

  • Fetches data from the public Hydro-Québec REST API to visualize total demand and production.
  • Displays data in a grid view, providing a comprehensive overview of the information.
  • Generates a bar chart to visualize the total demand data divided into three shifts: night, morning, and evening.
  • Utilizes the Chart.js library to create interactive and visually appealing charts.
  • Implements moment.js for convenient date and time manipulation.
  • Incorporates Tailwind CSS and Material UI for responsive and modern user interface design.
  • Hosted on Vercel for easy accessibility and deployment.

The data structure fetching from the API has been modified to enhance the chart representation. Specifically, the total demand data has been divided into three shifts: night, morning, and evening, resulting in a more meaningful and intuitive visualization.

Screenshots

Screenshot 2023-05-16 at 10 17 16 AM Screenshot 2023-05-16 at 10 17 45 AM Screenshot 2023-05-16 at 10 17 52 AM Screenshot 2023-05-16 at 10 18 05 AM Screenshot 2023-05-16 at 10 18 10 AM

Getting Started

To run the application locally, follow these steps:

  1. Clone the repository:

    git clone https://github.com/your-username/hydro-quebecAPI_project.git
  2. Navigate to the project directory:

    cd hydro-quebecAPI_project
  3. Install the dependencies:

    npm install
  4. Start the development server:

    npm start
  5. Open your browser and visit http://localhost:3000 to view the application.

Deployment

This project is deployed using Vercel. You can access the live version of the application at (https://hydro-quebec-api-project.vercel.app/).

Mockup Design

For a detailed visual representation of the application's design, please refer to the Figma mockup prepared for this project.

Contribution

Contributions to this project are welcome! If you encounter any issues or have suggestions for improvements, please open an issue or submit a pull request.

License

License

The project is licensed under the MIT License, and the author of the project is Ali Vakili.

For any inquiries or questions regarding the project, please feel free to contact Ali Vakili at alivakili.tech@gmail.com.

About

This web application was designed to visualize data sourced from the public Hydro-Quebec REST API.

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published