React Catalogue of Statistics Capstone Project

A React capstone based for catalogue of statistics.

1. Getting Started: Additional description of the project and its features

The web appllication consists of:

• A first page with a list of items that could be filtered by some parameters (continents).
• A second page for the item details.
• A single page application built with React and Redux
• Its data getting retrieved from an API and stored in the Redux store.
• Every page, the main page and pages for each item, having a unique route within the SPA
• The project's deployed and accessible online.

APP Screenshot

User journey

This project's configuration is as simple as possible; build, deploy, and interact with, all with yarn.

2. Built With

• React JS
• Boostrap
• Chrome web Browser.
• Netlify for deployment.
• Jest framework for tests purposes.
• HTML/DOM - Manipulation for UI.
• Eslint for linter checks and style guides.

3. Pre-requisites

• A code editor.
• Chrome Web Browser.
• Have NodeJS installed locally.
• Basic to intermediate JavaScript skills.

4. Future feature updates/improvements.

• The upcoming updates will consist of:

1. Ability to check on the country's statistics per city and check total population numbers.
2. Functionality to show graphs and the spread of infections and future projections.
3. A more revamped user interface to filter out results based on the user's search and preferences.

Below are the instructions on how to play the game and also setting it up locally.

Build Dependencies 🚧

The only dependencies are NodeJS & yarn. Any NodeJS LTS version will work. Clone this repo and run npm install.

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

Setup and installation

git@github.com:christianotieno/react-covid19-catalogue.git

Install dependencies

yarn install

Run the app in the development mode

yarn start

Open http://localhost:3000 to view it in the browser.

Run linter checks

npx eslint .

Run tests

yarn test

The instructions get to launch the test runner in the interactive watch mode.

Deployment

yarn build

The command builds the app for production to the build folder. It correctly bundles React in production mode and optimizes the build for the best performance.

The build's minified and the filenames include the hashes. Your app is ready to be deployed!

APP NAME	BUILD STATUS:
Covid-19-catalogue

---

7. Live link

Link to Live Page

---

8. Author Section

👤 Christian Otieno

• Github: christianotieno
• Twitter: @iamchrisotieno
• LinkedIn: Christian Otieno

---

9. 🤝 Contributing

Contributions, issues and feature requests are welcome!

Feel free to check the issues page.

---

10. Show your support

Give a ⭐️ if you like this project!

---

Credits

• Track Corona Live API

---