📈 React + TypeScript + Axios + MUI + Chart(2)JS 📊

This ReactJs project is designed to visualize data via a combined bar and linear graph based on the data fed by the API (currently Norweigan housing prices)

TechStack:

       

🎥 Features:

• Custom Filters: Easily check interval changes based on housing type and yearly quarter ranges.
• Interactive/Dynamic Graph: A graph that updates data real-time and has interactive features.
• Consensual History Tracking: Maintain a record of all filter requests made in the browser's local storage. (which is preserved until cleared by user themselves)
• Shareable Results: The results obtained from fitlering can be shared with any other user by sharing the url with the parameters

⇟ Installation:

To install and run the project, follow these steps:

1. Clone the repository:

git clone https://github.com/kenshanta/graph-housing-prices.git

2. Install dependencies:

npm install

3. Start the server:

npm start

4. Access the application in your web browser at http://localhost:5173.

Example:

• Checkout the live demo

📝 TODO :

• Lazy Load Custom Chart Component
• add Test via jest
• Storybook ?

🪙 Additional Credits:

• Data & API both are provided by Statistics Norway
• Made possible using ChartJS and React-Chart-JS-2