Hugoから乗り換えて正解だった。生成AIをフル活用してAstroサイトを作成した話

私が静的サイトHugoからAstroへ「引っ越した」理由

最近、生成AIが手足のように動かせるようになってから、SSG（静的サイトジェネレーター）でサイトを作るのが楽しくて仕方ありません。

もともとこのブログはHugoで作っていたんですが、少し欲が出てきたというか……。「もっとリッチなことがしたい」「ウェブアプリ的な機能も混ぜたい」と思い始めたんですよね。

そこで白羽の矢を立てたのが、 Astro でした。

さて、今回作成したのはIPA（情報処理推進機構）の資格試験対策サイトです。

ITパスポートや基本情報をはじめとしたIPAの試験。本屋に行くと、驚くほど分厚いテキストが並んでいますよね。支援士のテキストなんて、もはや鈍器ですよ……重すぎる。

最近、IPAの試験がほぼすべてCBT方式（PCでの受験）に切り替わりました。なら、学習環境もPCやスマホに最適化したほうがいいんじゃないか？と思ったのがきっかけです。

「分厚いテキストをめくるより、隙間時間にスマホで過去問をポチポチ解ける環境を作りたい」

そう思って、出題アプリを内蔵したサイトを作ることに決めました。

スマートフォンが本の影を落とす、デジタルへの移行を象徴するイメージ

今回は「自分でコードを書く」というより「AIと対話して形にする」スタイルを貫きました。使ったツールはこんな感じです。

開発はまさに「 AIエージェントとのセッション」でした。

PythonでPDFからテキストを引っこ抜き、それをGeminiに食わせて問題データに変換。 Astroの面倒なパラメータ設定はAIに一任し、自分は「どんな体験を作りたいか」に集中する。

構想は1月頃でしたが、実質的な開発は1月末から。気づけば2月22日の「猫の日」には、全自動デプロイまで含めて完成してしまいました。 AIがいなければ、数ヶ月はかかっていた内容だと思います。

面白いのが、モデルによって「得意な役割」が明確に違うことですね。

コーディングのエラーを減らし、スッキリしたUIを作るなら Claude Opus 。爆速で大量の処理を回し、全体の骨組みを組むなら Gemini 3.0 Pro / Flash 。

特にFlashモデルは、プロンプトさえしっかりしていれば、驚くほど高精度な処理を低コストで返してくれます。 GeminiCLIを使って、タイトルを100個ブワーッと生成する時の爽快感は異常でした（笑）。

複数のホログラフィック画面が接続された未来的なワークスペース

よく「AIでLP（ランディングページ）を作ろう！」なんて動画を見かけますが。私はいつも「中身（コンテンツ）はどうすんねん」と思っていました。

今回作った「Syllabus Hack」は、単なる情報の羅列ではありません。

AIを使ってどう効率化するかという「方法」と、実際に動くアプリという「体験」。その両方を1つにパッケージすることを目指しました。

個人開発は、AIという翼を得て、今や「不可能」の境界線がほとんど消えかけています。皆さんも、自分の中の「あったらいいな」を、AIと一緒に形にしてみませんか？

それでは。