https://github.com/saikiran76/charts

https://github.com/saikiran76/charts

javascript react react-chartjs-2 react-icons reactjs recharts

Last synced: 4 months ago
JSON representation

• Host: GitHub
• URL: https://github.com/saikiran76/charts
• Owner: saikiran76
• Created: 2024-06-01T16:29:47.000Z (about 1 year ago)
• Default Branch: master
• Last Pushed: 2024-06-02T17:26:49.000Z (about 1 year ago)
• Last Synced: 2025-01-01T14:46:32.240Z (6 months ago)
• Topics: javascript, react, react-chartjs-2, react-icons, reactjs, recharts
• Language: JavaScript
• Homepage: https://charts-pi-three.vercel.app
• Size: 587 KB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# Charts Dashboard

## Techstack





## Overview

This is a Dashboard page built using React which makes use of libraries like `react-charts-2` , `recharts` for chart components. Based on the network security related data for different kind of activities like anamoilies, or potential or suspicious activities. (while connection to MYSQL Database)

For more visit the official docs of react-spring, Firebase, material-ui(mui-rte): 

`https://recharts.org/en-US/`

`https://react-chartjs-2.js.org/components`

`https://www.chartjs.org/docs/latest/getting-started/`

## Report on Component Structure and Managament of states 

### Component Structure

### Chart Components

- Pie Chart/ Dashbord component

- Area plot Component

- BarChart component

## Snaps of the project

![image](https://github.com/saikiran76/Charts/assets/80874246/281832ae-d7db-4d1f-8a92-4b39967009b7)

![image](https://github.com/saikiran76/Charts/assets/80874246/be71b967-7d11-4617-8656-48d79c9fce46)

![image](https://github.com/saikiran76/Charts/assets/80874246/3353c011-1833-4c55-b6c5-d5ef200c3f55)

![image](https://github.com/saikiran76/Charts/assets/80874246/cd2b578e-ecc1-407c-aab2-ea276c9409b6)

## Local Setup

1) Clone the project using the command `git clone https://github.com/saikiran76/Charts.git`

2) cd into the project: `cd Charts`

3) Install the required dependencies using: `npm install`

4) Start and run the project on local host: `npm start`