ブログをmicro CMSで作り直してVercel上に公開。色々試せて楽しい。
micro CMS、Vercel、Visual Studio Code、Claude Codeなどを活用して、ブログを作り直してみました。 商用利用はできないけど、安価で色々カスタムできそう。
2026-04-11Wordpressのアフィリエイトブログはやめた、収益はあったけど、サーバー代で飛んでいくし。
ま、せいぜいそれくらいの利益だったということ。
ご時世的に、ゼロクリック検索で、検索からのブログへの流入がそこまで見込めなくなってしまった現在、このまま継続していても先が見えているなぁと思ったのと、どうしても、思ったことを正直に書けない、何らかのテーマ性がいるんじゃないか、とか色々邪念が入ってきたことも続けるのが難しくなってきた理由。
では、今のこのブログは何かというと、そういうアフィリエイトとかとは一線を引いた、自分の何らかをただ吐き出す場所。
AIが量産できるものではなく、実際の体験と感情とか、そういうものを中心に、ただ書く、という感じ。
ものを書くことそのものは、上手い下手はさておき、嫌いじゃない。書いていると、何か落ち着くとこともあるんだよね。無心になれるというか。
あ、ただ、今も何らかwebサイト制作的なものには関わっているので、その中で、自分の独自性というかブランディングもしていかないと、という気持ちもある。
今、このブログは、micro CMSといういわゆるヘッドレスCMSというものを使って作っているのだけど、言語としては、Pythonで作られているものだそう。（違ったらごめん）
今後のwebアプリの主流になりそうな言語だし、これであれば、これまで使っていたXServerのサーバー代を払う必要もなくなるので、良い機会だから乗り換えたって感じ。
忘れそうなので、こういう仕組みで、今のブログを作っているということを備忘がてら残しておこうと思う。
Claudeは賢いAI。
最近時間があったら、ちまちま、プログラム作業をしている。
コードを書いているというより、AIにプログラムを書かせている感じ。
今、メインで使っているのは、Claude。今めちゃくちゃ話題のAIエージェント。それのプロプランを使っている。
ClaudeのProプランは、月額3,500円くらい。１週間で利用できる量に制限があるが、個人であればそれなりに使える。（このさらに上に月額1万円くらいのMaxというプランもある。ヘビーユーズする人は、Proプランだと全く足らないと思う。）
Proプランにすると、AIチャットに加えて、Coworkという機能と、Codeという機能が使える。
また、無料プランだど、利用できるトークン（AI利用度合い）の制限値にひっかかり、しばらく使えなくなってしまうのだが、Proプランにしておけば、まぁまぁ使える。例えば30分程度AIに考えさせるような重い作業を1日3回程度AIにさせるとしたら、プロプランでは厳しいと思う。
LPを作らせるとか、提案内容を考えさせるとかであれば、内容にもよるけど、感覚的にはそこまで時間を要することはないので、思ってたよりも使えるので、プロプランで今のところ問題ないかな、という印象。
すべてのAIタスクを、Claudeにやらせるとなると厳しいので、会社が契約していて、アカウント付与されているGeminiとの併用をして、Claudeを使うのは、レベルの高い回答を求める時、コーディング作業をさせたいといった業務に特化させるようにしている。
そうすることでClaudeのトークン利用料を少しでも下げている。
CMSのテンプレート開発は、Visual Studio Code + Claude Code。
https://code.visualstudio.com/
一旦は、AIエージェントのClaude Codeを拡張機能としてVisual Studio Codeに組み込んで、左にコード、右にAIチャットという状態にして、会話しながら必要最低限できる調整をしたって感じ。正直Pythonのプログラムは全くわかってないので、そのあたりは今後やれる範囲で勉強する。
なんにせよ、Claude CodeのAIが、色々ウォッチしてくれていて、不明点があっても何らか回答を示してくれる。本当に賢くて、堂々巡りになることがまずなく、一発の回答が出ない場合でも必要な次のステップを確実に提示してくれるのがClaudeというAIに持つ印象。これまでこういう新しい取り組みしようとしたら、環境構築面でうまく進まず、にっちもさっちも行かなくなって「やーめた」になりがちだったんだけど、AIがいることでそれが本当になくなったのがありがたいポイント。
micro CMSは日本国産のCMS。個人利用であれば、無料で問題なし。
micro CMSは日本国産のCMS。個人利用であれば、無料で問題ない。Wordpressも無料ではあるが、データベースのインストール、アプリのインストールなど、色々と面倒なことが多いので、今回、今後主流になるかもしれないNext.JSというフレームワークで、Pythonという言語で開発するというmicro CMSを試してみることにした。
初めてのトライではあるので、不安はあったが、いわゆるブログ形式のものなら、micro CMSが準備しているテンプレートを使って始めるのが良いと思う。
やり方としては、アカウントを作って、テンプレートを選んで、開始する、それだけ。クレジット決済など必要ない。
注意点としては、営利活動については、無料の範囲での利用は認められていないということ。
企業サイトとして利用することはもちろん、ECサイトの機能をつけることや、個人利用だったとしてもアフィリエイトブログにしてはいけない。
実際それを機能として入れてみることはできるとは思うが、もしそれが発覚したら、止められるものと思っておいた方が良さげ。
自分の場合、これまで運用していたのが、アフィリエイトブログだったので、悩ましいとは思ったものの、先ほど言った理由で、収益も今後見込みづらいし、アフィリエイト等から離れて、ただ自分の思いの丈を書き連ねるだけのブログにしていくってことで良いと思ったから。
もちろん、Abemaブログやnoteなんかも選択肢に入ってくるし、なんならこれまで継続しているNotionに書いて、わざわざオープンにしなくていいじゃん、って話もある。
でも、なんかね、隠れた目立ちたがりなのか、FacebookやInstagramも似たようなもんよね。うっすい自己顕示欲みたいなものかも。オープンにしていることで、見られる可能性があるというモチベにも繋がる気がする。
あ、自宅で勉強するのってなんか捗らないけど、スタバで仕事したら、結構捗る、っていうのに似てるかもしれない。晒されてるって結構モチベーションに影響するものだと思うんだよなぁ。
話がそれたが、CMS（ブログ）はそんな感じ。
micro CMSはヘッドレスCMSという、装飾とコンテンツが分離したCMSなので、後から色々デザインの変更や、機能の追加は柔軟にできるらしい。
今の所、あらかじめ準備されたテンプレートをほぼそのまま使っている感じだけど、AIエージェントを活用して、あった方が良さそうという機能や、デザインもっとこうしたい、となったら手を加えていこうかなって思っている。
それはそれで楽しいものだしね。
バージョン管理は定番のGitHub。
言わずもがなのバージョン管理システム。
チームでの作業、複数拠点での作業はもちろん、個人での作業でも好きなバージョン履歴の状態に戻ることができるので、使わない手はない。
サーバはVercelというサービスを利用。これも無料。
さて、micro CMSでブログを作れたとしても、そのままだとインターネットに公開できるわけではない。
そこで活用できるのが、Vercelというサービス。これも無料で活用できる。
このVercel、簡単にいうとクラウドのサーバのようなもの。
バージョン管理システムのGitHubと連携し、Gitにプッシュしたら、自動で、こちらのVercelサーバにもコンテンツが反映するように設定できる。
そして、micro CMSとも連携できるので、micro CMSの管理画面で記事を作成して、公開したら、自動的に、Vercelのサーバにもコンテンツ反映できる。
コンテンツは、micro CMSのサービス内で管理完結しているので、本番用、開発用と別々に、コンテンツ管理する必要がない。
テンプレートをローカルで更新した場合は、ローカルの開発環境で確認し、問題なければ、Vercelにテンプレートをプッシュする形になので、テンプレートとコンテンツを切り分けて管理できるのが楽。（ただ、Vercel側でGitHubリポジトリを「連携先」として登録することで、Vercelがそのリポジトリを監視する状態になるため、配信の設定そのものはVercel側でする。
- Vercelのダッシュボードで「Import Git Repository」からGitHubのリポジトリを選ぶ
- VercelがGitHubにWebhookを自動で登録する
- 以降、GitHubにpushされるたびにWebhookでVercelに通知が飛ぶ
- Vercelが通知を受け取ってビルド＆デプロイを実行する
ドメインは、XServerドメインで管理。
ドメインについては、お名前.comでも、さくらのドメインでも使いたいものを使えば良い。
自分の場合、前のアフィリエイトブログで、XServerのドメインを使っていたので、今回はXServerのサーバ機能を解約し、XServerのドメイン管理部分だけの契約を残す形にしている。
やっていることとしては、XServerのDNSレコードで、AレコードとCNAMEレコードをVercel側で持っているIPアドレスに設定するのみ。
それをすることで、vercelという名称を含むドメインではなく、自分の好きなドメイン名をサイトに割り振ることができるようになる。
全体像で言うとこんな感じ。
つまり全体をまとめると、以下のような仕組みになる。
一見難しく見えるかもしれないけど、つまずいたらAIと会話してたら何とかできたって感じ。
こんなエラーが出てるとかって言って、そのエラーの出てる画面キャプチャをAIに渡したら、そこから次のアクション示してくれたり、場合によっては直接AIがその処理を肩代わりしてくれたりするかな本当にすごい。
なので、若干四苦八苦はしつつも、大きくつまづくこともなく、なんとか、新しいブログに、移行することができました。
前のアフィリエイトブログの記事は一旦破棄でもいいかなって思っているけど、残したい物があったら、ピックアップして再編集してこちらに持ってくることもあるかもしれない。
でも、そのブログのコンセプトが前とは違うからなぁ。多分やらなそう。
雑記ブログとしてただ、無責任に記録しとこ、って思うことをただただ、書き連ねてくって感じになりそう。