Diegogagan2587/metrics-webapp

"Metrics Web-App" is a mobile Single Page Application (SPA) that connects with an API and enables users to view the air quality of six different states in Mexico. Users can customize the number of cities (up to six), click on a state to explore more metrics, and easily return to the main page. Built with JavaScript, React, HTML5, and CSS3.

README

📗 Table of Contents

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

📖 Metrics webapp

What is Metrics webapp?

Metrics webapp is a mobile web application that gets pollution data from Air pollution API on the first render and dislpay air quality value for 6 states within Mexico.

take a look on the next video:

https://www.youtube.com/watch?v=QkO_6bSDYl8

🛠 Built With

Tech Stack

Do you want to know about the tech stack?

Client

• React.js

Server

• Github Pages

Our API

• Air Pollution API

Key Features

discover more about the key features below:

• Include a HomePage
• Include a Details Section
• Shows Air Quality based on the API Data

(back to top)

🚀 Live Demo

Do you want to see the project in action?

• Live Demo Link

(back to top)

💻 Getting Started

do you want to get your own copy and modify it?

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

Prerequisites

First you need to have installed in your computer:

• Node
• Node Package Manager ( npm )
• code editor
• git
• all commands are for a linux terminal

Setup

open your desired folder:

  cd my-folder

proceed to clone the repository:

  git clone git@github.com:Diegogagan2587/metrics-webapp.git

Install

To make sure you have all dependencies please run:

npm install

Usage

To run the project, execute the following command:

  npm run dev

Run tests

To run tests, run the following command:

  npm test

Deployment

You can deploy this project using:

  npm run build

(back to top)

👥 Authors

Do you want to know more about the author?

👤 Diego Vidal Lopez

• GitHub: @Diegogagan2587
• Twitter: @dieg02587
• LinkedIn: Diego Vidal Lopez

(back to top)

🔭 Future Features

there are some features we are planing to include, you can take a look below:

• More Sections for more countries could be added in the future
• Improvements in the performance

(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 use it,share it, or leave feedback, any suggestion or feedback would be well receive!

(back to top)

🙏 Acknowledgments

where do we get inspiration?

Original design idea by Nelson Sakwa on Behance.

(back to top)

📝 License

This project is MIT licensed.

(back to top)