2
1

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でAWS Certified AI Practitioner試験対策サイトを構築してみた

Posted at

はじめに

はじめまして!某SI会社2Gのしらきです!

今回は、「Kiro」による仕様駆動開発を体験してみました。
AWS Certified AI Practitioner試験を控えていたので、勉強も兼ねて問題集のWebサイトを構築してみました。
開発の雰囲気をお届けできればと思います。

Kiroは公式サイトからダウンロードできます。

今回の目標

  • Kiroを使ってAWS Certified AI Practitioner試験対策のための問題集Webサイトを構築
  • インフラにはAWSを利用することで試験勉強を兼ねる

Kiroによる仕様駆動開発の流れ

1. 要件定義フェーズ

まずはKiroを起動し、任意のフォルダを指定してプロジェクトを開始します。
01_Kiro_Start_trim.png

Specモードを選択して、やりたいことの大まかなアイデアを伝えます。
今回は、以下のプロンプトで指示しました。

AWS Certified AI Practitioner の試験を受けたいと思っています。
実際の試験に近い問題集があると嬉しいですが、試験の学習も兼ねて、AWSで問題集を解きながら学習できるようなWebサイトをゼロから作成したいと考えています。
問題集はAWS内のドキュメントやWebから収集してもらえると助かります。
このWebサイトを最短で作成するための作業をお願いできますでしょうか。

02_Spec_dev_Start_trim.png

Kiroが要件をまとめた資料を作成してくれました。
03_2_requirements_doc_trim_mark.png

2. 設計フェーズ

要件資料に問題がないことをKiroに伝えると、要件資料をベースに設計を考えてくれます。
試験まで時間がないので、「2時間で構築できる最小構成を考えて」という追加の指示をしました。
05_small_stack_design.png

Kiroが提案してくれた技術構成:

  • フロントエンド: Next.js + TypeScript
  • スタイリング: Tailwind CSS
  • データ: 静的JSON(LocalStorage活用)
  • デプロイ: AWS S3 + CloudFront

3. タスク分解フェーズ

設計に問題がないことをKiroに伝えると、タスク分解してくれます。
06_2_task_list.png

4. 実装フェーズ

Kiroにタスク実行を伝えると、順番にタスクを実行してくれます。
早速エラーが発生しました。
07_2_task_start.png

開発環境をローカル環境で構築しようとしていましたので、「Docker環境での構築を行いたい」という指示をしたところ、Dockerの導入を含めた環境構築をKiroが自動で実施してくれました。
素晴らしいですね!
09_3_dev_setting.png

それでは、引き続きKiroにタスクの実施をお願いしましょう。
10_stop_dev.png

ちょっと待った!!!

スクレイピングは禁止しているWebサイトもありますので、今回は固定のデータとして問題集を作ってもらいたいと思います。

餅は餅屋ということで、Amazon Q DeveloperにAWSの試験対策用のオリジナル問題集を作ってもらいましょう。
まずは以下のプロンプトで、Amazon Q Developerに指示すべきプロンプトをKiroに提案してもらいます。

Amazon Q Developer 側で、別途問題を作ってもらって、統合することはできる?
その時の指示として、どのような形式で問題データを作ってくださいなど指示が必要ならば教えて。

11_create_data_prompt.png

出力されたプロンプトをAmazon Q Developerに対して入力しました。
12_create_problem_data.png

問題集のデータを自動で準備してくれました。
あとは、最後までタスクを実行してもらいましょう。
13_task_complete.png

途中何度かビルドエラーが出ましたが、Kiroが都度エラーを修正してくれました。

Webサイトの構築完了

Webサイトの実装が完了しましたので、インターネット上に公開したいと思います。
Kiroの指示に従い、ビルドしたファイルをS3にアップロードします。
続いて、CloudFrontにてWebサイトの配信設定をして、Webサイトの構築が完了となります。

14_s3_upload.png
15_cloud_front_trim.png

以上でWebサイトの構築が完了しました。
16_top_page.png

完成したWebサイトの主な機能は以下になります。

1. クイズ機能
17_quiz_top.png
18_quiz_detail.png

2. カテゴリ分類機能
19_category.png

3. 進捗確認機能
20_progress.png


Webサイトの開発開始から公開まで、約5時間という驚くべき早さでした。

まとめ

Kiroを使用することで、自分ではプログラムを一切書かずに、驚くほど早くWebサイトが構築できました。
ただし、AIが生成するシステム構成やプログラムは、責任を持って開発者がチェックする必要があります。

そして肝心の試験結果ですが...

🎉 AWS Certified AI Practitioner 合格!

今回構築したWebサイトで繰り返し学習した効果もあり、無事合格することができました。

皆さんもぜひKiroを試してみてください!

2
1
0

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
2
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?