AIR IQ - bringing Air Quality info, to you : React-based Mobile App
An app designed to make accessing Air Quality Information, more accessible, legible, and customizes recommendations based on user profiles. Built for mobiles, in React, React Router DOM, Express, Postgres, React Bootstrap. Created as part of the Collaborative Final Project for Lighthouse Labs, with Justin Mao and Sonia Barret de Nazaris
- cd into the /server folder.
- From the /server folder, run
npm run server(server dependencies).
- Open a second terminal and cd into the /client folder.
- From the /client folder, run
npm install(React dependencies).
npm run serverfrom the /server terminal to start the server on
npm startfrom the /client terminal to start the client on 3001
CREATING THE KNEX DATABASE
- From the /Final_Project folder, run
- From the psql terminal, run
CREATE DATABASE air_iq;.
\qto leave the psql terminal.
knex migrate:currentVersionto check if a table already exists (It should say Current Version: none).
- If a current version exists, run
knex migrate:rollbackthen repeat from step 4 until it says none.
- Most versions of knex will only need you to rollback once to clear all of them
knex migrate:latestto create the empty migration tables.
- To populate the database with "false" data, run
ADD GOOGLEAPI KEYS
- You will need to generate and add your own GoogleAPI keys, following the unfortunate change to a paid use/access to the API in 2018.
GET API KEY
These keys will need to be added in order to look up locations beyont the default geolocation/Montreal view, and and to view the 'mapview' of the Air Quality currently being retreived on the front page.
- Add API Key to two files. First, in the client folder (/client/public/index.html), in the index.html file, at the line
script src="https://maps.googleapis.com/maps/api/js?key=INSERTAPIKEYHERE&libraries=places". Second, in the client folder, (/client/src/components/pages/MapView.js), in the MapView.js file, at line 287: