9
3

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

KiroのSpec駆動でアプリを作ったので知見を共有します!

Last updated at Posted at 2025-10-07

こんにちは!

Kiroを起動すると、ボーナスクレジットが!

image.png

10/1以降にアクセスすると、1回だけもらえるようです。(参考

無料トライアルはどうなっていますか?
10 月 1 日以降、Kiro に初めてアクセスした場合(ウェイティングリストから解除された場合)、ご登録プラン(Kiro Free を含む)に関わらず、14 日間有効な 500 ボーナスクレジットが付与されます。

せっかくもらったクレジットは使わなあかんので、AWSの試験対策ができるアプリを作ってみました!

アプリはこちらです。

ソースはこちら

実際にアプリを作っての知見を共有しようと思います。

はじめのプロンプト

Specモードを使って、以下のプロンプトで作業を始めました。

AWS Certified CloudOps Engineer - Associateの試験対策として、模擬問題を生成して学習を深めるアプリケーションを作成したいです。
できれば、Strands AgentsやBedrock AgentCoreを使いたいです。ユーザーとのインターフェイスは未定です。

実際の試験問題のような形式で出題し(この時点では解答は出さない)、ユーザーが回答をした後に答えを提示しつつ、確かな情報源から解説及び学習に役立つURLやコンテンツを提示したいです。10問解いて点数を表示するようなものもありだと思います。

#URL: https://d1.awsstatic.com/onedam/marketing-channels/website/aws/en_US/certification/approved/pdfs/docs-cloudops-associate/AWS-Certified-CloudOps-Engineer-Associate_Exam-Guide.pdf

#」を入力すると、URLを指定することができます。

image.png

ただ、今回はPDFを指定してみましたが、PDFの読み取りは対応してませんでした😅

この指示を受けて、要件(Requirements)が作成されましたが、英語だったので続けて「日本語にしてください。」を指示を出すと、日本語にしてくれました。

作業してる途中で気づいたのですが、Kiroには「Steering」という機能があり、これを使うと常に日本語で出力してくれるようになりました。

開発者は日本人なので、やり取りは日本語を使用する

image.png

初回の要件は残っていないのですが、実際の試験に沿った問題数を実施するようなものになっていたので、10問チャレンジする動作を希望する旨を伝え、要件を書き換えてもらいました。

要件が確定したら、次は設計(Design)を行います。

大項目として以下の内容で生成されました。

  • 概要
  • アーキテクチャ
  • コンポーネントとインターフェース
  • データモデル

アーキテクチャはマーメイド記法で書かれていて、わかりやすいです。

image.png

ただ、コンポーネントとインターフェース以降はpythonのコードをこう書きますよという感じになって、正直、「あってるかわからん」となりました😅
一旦信用し、設計を終わらせタスクリスト作成に移りました。

タスク実行時に気づいたこと

タスクの実行方法ですが、大きく2種類あります。(他にあったら教えて下さい)

1つ目が、タスクリストファイルを開いて、「Start task」をクリックします。

image.png

この方法の場合は、新しいチャットスレッドが立ち上がり、SpecやSteeringを自動的に読み込んだうえで、タスクが開始されます。

もう一つの方法がチャットで、「タスク2を実行して」みたいに指示を出す方法です。

タスクが開始されるという点は同じなのですが、 チャットを継続する方法のほうが精度がいい(期待通りになる)感触 です。

というのも、チャットを継続すると前のタスクの内容を把握できますし、前のタスク実行中にこちらから指示した内容もわかってくれてます。

チャット継続時の注意点

なのですが、チャットを継続する場合も注意点があります。 コンテキストが長くなりすぎると、タスクが途中で止まってしまうことがあります。 中断後は、コンパクト化をして新しいチャットが始まるのですが、完全に記憶喪失になります。gitを巻き戻してそのタスクをもう一度はじめから行ったほうがいいと思います。

MCPサーバーを使おう

構築しているのがWebアプリのため、Chrome DevTools MCPを使ってみることにしましたが、控えめに言って最高です。

画面の遷移をチェックしてくれますし、デバッグ情報なども取得してくれているようです。また、(依頼したつもりはなかったけど)オフラインでの動作にも対応しているようでして、Chromeの設定をオフライン状態にしての動作確認もやってくれたりしました。 すごい!

他にContext7 MCPも使いました。Context7 MCPは、様々なフレームワークやライブラリーの正確なドキュメントを提示するものです。

Kiroがコーディングしている様子を眺めていたら、Tailwind CSSの実装に困っているようだったので、「Context7 MCPでドキュメント確認してみて」と伝えたら、その後一発で成功しました。 すごい!

なんやかんやで完成

ドーン

moritalous.github.io_aws-cloudops-quiz-app_.png

こちら

問題の回答があってるかは保証しませんw

実施したSpec

Webアプリの作成が一段落したあとで、新しいSpecを開始しました。

「問題作成をする別アプリを作成する」Spec

これは失敗しました。というのも、「バッチを叩いたら試験ができる簡易ツール」位を期待して始めたものの、なかなか重厚なコード生成が始まり、ちょっと手に負えない感じになりました。500ステップを超えるコードが複数個できてしまい、何がなんやらわからず、次のSpecに移りました。

「問題作成をする簡易ツールを作成する」Spec

「100ステップ程度の簡易ツールを作成して」と正直に伝え、再度作業を開始しました。設計のタイミングでできた仕組みがそれでも重厚に見えたので、「もっとシンプルにして!」と伝え、1ファイルのツールになりました。(最終的には300行超ですが、頭で理解できる分量になりました)

実装は結構困っている様子で、Strands AgentsのMCPサーバーがあっても、変な方向に向かう時があり、「こういう実装にして」ということを具体的に指示する必要がありました。最新情報はやっぱり不得意なのかもしれません。

「GitHub Pagesで公開できるようにする」Spec

アプリができたので、GitHub pagesに公開する作業を依頼しました。このタイミングでアプリがSPAではなくSSRであることが発覚しましたが、うまく修正もできました。

ここでもChrome Dev Tool MCPサーバーを使って実際にアクセスできるかをチェックしてもらいながら作業を進めたので、スムーズに行きました。

コミットメッセージ生成機能が最近追加されました!

先月末のアップデートで、コミットメッセージ生成機能が追加されました。

すべてのコミットをこの機能で行いました。

image.png

コミットメッセージを考えるのって意外と難しいですよね。 update とかにしてしまいがち

消費Spec

今回の開発で消費したクレジットは「412.65」でした。全てAutoモードで試しました。

image.png

ご参考まで。


さて、試験申し込みます、か。

9
3
1

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
9
3

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?