Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/od-c0d3r/air-police

🚔🚨 Catching in real-time the most air polluted areas in the world 😮‍💨 Single app page using React, Open Weather Map API and REST Countries API.
https://github.com/od-c0d3r/air-police

jest react redux routers

Last synced: 25 days ago
JSON representation

🚔🚨 Catching in real-time the most air polluted areas in the world 😮‍💨 Single app page using React, Open Weather Map API and REST Countries API.

Host: GitHub
URL: https://github.com/od-c0d3r/air-police
Owner: od-c0d3r
Created: 2022-01-31T09:20:52.000Z (almost 3 years ago)
Default Branch: develop
Last Pushed: 2022-03-14T06:06:25.000Z (almost 3 years ago)
Last Synced: 2024-10-21T19:06:59.902Z (2 months ago)
Topics: jest, react, redux, routers
Language: JavaScript
Homepage:
Size: 423 KB
Stars: 1
Watchers: 1
Forks: 0
Open Issues: 0
Metadata Files:
- Readme: README.md

Awesome Lists containing this project

README

![](https://img.shields.io/badge/Microverse-blueviolet)

# Air Police 1.0

> We belive that the first step towards elemintaing a bad habit is by watching it, `AirPloice` A mobile web application to check a list of countries Air Quailty index, and it's contents.

> Using OpenWeatherAirQuailty API that provides numeric data about each country, and present it in the app.

## Built With

- React, Redux, Routers, Bootstrap ~ _Javascript Libraries_
- React Testing Library and Jest ~ _Unit and integration Testing_
- SCSS ~ _Custom Styling_
- Netlify ~ _Production Deployment_

## Live Demo
[Live Demo](https://youthful-jang-dc829b.netlify.app/)

## Getting Started

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

- From your terminal enter in sequence
- `git clone https://github.com/od-c0d3r/air-police.git`
- `code air-police`

### Available Scripts

In the project directory, you can run:

- #### `npm install`

- Install the project dependencies.

- #### `npm start`

- Runs the app in the development mode.\
Open [http://localhost:3000](http://localhost:3000) to view it in your browser.

- The page will reload when you make changes.\
You may also see any lint errors in the console.

- #### `npm test`

- Launches the test runner in the interactive watch mode.
- Coming Soon

- #### `npm run build`

- 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 is minified and the filenames include the hashes.\
Your app is ready to be deployed!

## Coders

👤 **Omar Rashad**

- GitHub: [@od-c0d3r](https://github.com/githubhandle)
- LinkedIn: [@omarrashad](https://linkedin.com/in/omarrashad)

## 🤝 Contributing

Contributions, issues, and feature requests are welcome!

Feel free to check the [issues page](../../issues/).

## Show your support

Give a ⭐️ if you like this project!

## Acknowledgments

- Layout design idea by [Nelson Sakwa](https://www.behance.net/gallery/31579789/Ballhead-App-(Free-PSDs)) on Behance.

These resources helped me during the development process:
- Best React-Redux codebase orgnization. ~ [Link](https://www.pluralsight.com/guides/how-to-organize-your-react-+-redux-codebase)
- React routes in seperate file. ~ [Link](https://stackoverflow.com/questions/43026690/declaring-react-routes-in-a-separate-file-and-importing)
- Open Weather API ~ [Link](https://openweathermap.org/api/air-pollution#current)
- Country Location data ~ [Link](https://github.com/eesur/country-codes-lat-long/blob/master/country-codes-lat-long-alpha3.json)

## License

This project is [MIT](./MIT.md) licensed.

## 📝 Todo

- Feature: Get users live location and rate thier air quailty index.
- Add maps images for each country.
- Add navigation animation between pages.
- Re-design colors and layout.