ブログをnuxt/contentsに移行した
このブログサイトを Azure Static Web Apps から NuxtHub に移動して、コールドスタートの待ちレスポンスはかなり改善しました。
しかし、ページの移動時など正直、快適とは言えないもたつきを感じます。
NuxtHubの検証を行ってみて、CloudFlareのD1データベースの感触も良かったので、ブログデータの移行を決断しました。
当初、DB2DBの移行で考えていましたが、せっかくなので、学習を兼ねてNuxt/Contentsを試しました。
良くなると予想はできましたが、劇的に改善されたと思います。CosmosDBともここでお別れです。
Nuxt/Contents V3は、.mdファイルの内容を一旦DBに取込み保存します。
なので、直接そのDBに、DB2DBで、エクスポート>インポートできるんじぇね?と考えました。
しかし、Nuxt/ContentsのDBは、あくまで/contentsフォルダの影でしかありません。
たとえ直接インポートが一瞬成功したとしても、対応ファイルのないレコードはすぐに消えてしまうでしょう。
面倒ですが、エクスポートしたデータは一旦、.mdファイルに変換してかかる必要があります。
というか、ファイルの作成がコンテンツDBを更新する唯一の手段です。
これはどうゆうことかというと、今まで利用していた投稿フォームもいらなくなるということです。
そのためのログインも必要ありません。
ずいぶん勿体ない気もしますが、これは断捨離、減らすのは悪いことではないでしょう。たぶん;
AIが変換コードを教えてくれるので、データ移行も思った以上に順調にできました。
component側のコードも、Nuxt/Contentsに合わせて書き換える必要がありますが、思った以上に順調でした。
server側にapiを追加する必要もありません。queryCollectionで必要なデータは全て取得できます。
もっとも悩むのが、スタイルの問題でしょう。
<ContentRenderer>
が出力するHTMLに、スタイルは何もついていません。
コードブロックに背景色がありません、これはいけませんTT
Nuxt/Contentsのドキュメントに、このことについての説明は特にありません。
コードブロックのsyntaxハイライトは、内部的にShikiを利用していて、Nuxt/Contentsの設定で、Shikiのテーマを指定することができます。
Shikiのテーマは、文字のフロントカラーのセットで、表示に適した背景色があるはずですが、それを準備するのはコンテナ側になるようです。
感心の分離原則に従えば、もちろんNuxt/Contentsにこれらを説明する責任はありません。しかし、やはり戸惑います;
ProseComponentについての説明はありますが、そのソースコード自体は、Nuxt/Contents所有ではありません。
もしTailwindでNuxt/Contentsの場合は、/components/content/ProsePre.vueのカスタマイズが必要になると思います。
というか、ほぼ全てのProseComponentで、スタイルのカスタマイズが必要になるでしょう。
というか、Nuxt/Contentsを導入するサイトで、Tailwindを採用しているのが間違いなのかもしれません。
という説明までしようがないですよね;