https://github.com/dikshant441/contact-management-app

About This is a contact management app built using ReactJS, JavaScript, TailwindCSS, React Router v6, and Redux. The app includes a dashboard with charts and maps that display COVID-19 data for different countries.
https://github.com/dikshant441/contact-management-app

api axios jsx reactjs redux tailwindcss typescript

Last synced: 13 days ago
JSON representation

About This is a contact management app built using ReactJS, JavaScript, TailwindCSS, React Router v6, and Redux. The app includes a dashboard with charts and maps that display COVID-19 data for different countries.

• Host: GitHub
• URL: https://github.com/dikshant441/contact-management-app
• Owner: Dikshant441
• Created: 2024-05-07T14:46:34.000Z (9 months ago)
• Default Branch: main
• Last Pushed: 2024-05-07T15:02:46.000Z (9 months ago)
• Last Synced: 2024-11-13T00:19:44.854Z (2 months ago)
• Topics: api, axios, jsx, reactjs, redux, tailwindcss, typescript
• Language: JavaScript
• Homepage: https://contact-manage-app-six.vercel.app
• Size: 813 KB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# Contact Management App with Charts and Maps

This is a contact management app built using ReactJS, JavaScript, TailwindCSS, React Router v6, and Redux. 

The app includes a dashboard with charts and maps that display COVID-19 data for different countries.

# Deployed Link : - 

https://contact-manage-app-six.vercel.app/

# Pages and Functionality

The app has two main pages:

# Contacts

This page allows you to manage your contacts. You can add a new contact by filling out the form, and the contact will be added to the list. You can also edit or delete an existing contact. Clicking on a contact's name will take you to the contact details page.

# Charts and Maps

This page displays COVID-19 data for different countries. It includes a line graph showing the cases fluctuations over 

time and a map with markers that indicate the country name, total number of active, 

recovered cases, and deaths in that particular country as a popup.

# APIs Used

The app uses the following APIs to fetch data:

- World wide data of cases: https://disease.sh/v3/covid-19/all

- Country Specific data of cases: https://disease.sh/v3/covid-19/countries

- Graph data for cases with date: https://disease.sh/v3/covid-19/historical/all?lastdays=all

#Technologies Used

The following technologies were used to build this app:

- ReactJS

- TypeScript

- TailwindCSS

- React Router v6

- React Query

- Redux

# Installation and Setup

To run this app, follow these steps:

- Clone this repository: git clone https://github.com/your-username/contact-management-app.git

- Install the dependencies: npm install

- Start the app: npm start

- The app should open in your default browser at http://localhost:3000/.