Articles

ご覧のとおり、活用会のHPを作りました。せっかくなので、どういう構成で作ったのかをぜんぶ公開しておきます。方針はひとことで言うと「とにかく軽く手軽に」。

01

インフラは超シンプル

インフラはCloud Runのみ。フレームワークはNext.jsです。WordPressなどのCMSも入れていないので、この記事もぜんぶMarkdownで書いてGitHubにつっこんでいます。簡単ですね。

更新は月数回程度なので、無理してCMSを入れるよりこの方が軽量だし、メンテナンスも楽という理屈です。

02

お問い合わせも無料で完結

お問い合わせはResendを使えばメールで受信もできるんですが、手軽さを徹底的に追求しているため、GCPのログに残してアラートで主催者のメールアドレスに配信するようにしています。おかげでこれも無料。

03

コーディングはもちろんClaude Code

このサイトも例に漏れず、コーディングはもちろんClaude Codeです。デザインはClaude Design。ここまでくるととてもProプランでは対応できず、当然Maxプランを契約しています。

04

目玉はスクロール連動動画

このサイトの特徴は、なんといってもトップのスクロール連動型動画です。これはもともとHiggsfieldのMCPを使って手動でチマチマした作業が必要だったんですが、最近公開されたscroll-worldというプラグイン（https://github.com/oso95/scroll-world）を使うとかなり楽にできます。

とはいえHiggsfieldの料金は別途かかります。当サイトは試行錯誤もあって、大体3,000円くらいだったと思います。

動画の整合性や、スマホで読み込んだ際は強制ロードなど、まだまだ改善点はあるので直したいですね…。