Before diving into implementation, it's important to grasp the fundamentals of PWAs. PWAs are web applications that can offer a native app-like experience to users, including offline capabilities, push notifications, and access to device features. They are built using web technologies such as HTML, CSS, and JavaScript.
src
|-- app
|-- components
|-- component1
|-- component1.component.ts
|-- component1.component.html
|-- component1.component.css
|-- component2
|-- component2.component.ts
|-- component2.component.html
|-- component2.component.css
...
|-- modules
|-- feature1
|-- components
|-- feature1.component.ts
|-- feature1.component.html
|-- feature1.component.css
|-- services
|-- feature1.service.ts
|-- feature1.module.ts
|-- feature2
|-- components
|-- feature2.component.ts
|-- feature2.component.html
|-- feature2.component.css
|-- services
|-- feature2.service.ts
|-- feature2.module.ts
...
|-- shared
|-- components
|-- shared.component.ts
|-- shared.component.html
|-- shared.component.css
|-- services
|-- shared.service.ts
|-- models
|-- shared.model.ts
|-- app.component.ts
|-- app.component.html
|-- app.component.css
|-- app.module.ts
|-- manifest.json
|-- index.html
|--serviceWorker.js
|-- assets
|-- images
|-- styles
|-- environments
|-- environment.ts
|-- environment.prod.ts
...
A few examples of useful commands and/or tasks.
$ First example
$ Second example
$ And keep this in mind
Additional notes on how to deploy this on a live or release system. Explaining the most important branches, what pipelines they trigger and how to update the database (if anything special).
- Live:
- Release:
- Development:
- Master:
- Feature:
- Bugfix:
- etc...
- Project folder on server:
- Confluence link:
- Asana board:
- etc...