Example Vanilla JS PWA Password Generator 🔐

An example password generator build on vanilla JS, HTML & CSS

Demo 💻

Deployment Steps 🖥

1. Clone the repo

git clone https://github.com/dewhurstwill/example-vanilla-js-pwa-password-generator.git

2. Copy the files to the root of your webserver or double click index.html to run locally
3. (Optional) If running on a webserver update start_url in manifest.json to be the URL of where the app is hosted in may case this would be https://pass.wdew.uk

PWA Usage (ios) 📱

1. Open Safari
2. Navigate to your url, in my example this will be https://pass.wdew.uk
3. Click the button that looks like

4. Select "Add to Home Screen"
5. Click "Add" in the top right
6. Now you can use it as if it were a native app

PWA Usage (Android)

1. On your Android device, open Chrome.
2. Navigate to your url, in my example this will be https://pass.wdew.uk
3. Click the 3 dot menu
4. Tap Add to home screen.
5. Now you can use it as if it were a native app

File Structure 📂

Folder/File Name	Purpose
android	Android PWA Icons
chrome	Chrome PWA Icons
firefox	Firefox PWA Icons
msteams	MSFT Teams PWA Icons
windows	Windows PWA Icons
windows10	Win 10 PWA Icons
index.html	Structure of the app
manifest.json	PWA Manifest
script.js	Supporting code for the app to function
style.css	Styling for the app