はじめに

9月7日（水）に開催されていたNuxt.js道場なるものに参加させていただきました。
M&Aクラウド様主催でやられているイベントになります。

内容としては、開発方法や知見の共有の場という印象でした。
今回は第二回目とのことで4名の方が登壇し、自社の開発体験談を発表していました。

この記事では筆者なりの視点で執筆させていただきます。

筆者のレベル感

今話題の駆け出しエンジニアです。笑
2021年4月から自社開発企業で修行中で、主にフロントエンドエンジニアとして日々励んでおります。
上記の入社時期から分かる通り半年もエンジニア経験のないペーペーです。

参加させてもらった経緯として、2つあります。
1つは、弊社でもVue.jsを利用した開発を行っている点。

もう1つは、個人的な興味です。
ちょうど自分のポートフォリオをNuxt.jsで作り変えたところだったのでタイムリーだなと思い参加させていただきました。

【宣伝】

初めに登壇されていたM&Aクラウドの津崎様の内容を今回記事にします。

もともとあった既存のLaravel製アプリケーションのフロント部分をNuxt.jsに移行中とのことで、
そこでの選定基準やメリットをメインに紹介してくれていました。

・SSR(サーバサイドレンダリング)への移行がしたい
・Vue.jsに馴染みのあるエンジニアが多かった
・コンポーネントの利便性

vue.jsのフレームワークで、インストールされたタイミングでStoreやルーティング機能が備わっているものです。
SSRとユニバーサルモードができることが特徴です。

SSR（サーバーサイドレンダリング）とは、
サーバ側でHTMLを生成するWebアプリケーションで対義語としてCSR（クライアントサイドレンダリング）があります。
CSRは通常のVue.jsやReactに当たります。（SPAとも言われたりします）

ユニバーサルモードとは、
SSRした際に、クライアント側で追加のレンダリングなどを行う方式で、それを行うことで動的なサイトを作ることを可能としています。
結果、高速でリッチなアプリケーションの実現が可能になります。

簡単に言うと、Vue.jsの記法です。
2020年9月にVue3に導入されました。
標準の書き方はoptionAPIといいます。（compositionAPI optionAPIどちらでもVue.jsは動きます）

大規模で複雑なコンポーネントを作る際に便利です。
中小規模であれば、optionAPIをおすすめします。

・webアプリケーション開発に必要なものが揃っている
・SSR、SSG（静的サイトジェネレーション）が可能

・関心事に処理をまとめて書くことができる
・大規模な開発にも耐えられる構成にできる

フロントエンドエンジニア初心者にとっては複雑になってしまう。
＠vue/compositionAPIではVuexを使わないとSSRとSSGで値の共有化（ハイドレーション）ができない。

Nuxt.jsはコードが多くなるとビルド時間がかかってしまう。

いかがだったでしょうか。
初心者の僕にとってはとても勉強になったので、第３弾をやるなら是非参加させていただきたいです。
当時の資料も共有していただいていますので、リンク貼り付けておきます。

ありがとうございました。