Nuxt.js+Firebase HostingのサイトをPWA化してLighthouseで(ほぼ)100点満点を目指す - razokulover publog

1年くらい前に仕事でNuxt.jsをいじる機会があったんだけどそれ以来使ってなかった。 ただ、GW中にNuxt tech bookを読んだところ久々にいじりたくなってしまい。 そこでちょうどFirebase HostingとPWA化に関して調べてたとこだったので、Nuxt.jsのサイトをPWA化してFirebase Hostingで動かす手慣らしでもしておこうかと思いやってみた。 ただ、普通にやっても面白くないので一応Lighthouseのスコアを満点にすることを目指してみることにした。 コンテンツはNuxtのスターターキットの初期生成されるページ。このページを対象に行う。 以下、Firebase Hostingの設定・Nuxtのプロジェクト作成・PWA設定・Lighthouseのスコア上げの流れで説明してます。 一応ソースはこちらで。 nuxt-firebase-hosting-samp

[razokulover]

ブクマ

[Konboi]

“ISUCONみたいにフロントエンドのISUCONとしてLighthouseのスコアアップ勝負みたいなのが開催されたりしたら面白そうとかおもったり。”

[nabeen919]

[あとで読む:]

[potato4d]

わかるな > webpackすら全く意識せずにSSRやらVuexでの状態管理やらがが簡単にできる。 > Rails+Herokuでウェブアプリ開発が一気に加速した時のエコシステムの充実度に似てるなと思う。

[aikawame]

丁度中途半端な規模の個人サービスをVue化する計画の最中なので、参考にさせていただきます。

[cardboarder]

ホスティングはNetlifyのが楽な気はする