🌤 Air Quality Index App w/ Twilio Notifications

A Single Page App that:

• Incorporates the Twilio API with React / Redux to send users Air Quality Index (AQI) alerts whenever the AQIs exceed certain user-set thresholds
• Integrates the Google Maps API with AutoComplete & Geolocation along with the World AQI Map Overlay API in order to display AQIs around the world
• Implements Responsive Web Design (RWD) using Media Queries / LESS

---

Table of contents

• Motivation
• What is Twilio?
• Login Credentials
• Live Demo
• Dependencies
• Requirements
• Installation
• Running Locally
• Deploying to Heroku
• Tests
• Contact

Motivation

I wanted to create something useful everyone would use and wanted to utilize the popular Google Maps and AutoComplete API. I thought that, since I use my weather app every morning – why not create a small version of it.

What is Twilio?

The Twilio Messaging API makes it easy to send and receive SMS and MMS messages as well as query meta-data about text messages such as delivery status, associated media, and leverage tools like Copilot to manage your messages globally at scale.

Login Credentials

Passwords are Salted & Hashed using Bcrypt

• Username: Brian | Password: Briantam23@
• Username: Mike | Password: Mike12#

Live Demo

Currently deployed to Heroku!

Dependencies

• React
• Redux
• LESS
• Enzyme
• PostgreSQL
• Twilio
• Mocha
• Express
• Bcrypt

Requirements

• Downloads
  • Node.js (v10.16.0)
  • Git
  • PostgreSQL
• Environment Variables (must be set in .env or set as an environment variable)
  • GOOGLE_API_KEY
  • AIR_QUALITY_INDEX_KEY
  • TWILIO_ACCOUNT_SID, TWILIO_AUTH_TOKEN, TWILIO_PHONE_NUMBER
  • OWN_PHONE_NUMBER (if you want to be sent Twilio error messages regarding the app)

Installation

Step 1: Clone Repo

git clone https://github.com/briantam23/twilio-aqi-alert-app.git` # or clone your own fork

Step 2: Create Database

createdb aqi-twilio-alert-app

Step 3: Install node_modules

npm install # or yarn install

Running Locally

npm run start:dev

The npm run start:dev command will run 2 processes:

• the webpack process (in watch mode) to build your client-side Javascript files
• the Node process for your server with nodemon

Your app should now be running on localhost:3000.

Deploying to Heroku

Make sure you have the Heroku CLI installed.

heroku create
git push heroku master
heroku open

Alternatively, you can deploy your own copy of the app using the web-based flow:

Tests

Created Tests for React Components, the Redux Store, Routes, Models, and Functions:

To run without "watch mode":

npm test

To run with "watch mode":

npm run test:dev

Contact

Created by Brian Tam - feel free to contact me at briantam23@gmail.com!

Personal Website - briantam23.github.io
LinkedIn - @briantam23
Github - @briantam23