Hackathon: React To The Future with Planes 🛫

This project is created for the Planes Hackathon winning the API Exploration category.

Description

Green Move is a front end React application for users to check air quality in an area using Ambee Air Quality API to aid their decision in moving to that area.

Installation and Usage

Clone or download this repo.
Navigate to root directory of this repository and open the terminal:

To start up the client:
cd React-to-the-future
npm install
npm run start

It should load on: http://localhost:3000/

Technologies

• HTML, CSS, JavaScript

Dependencies:

• react, react-router-dom, chakra-ui/react, axios

Process

1. Plan! Come up with an idea on paper, create a wireframe and user stories
2. Create react front-end using Plane's template
3. Install dependencies and prepare codebase
4. Start with search functionality using Ambee Air Quality API and positionstack API.
5. Create front end UI for displaying results
6. Add extra features to improve usability
7. Create About screen
8. Fit all pieces together!

Changelog

react

1. Remove boiletplate code
2. Create search page, about page and main components
3. Connect to APIs and display data
4. Add components top-nav, history modal, description of air particles

Bugs

• props data showing as undefined - cannot share data between components
• once results is displayed, nav bar items cannot be clicked on

Wins & Challenges

Wins

• Making new friends and working together!
• Won category for API Exploration 🏆

Challenges

• Time ⌛
• New or unfamiliar with react
• Git conflicts

Future Features

• User accounts
• Linked to property search API
• See air quality of nearby areas / map view
• Calculate emissions between distances

Meet The Team

• @chunman906
• @E-F-J
• @natbibi
• @rodages

Check out our Team Profile.