Skip to content

Microverse React Capstone Project: This educational project is to build a mobile web application to check a list of metrics (numeric values) using React and Redux. Built with React, Redux Toolkit, API, Sass and JavaScript.

Notifications You must be signed in to change notification settings

braincee/covid-19-metric-website

Repository files navigation

Covid-19-Metric-Website

The COVID-19 pandemic, also known as the coronavirus pandemic, is a global pandemic of coronavirus disease 2019 (COVID-19) caused by severe acute respiratory syndrome coronavirus 2 (SARS-CoV-2). The novel virus was first identified from an outbreak in Wuhan, China, in December 2019.

Live Demo

Live Demo

video Demo

Video Demo

Learning objectives:

  • Use React documentation.

  • Use React components.

  • Use React props.

  • Use React Router.

  • Connect React and Redux.

  • Handle events in a React app.

  • Write integration tests with a React testing library.

  • Use styles in a React app.

  • Use React life cycle methods.

  • Apply React best practices and language style guides in code.

  • Use store, actions and reducers in React.

  • Built With

  • React

  • Redux

  • JSX

  • Jest

  • ES6

Getting Started

To get a local copy up and running follow these simple example steps.

  1. Download the Zip or (git clone)[https://github.com/braincee/covid-19-metric-website.git]
  2. cd covid-19-metric-website.git
  3. Then open in your browser by using live server\

Install

  • On your terminal run : npm install
  • To start the development server : npm run start
  • In case you run into any errors please raise an issue.

Jest testing

For testing using jest follow these steps:

npm install This will download all the dependencies npm test This will perform all the tests and display the result on the terminal

Linter errors testing

For tracking linter errors locally you need to follow these steps:

  • After cloning the project you need to run this command

    npm install This command will download all the dependencies of the project

  • For tracking the linter errors in CSS file run:

    npx stylelint "**/*.{css,scss}"

  • And For tracking the linter errors in React files run:

    npx eslint .

Author

👤 Stephen Annor

🤝 Contributing

Contributions, issues, and feature requests are welcome!

Feel free to check the issues page.

Show your support

Give a ⭐️ if you like this project!

Acknowledgments

  • Nelson Sakwa - for the original design
  • Covid-19 API - for displaying the covid-19 data
  • Flags API. - for displaying the flags
  • Hat tip to Microvers and all the staff
  • Thanks to My coding Partners
  • Thanks to My Morning-session-group and Standup-team Partners and
  • Thanks to Code Reviewers

📝 License

This project is MIT licensed.

About

Microverse React Capstone Project: This educational project is to build a mobile web application to check a list of metrics (numeric values) using React and Redux. Built with React, Redux Toolkit, API, Sass and JavaScript.

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published