プログレッシブウェブアプリ (Progressive web apps, PWA) は、新しいウェブ API と伝統的なプログレッシブな拡張戦略を使用して、クロスプラットフォームのウェブアプリケーションを作成します。これらのアプリはどこでも動作し、ネイティブアプリと同様の使い勝手を提供する様々な機能を提供します。この一連の文書では、これについて知るために必要なすべてをお伝えします。

PWA の利点

PWA は発見でき、インストールでき、リンクでき、ネットワークに依存せず、プログレッシブで、再エンゲージでき、レスポンシブで、安全です。これらが何を意味するのかについては、プログレッシブウェブアプリの利点をお読みください。 PWA の実装方法を知るには、以下のセクションに挙げたガイドを参照してください。

基本的な PWA のガイド

以下のガイドは PWA を実装するのに必要なことを、単純な例を実行し、すべての部分がどのように動作するかを示します。

  1. プログレッシブウェブアプリの紹介
  2. プログレッシブウェブアプリの構造
  3. サービスワーカーで PWA をオフラインで動作するようにする
  4. PWA をインストール可能にする方法
  5. 通知とプッシュ通知を使用して PWA を再エンゲージ可能にする方法
  6. プログレッシブ読み込み

技術ガイド

ツール

  • localForage — クライアントサイドのデータストレージを簡単に扱えるようにする素晴らしいシンプルなJavaScriptライブラリ、これはデフォルトではIndexedDBを使用し、必要に応じて Web SQL/Web Storageにフォールバックする。
  • ServiceWorkerWare — Service Workerの開発を簡単にするExpressのようなマイクロフレームワーク。
  • oghliner — テンプレートだけではなく、オフラインでウェブアプリケーションをGithub Pagesにデプロイするツール。
  • sw-precache — 特定のリソースを事前にキャッシュするService Workerのコードを生成するnodeのモジュール。
  • workbox — 気持ち的には、より進んだキャッシングの手法と簡単なプリキャッシュを有するsw-precacheの後継者。
  • upup — あなたのサイトが常にあなたのユーザーのために存在するようにする小さなスクリプト。
  • The service worker cookbook — 一連の素晴らしいService Worker/プッシュレシピ、オフラインアプリケーションの実装方法を紹介しているが、より多くの機能を持っている。

関連情報

ドキュメントのタグと貢献者

このページの貢献者: chikoski, mfuji09, k-kuwahara, Uemmra3
最終更新者: chikoski,