https://github.com/webmaxru/pwa-workshop
Front-end part for PWA Workshop
https://github.com/webmaxru/pwa-workshop
progressive-web-app push-notifications pwa service-worker sw-precache
Last synced: about 1 month ago
JSON representation
Front-end part for PWA Workshop
- Host: GitHub
- URL: https://github.com/webmaxru/pwa-workshop
- Owner: webmaxru
- Created: 2017-03-14T11:34:04.000Z (about 9 years ago)
- Default Branch: step0
- Last Pushed: 2017-05-03T15:13:50.000Z (about 9 years ago)
- Last Synced: 2025-06-04T04:43:15.090Z (12 months ago)
- Topics: progressive-web-app, push-notifications, pwa, service-worker, sw-precache
- Language: TypeScript
- Size: 618 KB
- Stars: 1
- Watchers: 2
- Forks: 2
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# A simple app for the PWA Workshop
## Prerequisites
1. Latest stable versions of `node`, `npm` installed.
2. Having `yarn` installed is strongly recommended.
3. Any simple web server od browser extension. Recommended:
[Web Server for Chrome](https://chrome.google.com/webstore/detail/web-server-for-chrome/ofhbbkphhbklhfoeikjpcbhemlocgigb/)
## Install
1. Clone the repo
2.
```bash
yarn
```
or
```bash
npm install
```
3. Start `Web Server for Chrome` extension and point to `build` folder using "Choose folder" button. Open the link you see in "Web Server URL(s)" section (make sure the "Automatically show index.html" option is on). You should see the page with `PWA Workshop` header.
## We are ready to start the workshop! Follow the trainer instructions.
# It you wish to have a full Angular setup (optional)
## Install/update Angular CLI
```bash
npm uninstall -g angular-cli
npm uninstall -g @angular/cli
npm cache clean
npm install -g @angular/cli@latest
```
Check the version:
```bash
npm list @angular/cli version -g
```
The output should be `1.0.0-rc.0`
## Checking the app
1. In the terminal
```bash
ng serve
```
2. Open [http://localhost:4200/](http://localhost:4200/). You should see the page with `PWA Workshop` header. There will be some warnings about ` element` in the console. Ignore them.
3. "Ctrl-C" to stop the app.
## Creating a production build and serving it via external web server
```bash
ng build --prod
```
The `dist` folder should be created. Start `Web Server for Chrome` extension and point to this folder using "Choose folder" button. Open the link you see in "Web Server URL(s)" section (make sure the "Automatically show index.html" option is on). You should see the page with `PWA Workshop` header.