From 5df2f8890322c46fc10accad06753d9e896a909b Mon Sep 17 00:00:00 2001 From: Masahiro FUJIMOTO Date: Wed, 14 Jul 2021 00:11:29 +0900 Subject: Web/Progressive_web_apps を更新 (#1407) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - conflicting 版は英語版で削除された記事であるため削除 - 2021/05/07 時点の英語版に同期 --- files/ja/web/progressive_web_apps/index.html | 50 ++++++++++++---------------- 1 file changed, 22 insertions(+), 28 deletions(-) (limited to 'files/ja/web/progressive_web_apps') diff --git a/files/ja/web/progressive_web_apps/index.html b/files/ja/web/progressive_web_apps/index.html index 9c729f609f..c02a19b5cc 100644 --- a/files/ja/web/progressive_web_apps/index.html +++ b/files/ja/web/progressive_web_apps/index.html @@ -1,18 +1,21 @@ --- -title: プログレッシブウェブアプリ +title: プログレッシブウェブアプリ (PWA) slug: Web/Progressive_web_apps tags: + - App + - Application - Apps - - Modern web apps - PWA - Progressive web apps + - Web app + - Web applications - アプリ - プログレッシブウェブアプリ translation_of: Web/Progressive_web_apps ---
{{draft}}
-

PWA community logoプログレッシブウェブアプリ (Progressive web apps) (PWA) は、新しいウェブ API と伝統的なプログレッシブな拡張戦略を使用して、クロスプラットフォームのウェブアプリケーションにネイティブアプリと同様の使い勝手をもたらすウェブアプリのことです。プログレッシブウェブアプリは正式な標準ではありませんが、有用なデザインパターンです。 PWA は、特定のウェブ技術や技法の使用を含む、一連のアプリケーション属性を包含しているという点で AJAX や他の同様のパターンに似ていると考えることができます。この一連の文書では、これについて知るために必要なすべてをお伝えします。

+

PWA community logoプログレッシブウェブアプリ (Progressive web apps, PWA) は、新しいウェブ API と伝統的なプログレッシブな拡張戦略を使用して、クロスプラットフォームのウェブアプリケーションにネイティブアプリと同様の使い勝手をもたらすウェブアプリのことです。プログレッシブウェブアプリは正式な標準ではありませんが、有用なデザインパターンです。 PWA は、特定のウェブ技術や技法の使用を含む、一連のアプリケーション属性を包含しているという点で AJAX や他の同様のパターンに似ていると考えることができます。この一連の文書では、これについて知るために必要なすべてをお伝えします。

ウェブアプリを PWA と呼ぶには、技術的に言えば、 安全なコンテキスト ({{Glossary("HTTPS")}})、1つ以上のサービスワーカー、マニフェストファイルを持つべきです。

@@ -25,23 +28,23 @@ translation_of: Web/Progressive_web_apps
アプリがユーザーにどのように表示されるかを制御し、プログレッシブウェブアプリを確実に発見できるようにする {{Glossary("JSON")}} ファイルです。アプリの名前、開始 URL、アイコン、その他ウェブサイトをアプリのような形式に変換するために必要なすべての詳細が記述されています。
-

PWA の利点

+

PWA の利点

-

PWA は発見でき、インストールでき、リンクでき、ネットワークに依存せず、プログレッシブで、再エンゲージでき、レスポンシブで、安全です。これらが何を意味するのかについては、プログレッシブウェブアプリの利点をお読みください。

+

PWA は発見でき、インストールでき、リンクでき、ネットワークに依存せず、プログレッシブで、再エンゲージでき、レスポンシブで、安全です。これらが何を意味するのかについては、プログレッシブウェブアプリの利点をお読みください。

PWA の実装方法については、 PWA 開発者ガイドをお読みください。

-

ドキュメント

+

ドキュメント

<-- 以下のものは一時的な自動生成リストで、すぐに置き換えられます -->

{{LandingPageListSubpages}}

-
+

ここから下は全て旧バージョンのままで、他のコンテンツの全面見直しに合わせて刷新していきます。

-

基本的な PWA のガイド

+

基本的な PWA のガイド

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

@@ -54,26 +57,22 @@ translation_of: Web/Progressive_web_apps
  • プログレッシブ読み込み
    • -
    -
    -

    技術ガイド

    +

    技術ガイド

    -
    -
    -

    ツール

    +

    ツール

    • localForage — クライアントサイドのデータストレージを簡単に扱えるようにする素晴らしいシンプルな JavaScript ライブラリ、これは既定で IndexedDB を使用し、必要に応じて Web SQL/Web Storage にフォールバックする。
      • @@ -83,22 +82,17 @@ translation_of: Web/Progressive_web_apps
    • workbox — 気持ち的には、より進んだキャッシングの手法と簡単なプリキャッシュを有するsw-precacheの後継者。
    • upup — あなたのサイトが常にあなたのユーザーのために存在するようにする小さなスクリプト。
    • The service worker cookbook — 一連の素晴らしい Service Worker/プッシュレシピ、オフラインアプリケーションの実装方法を紹介しているが、より多くの機能を持っている。
      • -
    • PWA VS Code extension - VisualStudio コード環境でプログレッシブウェブアプリを構築するために必要な、すべての重要なコードスニペットのコレクションです。
      • +
    • PWA VS Code extension - VS Code 環境でプログレッシブウェブアプリを構築するために必要な、すべての重要なコードスニペットのコレクションです。
    -
    -