rafiqulshopon/hishabee-challenge

Interactive Dashboard

This project is an interactive dashboard that provides visualizations for simulated data. Users can interact with various components like dropdowns, checkboxes, and export functionalities.

Prerequisites

Before running the project, ensure you have the following installed:

• Node.js
• npm (Node.js package manager)

You can check if Node.js and npm are installed by running:

node --version
npm --version

Installation

To set up the project on your local environment, follow these steps:

1. Clone the repository to your local machine:

git clone https://github.com/rafiqulshopon/hishabee-challenge

2. Navigate to the cloned repository:

cd hishabee-challenge

3. Install the required npm packages:

npm install

4. Run the development server:

npm run dev

The dashboard should now be accessible at http://localhost:3000.

Using the Dashboard

The dashboard provides an interactive interface with the following features:

• Select Dropdown: Use the dropdown menus to select specific products or categories. This will dynamically update the visualizations to reflect the data related to your selection.

• Export as CSV: You can export the visualized data by clicking the 'Export Data' button. This will download a CSV file containing the data currently displayed on the dashboard.

• Filtering Data: Utilize checkboxes and other provided filters to refine the visualized data according to your criteria.

• Responsive Design: The dashboard is fully responsive, ensuring a seamless user experience across all device sizes.

Live Demo

You can view a live demo of the dashboard at: https://hishabee-challenge.netlify.app