Nuxt.js(Vue.js)SSRのライフサイクルを完全に理解したい(wip) | miyazaki develop log

最近、Nuxt.jsで開発をする機会をいただいたもののnuxtのライフサイクルになかなかつまずいたのでまとめてみました。 fetchやmounted、createdなどはなんとなくわかったものの、middrewareやpluginsが混ざると本当によくわからなくなる。。 まだまだnuxt.js2ヶ月と超絶初心者で網羅できてないライフサイクル + 間違いもあるかと思いますので、随時更新予定です。 検証するライフサイクル SSR(サーバーサイドレンダリング)とCSR(クライアントサイドレンダリング)で頭がごちゃごちゃになるかと思いますので 別々で書いていきます。 SSRは、URLで直接アクセスされた際に、動くもの。 CSRは、nuxt.js上のアプリケーション上でリンククリックされた際にに動くもの。 として考えています。 検証コードは下記の通り。 念のため、全部に process.server