The simplest way to create progressive web apps across platforms and devices.
This repo is home to several projects in the PWABuilder family of tools.
| Tools | Overview | Source | Docs | Contribute |
|---|---|---|---|---|
| PWABuilder.com | The best way to package PWAs for various stores. | /apps/pwabuilder | PWABuilder docs | Wiki |
| PWA Studio | PWA Studio makes VSCode the BEST developer environment for building Progressive Web Apps. | /apps/pwabuilder-vscode | PWA Studio docs | Wiki |
| PWA Starter | Our opinionated and production tested progressive web app (PWA) template for creating new projects. | Repo | PWA Starter docs | Wiki |
| Docs | Source | Contribute |
|---|---|---|
| docs.pwabuilder.com | /docs | Wiki |
| blog.pwabuilder.com | /apps/blog | /apps/blog |
| Components | Overview | Source | Docs | Contribute |
|---|---|---|---|---|
<pwa-auth> |
Web component for authenticating users | /components/pwa-auth | /components/pwa-auth/docs | Wiki |
<pwa-update> |
Web component for great PWA update experience | /components/pwa-update | /components/pwa-update | Wiki |
<pwa-install> |
Web component for great PWA install experience | /components/pwa-install | /components/pwa-install | Wiki |
<pwa-inking> |
Web component for adding inking to your PWAs | /components/pwa-inking | /components/pwa-inking | Wiki |
You will need the following things properly installed on your computer.
You should also be familiar with TypeScript which we use for this project. This helps give you more guidance as you code from intellisense when using VSCode.
We recommend the following tools for your dev setup:
- Editor: VSCode
- Terminal: Windows Terminal or hyper
Additionally, when you open the project in VS Code, you'll be prompted to install recommended extensions.
Navigate to the folder of the project you plan to work on (example /apps/pwabuilder), and follow the README for how to get started.
Running npm install in the project folder will automatically install and build all dependencies.
This monorepo does not use a root package.json like other monorepos you might be used to. Instead, projects live in their separate folders and are mostly independent of each other.
However, when there are dependencies between projects, our tooling should automatically handle linking and dependency building when you run npm install in the project root.
For example /apps/pwabuilder has a dependency on library/site-analytics. This dependency is defined in the pwabuilder package.json like so:
//package.json
"dependencies": {
"@pwabuilder/site-analytics": "file:../../libraries/site-analytics",
...Running npm install in the pwabuilder folder will also run npm install and npm run build for the site-analytics project. In most cases, and unless working on a dependency, a developer will not have to worry about how these projects are linked.
For automatic linking of projects to work, ensure each project has a preinstall script like so:
// package.json
"scripts": {
"preinstall": "node ../../scripts/setupDeps.js",
...All files on the PWABuilder repository are subject to the MIT license. Please read the License file at the root of the project.
This project has adopted the Microsoft Open Source Code of Conduct. For more information see the Code of Conduct FAQ or contact opencode@microsoft.com with any additional questions or comments.