Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Nuxt.jsのPWAモジュールは何をやっているのか

 Nuxt.jsのPWAモジュールは何をやっているのか

2019年6月19日に行われたPWA Night vol.5で使用したスライドです。

リンク
Nuxt.js : https://nuxtjs.org/
タムテブ : https://tamutebu-arabaki2019.firebaseapp.com/
タップ10 : https://tap10s.web.app/
Nuxt PWA : https://pwa.nuxtjs.org/
Workbox : https://developers.google.com/web/tools/workbox/
Workboxモジュールのドキュメント : https://pwa.nuxtjs.org/modules/workbox.html
【Nuxt.js】pwa-module v3におけるpreCacheの仕様変更 : https://qiita.com/gyarasu/items/15292db36166c7a7fa23
OneSignal : https://onesignal.com/

Daichi

June 19, 2019
Tweet

More Decks by Daichi

Other Decks in Technology

Transcript

  1. 何をしているのか Workbox - Registers a service worker for offline caching.

    Manifest - Automatically generate manifest.json file. Meta - Automatically adds SEO friendly meta data with manifest integration. Icon - Automatically generates app icons with different sizes. OneSignal - Free background push notifications using OneSignal.
  2. Manifest / Meta / Icon • PWAに必要なマニフェストファイルを自動生成 • metaもプロジェクト情報から自動で設定してくれる •

    大きめのアイコンを一つ用意するだけでサイズ違いのアイコンを作成 してくれる • 地味にめんどくさいこれらの作業も自動でやってくれる。 必要であれば「nuxt.config.js」で上書き可能