??? ???? ?? ??? ??? ?????. ? ?? ?? Reddit? ?? ?? ????? ??????. ???? Reddit ?? ???? ?? ???? ? ??? "????"?? ???? ????? ??????.

? ???? ???? ? ???? ??? ?????. ??? ????? ???? ?? ??? Github?? ??? ? ????.

??? ?? ? ???? ????? Reddit ?????. ??? ??? ????? :

• LitElement : ? ?? ??? ???? ??? ???? ?? ?? ?? ??.
• @vaadin/router : ??? ??? ????? ?? ???.
• @pika/web : ?? ?? ?? ??? ??????.
• ES-DEV-SERVER : ??? DEV ?? (?? HTTP ??? ?????).

?? ES ??, ? ?? ??, ?? ?? ?, KV ???? ? ??? ??? ? ???? ??? ?????.

??? ?? :

 npm i -s lit -element @vaadin/router
npm i -d @pika/web es-dev-server

package.json : postinstall ???? ?? :

 "????": {
  "??": "es-dev-server",
  "Postinstall": "Pika-Web"
}

pika : ???? ??????

Pika (Fred K. Schott?)? ? ??? ????? web_modules/ Directory? ?? JavaScript ??? ???? ?????. ??? ????? ????? ??? ?? ??? ????. ??? ??? ?????.

 <code>└─ web_modules/ ├─ lit-element.js └─ @vaadin └─ router.js</code>

? ?? ?? : ?? ??? ??

index.html ?? ?? ?? ???? ?????? ?? ?? ?? ???? ????.

<script type="importmap">
  {
    "imports": {
      "@vaadin/router": "/web_modules/@vaadin/router.js",
      "lit-element": "/web_modules/lit-element.js"
    }
  }
</script>
<reddit-pwa-app></reddit-pwa-app>

reddit-pwa-app.js :

 'lit-element'?? {litelement, html} import;

??? redditpwaapp ?? litelement {
  ?? () {
    html`? ??????<h1> ????? ??!</h1> `;;
  }
}

customElements.define ( 'reddit-pwa-app', redditpwaapp);

?? ?? ?? Bare Module Specifier ??? ???? ??? ?? ?????? ???? ???? ???????.

??? ??? : ???? ??

???? ???? ??????? index.html ? ?? ? ??? ??? ( sw.js )? ?????.

 if (?????? 'ServiceWorker') {
  window.addeventListener ( 'load', () => {
    navigator.serviceworker.register ( './ sw.js');
  });
}

??? ???? ??? ?? ????, ???? ??? ?????. Pika? ??? ?? ??? ?????? ??????. ( sw.js ?? ??? Github Repo? ??????).

KV ???? : ???? ??? ???

?????? ???? ???? ?? INdexEdDB ????? ?? ?? ? KV ????? ?????. ??? ??? ???? LocalStorage?? ??? ?????. ?? ?? ? ?? ???? ??? ???? ? ?????. (?? ?? ??? Github Repo? ??????).

?? ?? ?? ??? ?? ??

KV Storage Polyfill ( kv-storage-polyfill )? ???? ??? ?? ?? ?? ?? ???? ?? KV ????? ??? ??? ?? ?? ????? ?????.

??

? ????? ???? ???? ?? ??? PWA? ???? ?? ? ??? ??? ???? ?? ??? ?????. ?? ?? ??? ?????? ??? ???? ??? ???? ??????. GitHub ???? ?? ????? ??? ?????? ?????. Twitter (@Passle_ ?? @Openwc) ? OpenWC.org?? ??? ? ??? ?????.

??? ? :

Guy Bedford (ES-Module-Shims), Luke Jackson ( "? ?? ??? ????!"), Benny Powers ? Lars Den Bakker?? ??? ?? ????.

? ??? ????????? ?? ?????. ??? ??? PHP ??? ????? ?? ?? ??? ?????!