/cropchat-react-pwa

Primary LanguageJavaScript

Live coding : building a PWA with React

Objectives

Cropchat

Get the project

git clone git@github.com:charlesBochet/cropchat-react-pwa.git

Application have been created using react-create-app.

Step 0 : Create App boilerplate

  1. Go back to first commit git co xxxx
  2. Launch application yarn start

Step 1 : Native like experience

  1. Add material-ui package:
  2. Add navigation bar
  3. Add menu
  4. Add native like features

Step 2 : Serve it over HTTPs

  1. yarn build
  2. Serve it: serve build 8080
  3. ngrok http 8080
  4. Browse it on https://a900701f.ngrok.io

Step 3 : Make the app installable

Step 4 : Set up Fresh data with Firebase

Step 5 : Offline caching

Step 6 : Post pictures

Step 7 : Benefit from native features (camera, location, share)

Step 8 : Going further :

Optimize performances

Background Sync

Push Notifications