Nuxtの魅力再発見
ただの趣味から仕事でも使うツールになったことで、
メモ帳に書き殴っていた実家時代から大幅に飛躍したweb技術領域。
その成果の第1弾がピクチャレ大会で、これは「Next.js」というフレームワークを使って作っています。
実は2022年のプロジェクト黎明期から、
実際に作り始めてみた頃まではずっと「Nuxt(ナクスト)」というフレームワークで検討していました。
これは2020年当時の同僚間の話で「Reactは難しい。Vue.jsなら昔ながらのHTMLコーダーにも理解しやすい」
というような情報がさも常識かのように飛び交っていた影響もあり、
ReactのフレームワークであるNext.jsよりVue.jsのフレームワークであるNuxtの方がハードルは低いだろう、
と思い込んでいたことによります。
しかし実際に触ってみるとReactのコンポーネント指向開発がとても面白く、
開発初期に思い切ってNext.jsへ転向することにしました。
当時の記事(#06970 / 2023年01月16日)によると、当時はNuxtがメジャーアップデートしたばかりで情報が少なく、
その情報の少なさが開発初期にしていきなり暗礁に乗り上げるきっかけになったので思い切って切り捨てた、
という感じみたいです。いまなら時間も経っているしChatGPTもいるしなんとかなりそうな気はしますね。
そんな矢先、「Nuxt Content」というNuxtのモジュールと「Nuxt Studio」というwebサービスを知りました。
Nuxt Contentは、簡単に言えばGitで管理されたMarkdownファイルをそのまま表示させる技術。
Nuxt Studioは、そのMarkdownファイルをコードベースでweb上から直接編集できるようにするサービスです。
「Markdownで書いた記事をそのまま読み込む」
というスタイルは現行の本家ブログのシステムそのままであり、大いに驚きました。
これならモジュールのサポートも受けつつシステムを変えずに運用することも不可能ではない。
本家ブログの現行システムは突貫工事で作った結果どうしてもビルドが通らなくなってしまい(#07716 / 2025年01月31日)、
ゼロベースからの作り直しを決意したばかりでした。
ChatGPTと話し合いながら、そのときは最終的にはピクチャレ大会と同じような構造にすることにしました。
すなわちDBコンテナ、バックエンドコンテナ、フロントエンドコンテナをそれぞれ別に用意する方式です。
記事をアップしたらバックエンドがDBへ変換し、APIでDBを読み込んで記事を表示するという想定です。
もちろんこれは開発が難しいということもありますが、
結局マスターデータはMarkdownでDBは中継でしかないため、
DBとしてのマスタとMarkdownとしてのマスタが共存せざるをえないというややこしさもあります。
その代わり、DB化するので全文検索などで有利なのは確か。
そもそもこの問題の根本は「ビルドが通らないこと」だったので、
ゼロベースから作り直すにしても必要以上に複雑化する必要はありません。
それならば、モジュールとしてMD-HTML変換がサポートされているNuxtの方が有望なのでは……と思った次第です。
Studioを使えば実質どの端末からでもブログ編集できるという点も魅力的。
もちろん、Markdownをそのまま扱うことのリスクやデメリットもありますけどね。
たとえばこの方式だとブログ全部の全文検索はあまり現実的ではなく、諦めざるをえません。
まあ、そもそも向こう数年は全記事公開する目処が立っていないため重要度はかなり低いのですが。
自分としては2022年当初こだわっていたNuxtの魅力を期せずして再発見でき、なかなかアツい展開です。
Nuxt Contentは実際にミニアプリを作って試してみて、有望そうならこっちで行こうかなと。
2年前なら「Vue.jsも触ったことないのに……」と尻込みしてしまうところですが、
ChatGPTのおかげで技術知識の有無はさっぱり考慮しなくていいというのは本当に便利な時代になったなと思います。