This is a demo of a QCObjects based front-end Progressive Web App
The following is the project structure of a Progressive Web App made in QCObjects
├── index.html
├── Dockerfile
├── README.md
├── VERSION
├── app.js
├── css
├── favicon.ico
├── humans.txt
├── img
├── js
├── localhost-cert.pem
├── localhost-privkey.pem
├── manifest.json
├── package-lock.json
├── package.json
├── robots.txt
├── spec
├── sw.js
└── templates
├── Dockerfile
├── README.md
├── VERSION
├── app.js
├── css
│ ├── components
│ │ ├── button.css
│ │ ├── card.css
│ │ ├── hero
│ │ │ ├── hero-call-to-action.css
│ │ │ ├── hero-overlay.css
│ │ │ └── hero-two-column-form.css
│ │ └── modal.css
│ ├── desktop
│ │ ├── container.css
│ │ ├── content.css
│ │ ├── footer.css
│ │ ├── index.css
│ │ ├── navbar.css
│ │ └── sidebar.css
│ ├── index.css
│ ├── mobile
│ │ ├── content.css
│ │ ├── footer.css
│ │ ├── index.css
│ │ ├── navbar.css
│ │ └── sidebar.css
│ ├── modern-base.css
│ └── theme
│ ├── basic
│ │ └── style.css
│ ├── cyan
│ │ └── style.css
│ ├── redlight
│ │ └── style.css
│ └── xtra
│ └── style.css
├── favicon.ico
├── humans.txt
├── img
│ ├── Q_web\ copy.png
│ ├── Q_web.png
│ ├── Q_web.svg
│ ├── icons
│ │ ├── icon-128x128.png
│ │ ├── icon-144x144.png
│ │ ├── icon-152x152.png
│ │ ├── icon-192x192.png
│ │ ├── icon-384x384.png
│ │ ├── icon-512x512.png
│ │ ├── icon-72x72.png
│ │ └── icon-96x96.png
│ ├── logo-qcobjects-white.svg
│ ├── logo.png
│ ├── placeholder.svg
│ └── screenshots
│ ├── screenshot1.png
│ ├── screenshot1.webp
│ ├── screenshot2.png
│ └── screenshot2.webp
├── index.html
├── js
│ ├── init.js
│ └── packages
│ ├── installer.js
│ ├── org.quickcorp.custom.components.js
│ ├── org.quickcorp.custom.controllers.js
│ ├── org.quickcorp.custom.effects.js
│ ├── org.quickcorp.custom.js
│ ├── org.quickcorp.custom.models.js
│ └── org.quickcorp.custom.views.js
├── localhost-cert.pem
├── localhost-privkey.pem
├── manifest.json
├── package-lock.json
├── package.json
├── robots.txt
├── spec
│ ├── support
│ │ └── jasmine.json
│ └── testsSpec.js
├── sw.js
└── templates
└── components
├── article1.tpl.html
├── article2.tpl.html
├── article3.tpl.html
├── article4.tpl.html
├── blank.tpl.html
├── card.tpl.html
├── contentblock.tpl.html
├── footer.tpl.html
├── footer2.tpl.html
├── header.tpl.html
├── hero
│ ├── hero-call-to-action.tpl.html
│ ├── hero-overlay.tpl.html
│ └── hero-two-column-form.tpl.html
├── install-button.tpl.html
├── layout-basic.tpl.html
├── loading.tpl.html
├── loadingfooter.tpl.html
├── login-button.tpl.html
├── login2.tpl.html
├── loginform.tpl.html
├── modal.tpl.html
├── nav.tpl.html
├── pages
│ ├── page1.tpl.html
│ ├── page2.tpl.html
│ └── page3.tpl.html
├── product.tpl.html
├── profile.tpl.html
├── pwa.tpl.html
├── section1.tpl.html
├── section2.tpl.html
├── shadowed-card.tpl.html
├── signin-button.tpl.html
├── signup-form.tpl.html
├── signup.tpl.html
├── signupbuttons.tpl.html
├── signupform.tpl.html
├── signuppage.tpl.html
├── signupsuccessful.tpl.html
├── signupsuccessfulfooter.tpl.html
├── splashscreen.tpl.html
└── topmenu.tpl.html