📗 Table of Contents

• 📖 About the Project
  • 🛠 Built With
    • Tech Stack
    • Key Features
  • 🚀 Live Presentation
• 💻 Getting Started
  • Setup
  • Prerequisites
  • Install
  • Usage
  • Run tests
• 👥 Authors
• 🔭 Future Features
• 🤝 Contributing
• ⭐️ Show your support
• 🙏 Acknowledgements
• ❓ FAQ (OPTIONAL)
• 📝 License

📖 Metrics App

Metrics App is an app designed to give each user an idea of what the air quality is like around supported cities of the world. It features a countries page with dynamic navigation to states and then cities within the country, before returning an info on the selected city. It makes use of the redux store to update the countries as well as the state and cities for each country. Data on the city is fetched on each render as the values are constantly changed.

🛠 Built With

Tech Stack

The following tech stack was used to build this project:

Client

• JavaScript
• React
• Tailwind CSS

Cloud Functions

• Open AIR API

Key Features

• View all countries on the homepage
• Select a country to view states and cities
• Show recently viewed countries on the homepage with a badge

(back to top)

🚀 Live Demo Link

View project demo on Render:

• Live Link

• Video Presentation

(back to top)

💻 Getting Started

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

Prerequisites

In order to run this project you need:

  npm 

Setup

Clone this repository to your desired folder:

  cd my-folder
  git clone https://github.com/peterdtitan/javascript-tv-app.git

Install

Install this project with:

  npm install

Usage

To run the project, execute the following command:

  npm start

Run tests

To run tests using jest, run the following command:

  npm test

(back to top)

👥 Authors

The following users authored this project codebase:

👤 Author1

• GitHub: Peter Okorafor
• Twitter: PeterDeTitan
• LinkedIn: Peter OKorafor

(back to top)

🔭 Future Features

In the future, the following features will be considered:

• Responsiveness for smaller devices
• More data on Air quality with detailed legends
• Embed light mode and dark mode features

(back to top)

🤝 Contributing

Contributions, issues, and feature requests are welcome!

Feel free to check the issues page.

(back to top)

⭐️ Show your support

If you like this project please follow and give it a star ⭐️

(back to top)

🙏 Acknowledgments

I would like to thank Microverse Inc for providing the project requirements, the open API.

Special thanks to Nelson Sakwa on Behance for his original design idea (UI).

(back to top)

❓ FAQ

• Is this an Open Source Project?

  • Yes it is, however, there would not be subsequent deployments and maintenance of the app is dependent on third party APIs.

• Can you make multiple requests to the API?

  • Unfortunately, no you can not. It is limited to 10 calls per second so data mapping and loading (dispatch to store) at once is not possible.

(back to top)

📝 License

This project is MIT licensed.

(back to top)