ブログ、再開します

ご無沙汰しています。かさたたです。

この度、ブログを再開することにしました！以前もたまに記事を書いて公開していたのですが、使っていたドメインの更新費用が高く更新せずに放置しちゃっていました。ある時、気が向いたのでブログのシステムごと刷新しようと思い、全て作り直しました。今回はこのブログのシステム構成について書こうと思います。

以前公開していたブログのシステムは、PHPが動くレンタルサーバーを借りて、そこに素PHPと素JS（Vanillaともいう）で書いたソースを載せて公開していました。公開用の画面と投稿用の管理画面があったのですが、当時Webシステムのログインの仕組みについて全く分かっていなかったので、かなりセキュリティガバガバで、URLがわかれば誰でも記事をいじれてしまう激ヤバ構成でした。（学生の頃、文学部なりに頑張って書いた素人コードだったので...）

そんな感じだったので、今回こんな構成に作り直しました。

フロントはNextJS、バックエンドはFastAPIの構成です。基盤はさくらインターネットの「さくらのVPS」というサービスを使っています。また、画像は同社の「オブジェクトストレージ」というS3互換のストレージサービスに保存しています。

選定理由ですが、フロントに関しては当初は素のReactで行こうと思ったのですが、ブログならSEO対策しないとでしょ...と思い、SSR対応のNextJSを選びました。NextJSは今回初めて触りましたが、Reactに比べて便利機能が多くていいねと思う反面、大規模なシステムではちょっと使いにくい部分が出てくるだろうなと思いました。
バックエンドは何でも良かったのですが、仕事の関係で今後使いそうなので、勉強がてらと思いFastAPIにしました。バックエンドにはそんなに興味ないので、まあ、こんな感じか、というのが触ってみた感想でした。
また、基盤は本当ならAWSでECSとか使って組みたかったのですが、流石に個人開発なので予算的に厳しく、安価な「さくらのVPS」を選定しました。
実行環境は今までコンテナ系の技術に全く触れてこなかったので、これも勉強のためにDockerを使うことにしました。Docker、マジで便利ですね。面倒なセットアップなしにdocker compose up --buildで全てが動いてしまうことに大変感動しました。今も涙が止まりません。
サーバーのOSはLinuxでディストリビューションはUbuntuです。これは何となく使いやすそうだからという理由で選びました。

サーバーのスペックに関して、当初はメモリ1G、CPU2コアの一番安いサーバーで動かそうとしていたのですが、予算の関係上、フロントエンド、バックエンド、DBの3つのコンテナを全て一台のサーバーに載せる筋肉構成をとったので、スペック不足で致命的に動作が遅く、泣く泣くスケールアップしてメモリ2G、CPU3コアのサーバーにしました。（メモリ1G→2Gにしただけで圧倒的に速くなりました。）維持費がサーバー代1800円くらい、画像ストレージ代500円なので、月2300円くらいかかっています。

アプリケーションの機能的な面では、皆さんが見ることができる記事一覧・詳細画面と、私が記事の管理で使う管理画面の機能があります。管理画面にはログイン機能を設けており、NextJS + FastAPIの組み合わせでどんな感じで認証認可機能を作れるのか、とても勉強になりました。
あと、記事の画面ですが、テキストの装飾をどうしようかと思い色々調べましたが、Markdown記法で入力してそれを上手い感じにフロントで描画する仕組みを使いました。
DBにはMD形式のテキストを保存して、フロント表示時にReactMarkDownというライブラリで人に見せられる状態に描画するという手法をとっています。

また、開発にあたりAIをもっと使いこなしたいなと思い、ClaudeCodeをしばき回しました。技術的にはできるけど、やるのはめんどいな〜と思うことがパッと実現できるのでその面で非常に助かりました。特に管理画面に関しては、自分で書こうとすると、人に見せるものでもないし面倒だから適当でいいやと思ってしまうのですが、ClaudeCodeのおかげで機能を充実されることができ、ブログを書くモチベーションにもつながるんじゃないかなと思っています。

ざっと書きましたが、こんな感じです。
今後は適当にいろいろ投稿していこうと思います。次回は転職について書こうかなと思っています。
ここまで読んでいただきありがとうございます！それではまた！