Blog を作りました

動機

勉強したことのアウトプットをあまり出来ていないのでそのための場所としてブログを作りたかった、というのがモチベーションです。

もちろん毎年同じことを思っているわけですが... Ω＼ζ°)ﾁｰﾝ

背景

これまで自分は Hugo 等の静的サイトジェネレータ (SSG) を使ってブログを作成していました。有名どころの SSG は使う分にはもちろん便利なんだけれど色々と設定するのがストレスだったので、重い腰をあげて自分だけの色々融通が効くブログを作るか、と決心しました。というのは半分嘘で、実際にブログを作ったのは Cursor の claude-3.5-sonnet 君です。 自分が Web 技術についてかなり曖昧な理解をしていることを自覚しているので、GPT の方が作るのが早いだろうと思ってポチポチ命令を書いていたら結局 1 日かかりました。実際に自分の手で実装するのとどっちが早いのは分かりませんが、単純な作業をほぼノーコストでやってくれるのはありがたさを感じますね。

技術的なこと

ブログの技術スタックとしては、

• TypeScript
• Next.js
• Tailwind CSS
• Bun

あたりです（技術スタックという言葉の使い方が適切かどうかは怪しい）。最初は流行りにのって Hono で作ろうと思いましたが Tailwind CSS の設定が上手くいかず脱落し、比較的情報が大量にある Next.js の方が Cursor に投げても大丈夫だろうということで Next.js を使いました。とは言え、 最新のバージョンである 15 系 だと Props の満たす制約周りの解決が出来なかったりと色々問題が発生したため、自分の手を動かす必要がありました。また、 Claude-3.5-sonnet に自分の打ち込んだ命令が悪いとは思いますが、勝手に命令と関係ないコード変更をしてくるため（例えば、ある機能を追加する命令をしたとすると、勝手にレイアウトの変更が入る等）、その部分の抑制を常に意識する必要があり若干ストレスでした。

コンポーネント図

今回作成したブログのコンポーネント図を載せておきます。 コードを眺めていても思いましたが、図を見ると改めて「人間の書きやすい」 markdown のパースを頑張りその内容を良い感じにこねくり回して出力することで「人間の気持ちの良い」画面が出ているのだなと思い、かなり業が深い行為をしているなと感じたとともに、機械にとっては大変な作業だよな、と思いました。

まとめ

• ブログを作成した
• claude-3.5-sonnet on Cursor は便利

突貫工事でブログを作ったため、様々な機能が不足している状況ですが、やる気が出たら機能追加します...（多分やらないな）。