目次

• 概要
• 技術選定
  • AIエージェント
    • 課題
  • ホスティング
  • イラスト生成
• まとめ

概要

「退職コンサルティング」という架空のビジネスのランディングページを公開しました。

• 公開URL↗
• リポジトリ↗

友人との会話の中で、冗談交じりに「こんなビジネスあったら面白いかもね」とアイデアを投げかけられたのが出発点でした。せっかくなので、それを題材にLPを作成し、公開できる形で仕上げてみることにしました。

純粋にポートフォリオのためというよりも、誰かのために作るという動機がある方がモチベーションが上がりやすいと考えてのことです。

技術選定

AIエージェント

Spec Kit↗とGemini CLI↗を採用しました。

Spec KitはたまたまX(旧Twitter)で見かけ、仕様駆動開発という思想に共感したため取り入れることにしました。この生成AI時代に必要な考え方およびツールだと感じました。AmazonのKiro↗と近い発想ではないかと思います。

Gemini CLIに関しては、Claude CodeやCodexなど含めCLIで動作するエージェントが大きな話題になっているため、無料で使えるものを触れてみようと考えました。

最初はGemini CLIを試し、慣れてきたところでSpec Kitを使い始めましたが、Spec Kitのコンセプトを考えると最初から使い始めるほうがよかったと後悔しました。

課題

非常に便利ではあるものの完璧な体験とはいえず、以下のような不満を感じることがありました。

• Windows環境だとbashをそのまま使おうとしてエラーに遭遇する場面が多々ありました。結局エージェントが自律的にWSLに切り替えて解決はするのですが、GEMINI.mdでカスタム指示を与えて、環境や使うべきコマンドを明示しておくべきだったかもしれません。
• 日本語でプロンプトを入力しても、英語でplanやtasksを記載するため読むのが辛かったです。
• 思わぬコマンドを使用しようとするなど危険を感じることがあり、まだすべてを承認するには抵抗を感じるため毎回確認を取るようにしています。また、Git操作まで実行してはくれしますが、エージェントに任せる必要はないと思います。
• レート上限にぶつかってGemini Flashに自動で切り替わり、結果として作業を継続できなくなりエージェントが停止する場面がありました。
• 時折エージェントがタスクに苦戦することがあり、「自分でやった方が早かったかな」と感じました。
• コーディング用エージェントですし特段工夫をしなかった部分なのでやむを得ないとは思いますが、デザイン面では平凡な結果になったと思います。
• これは自分自身の問題というべきですが、エージェント任せにして楽をしたいという誘惑があり、成長のために抗わなくてはいけないと思いました。

ホスティング

Netlify Drop↗にて公開しました。

以前の職場で試したことがあり非常に便利でしたが、結局は業務で採用する機会はありませんでした。

今回、モジュールバンドラなどの導入をせずシンプルな静的サイトとして作成したところ、Cloudflare Workersで簡単に公開できず(ビルドに失敗)、Netlify Dropを思い出し利用してみました。今思うとCloudflare Pagesでもよかったかもしれませんが、公式で新規プロジェクトにはPagesではなくWorkersを推奨している↗ようなので、Netlify Dropで正解だったかもしれません。

Netlify Dropを使ってみて、やはりデプロイがドラッグアンドドロップで済むのは、速度と簡便さという点で大いにメリットを感じました。

イラスト生成

今回、サイト内のイラストはChatGPTに生成してもらいました。

ChatGPTにも絵柄があると感じているので、いかにもAIに生成させたような仕上がりになってはしまいました。ただ、統一感を出せたのは悪くなかったと思います。

まとめ

今回の制作を通じて、AIツールを「補助」として活用しつつも、自分で考えて手を動かすことの重要性を再認識しました。まだまだ課題はありますが、今後も改善を重ねながらポートフォリオを充実させていきたいと思います。