COVID-19 Tracker App

This web application showcases various COVID-19 related statistics such as number of infections, number of recoveries, number of active cases and numbers of deaths, both globally and locally (within Singapore).

It also provides access to medical articles about COVID-19, which users can read to increase their awareness & knowledge about the disease.

Features:

• Statistics and charts for the infected, recovered, active, and deaths related to COVID-19 both in Singapore and globally
• Interactive user interface with artwork
• Login Feature
• Extras page that features an interactive chart/table displaying the percentage of people per country who are either partially or fully vaccinated
  • User can adjust which countries are shown, chart display
  • User can download or share the chart/table and see references

Languages/Tools used:

HTML, CSS, Javascript, MERN stack (MongoDB, Express, React, Node.js) Note: the application may not work with node v18, users may be required to use another version such as v16

Libraries & APIs used:

Libraries: Material UI, Bootstrap, react-countup, react-chartjs-2, Formik, react-loader-spinner

APIs used:

• melvincwng/covid19-tracker-app-express

Getting Started:

To get started with the COVID-19 Tracker App, follow these steps:

1. Clone the repository git clone https://github.com/melvincwng/covid19-tracker-app.git
2. Navigate to the repository cd covid19-tracker-app
3. run npm install && npm start
4. Open a new browser to http://localhost:3000/ to run the app locally

Contributions:

1. Fork the repository
2. Create a new branch using the command git checkout -b my-feature-branch
3. Commit any changes you make using the command git commit -m 'Add some feature'
4. Push to the branch using the command git push origin my-feature-branch
5. Submit a Pull Request to the original repository

Features to be added and challenges:

• Other countries to the dropdown menu on the home page
• Access to more articles and graphs/charts on the data
• More sources of information for users to access beyond the application
• More statistics on vaccination and other measures like economic class and other demographics
• As there is no current public API for COVID-19 data, it is difficult to update the website

Art & Design:

Artwork created by Melvin Ng

Live Demo:

https://covid19-sg.netlify.app/