Angular PWA to compare simple air quality data for different cities, using the OpenAQ API. A quick, mobile-first reference for current air quality information around the world, with native-like ease of use & offline availability.
- Strongly typed OpenAQ API implementation using TypeScript
- Service Workers for moderate offline usage & adherence to PWA guidelines (users prompted to install web app on Android browsers)
- Angular Material for UI components
- Google Static Maps API for location images
- Modularized Sass for styling
Check out the introduction video created for OpenAQ workshops in Accra & Nairobi. A more tech-focused presentation was given at MilwaukeeJS.
- Node.js & npm (link)
npm install -g @angular/cli
git clone https://github.com/jackkoppa/cityaq.git
cd cityaq
npm install
ng serve
Livereloading dev server now available at http://localhost:4200/
Since the Angular ServiceWorkerModule
cannot be tested using the normal Webpack dev server, run the steps above, but instead of ng serve
, run npm run sw-serve
Server now available at http://localhost:8080/
, without livereload
Big thanks to RobertImbrie & hegotgame for their help in getting the project started @ Rokkincat's Hack & Tell on Oct. 21, 2017.