Polymer App Toolboxは、Polymerを使用してProgressive Web Apps(PWA)を構築するためのコンポーネントやツール、テンプレートのコレクションです。App Toolboxの機能は以下の通りです。:

  • PolymerとWebコンポーネントを利用したコンポーネント指向のアーキテクチャ
  • <app-layout>コンポーネントを利用したレスポンシブルデザイン
  • <app-route>エレメントを使用したモジュラールーティング
  • <app-localize-behavior>によるローカリゼーション
  • <app-storage>エレメントによるローカルストレージの簡易なサポート
  • Service Workerを使った、オフラインキャッシュによるProgressive Enhancement
  • ビルドツールは複数のアプリケーション配信手段をサポートしており、サーバープッシュを使うHTTP/2向けにはunbundledファイルを配信し、HTTP/1向けにはbundledファイルを配信します。

これらコンポーネントのいずれか一つを個別に使用することも、それらを併用してフル機能のProgressive Web Apps(PWA)を構築することもできます。最も重要なのは、各コンポーネントが付加的(additive)であることです。シンプルなアプリであれば、app-layoutだけで十分かもしれません。アプリが複雑化するにつれ、必要に応じてルーティング、オフラインキャッシュ、ハイパフォーマンスな配信方法を追加することができます。

ハイブリッド互換 Toolboxのエレメントと機能には、Polymer 1とPolymer 2の両方で利用可能なハイブリッド版が用意されています。2.0リリース候補(RC)を使う場合は、エレメントの2.0-previewブランチを使用してください。

これらのコンポーネントの実際の動作を体感したい場合は、次のいずれかのデモアプリケーションを試してみてください。:

  • Shop:Shopは、ツールボックスを使用して構築された、フル機能を備えたECのPWAデモです。ビルド方法は、Case study: the Shop appを読んでください。

  • News:NewsはShopのようなフル機能のPWAのデモですが、コンテンツの配信に焦点を当てています。ビルド方法は、Case study: the News appを読んでください。

App Toolboxの利用を開始するには、App Toolboxでアプリを構築を参照してください。

または、レスポンシブアプリのレイアウトを読んでみてください。

Build an app

Responsive app layout