個人サイトをNuxt化した
休日にちまちま進めていたので、なんやかんや1ヶ月ぐらいかかったかな。この個人サイトをNuxt3化した。もともと、GitHub PagesのデフォルトがJekyllなので、このサイトもJekyllで動かしていた。
まあ、Jekyllのままでもよかったといえばよかったのだけど、
- パンクズがない
- サイドバーがスクロールされない
- Jekyllを勉強する気になれない
- 利用しているテーマをカスタマイズするために調査する気になれない
などの不満があって、仕事でVueを使っているし勉強がてらNuxt3で構築し直してみるかと思ってやってみた。
なんもわかんねぇ、なんもわかんねぇって言いながら、CSSとJavaScriptとTypeScriptとVueとNuxtにもみくちゃにされ、苦労はしたものの形にはできたしNuxtはそこまで難しい物でもないのかもしれない。
Railsエンジニアでフロントエンドに苦手意識は相変わらずあるが、エコシステムの不見識なのが一番大きいのだろうなという気がしている。その点、Nuxtはnpx nuxi init project、npm install、npm run devで開発を開始できるので、自分みたいなRailsは知ってるけどフロントわからんマンにとっては非常にありがたい存在で、気が向いたら何かアプリを書いてみようかと思っている。
参考にした書籍など
レイアウトなどはEvery Layoutを参考にした。Every Layoutの公式サイト（英語）でいくつかサンプルが確認できる。例えば、このサイトもsidebarはStackパターンを適用している。CSSをちょっといじることはできても、CSSでレイアウト書くのは無理みたいな人は読んでおくと苦手意識が改善できると思う。
NuxtはNuxt 3 フロントエンド開発の教科書を参考にした。ググれば情報が出てくるものの、Nuxt2時代のものが引っかかることが多く、この書籍を確認することも多かった。サイトのNuxt3化には関係ないが、Nuxtというのがどういうポジションのフレームワークなのかこの本を読んで理解できたし、Vueを使っている人でNuxtの雰囲気を理解したいならこの本で十分ではないだろうか。