こんにちは！

この記事はkentoka.comの技術構成を備忘録がてら紹介するものです。 以前はGoogle Cloud上で運用していましたが、現在は構成を一新しています。

インフラ

ホスティング

ホスティングにはCloudflare Pagesを使っています。 Next.jsをoutput: 'export'としてSSG。その生成物をそのままデプロイしています。

• コストかからない
• デプロイが楽

以前は、Hello World!!で書いていたように GCEの当時の無料枠（e2-micro）でDockerコンテナを動かしていました。

フロントエンド

フレームワーク

Next.jsを採用しています。

仕事でも使っていたので、勉強のための選択という側面が強いです。

スタイリング

Tailwind CSS@v4を使っています。

PostCSSプラグインとして動作させ、ユーティリティクラス中心で実装しています。

UIコンポーネント

Radix UIをベースにしたshadcn/uiを主に使っています。

コンポーネントライブラリへの依存という形になっていないので、いい感じかもと思っています。

ブログ本文

以前はmicroCMSで記事を管理していましたが、 今はローカル上で書いた記事データを使うようにしています。

管理のしやすさと拡張のしやすさを取りました。

記事の描画

記事本文はMarkdownで書き、remark/rehypeのパイプラインでHTMLに変換しています。