The third stage of the project for Udacity's Mobile Web Specialist Nanodegree: Restaurant Reviews App.
- Clone, install and start the backend server:
git clone [email protected]:sergdenisov/mws-restaurant-backend.git cd mws-restaurant-backend npm install node server
- Clone, install and start the main project server (in a new terminal tab):
git clone [email protected]:sergdenisov/mws-restaurant.git cd mws-restaurant npm install npm start
To correct work over HTTPS add the lws-cert.pem
certificate to trusted on your machine.
The project will be opened in your browser on https://localhost:443
.
The project was developed and tested on Node.js v14.15.4
and npm 6.14.10
.
PWA characteristics from Wikipedia:
Progressive web apps are designed to work on any browser that is compliant with the appropriate web standards. As with other cross-platform solutions, the goal is to help developers build cross-platform apps more easily than they would with native apps. According to Google Developers, the characteristics of a PWA are:
- Progressive — Works for every user, regardless of browser choice, using progressive enhancement principles.
- Responsive — Fits any form factor: desktop, mobile, tablet, or forms yet to emerge.
- Faster after initial loading - After the initial loading has finished, the same content and page elements do not have to be re-downloaded each time.
- Connectivity independent — Service workers allow offline uses, or on low quality networks.
- App-like — Feels like an app to the user with app-style interactions and navigation.
- Fresh — Always up-to-date due to the service worker update process.
- Safe — Served via HTTPS to prevent snooping and ensure content hasn't been tampered with.
- Discoverable — Identifiable as an “application” by manifest.json and service worker registration, and discoverable by search engines.
- Re-engageable — Ability to use push notifications to maintain engagement with the user.
- Installable — Provides homescreen icons without the use of an App Store.
- Linkable — Can easily be shared via a URL, and does not require complex installation.
The technical baseline criteria for a site to be considered a progressive web app by browsers were described by Russell in a follow-up post:
- Originate from a secure origin. Served over TLS and green padlock displays (no active mixed content).
- Load while offline (even if only a custom offline page). By implication, this means that progressive web apps require service workers.
- Reference a web app manifest with at least the four key properties: name, short_name, start_url, and display (with a value of standalone or fullscreen)
- An icon at least 144×144 large in PNG format.
- Use of vector graphics that are indefinitely scalable and require smaller file sizes.
- Some progressive web apps use an architectural approach called the App Shell Model. In this model, service workers store the Basic User Interface or "shell" of the responsive web design web application in the browser's offline cache. This model allows for PWAs to maintain native-like use with or without web connectivity. This can improve loading time, by providing an initial static frame, a layout or architecture into which content can be loaded progressively as well as dynamically.