こんにちは、スタッフのやまさきです。
梅雨が明けて暑くなってきました。とはいえ、本格的な夏にはまだまだ、と思ってますが。
前回の記事では、ChatGPTを活用してRuby Silver試験対策Webアプリの設計を行いました。
- 要件定義
- データベース設計
- 画面設計
- GitHub連携方式
- 開発ロードマップ
までを整理し、実装可能な状態まで設計を固めました。
今回は、その設計書をもとにClaude Codeを活用して実際にLaravelアプリを構築したプロセスをご紹介します。
なぜWebアプリ化したのか
現在、専門学校でRubyの指導を行っており、学生たちはRuby技術者認定試験 Silverの受験を予定しています。
試験対策としてオリジナル問題集を作成し、GitHub上で公開しています。
問題作成自体は、高校教員時代に培った作問経験を活かしながら進めることができました。しかし、問題数が増えてくると次のような課題が見えてきました。
- 学習履歴が残らない
- 正答率が把握できない
- 苦手分野を分析できない
- 模擬試験形式で学習しづらい
そこで、GitHubで管理している問題を活用しながら学習できるWebアプリの開発を始めました。
開発期間はわずか1.5日
今回の開発で特に驚いたのはスピードです。
- 設計：半日
- 実装：1日
合計約1.5日で、動作するMVP（最小実用製品）まで到達しました。
もちろん、完全にAI任せではありません。
AIが生成したコードを確認し、
- 実際に動作するか
- 要件通りか
- 学習サービスとして使いやすいか
を人間がレビューしながら進めています。
Claude Codeへの指示方法
今回のプロジェクトでは、一気に作らせるのではなくフェーズごとに指示を出しました。
例えば、
- 認証機能
- データベース構築
- 1問1答機能
- 模擬試験機能
- ダッシュボード
- 管理画面
という単位で区切りながら開発しています。
その結果、問題が発生しても影響範囲を限定でき、修正も容易になりました。
実装されたコード量
完成したアプリケーションは想像以上に本格的なものになりました。
バックエンド
- Models：9ファイル
- Controllers：5ファイル
- Service：1ファイル
- Middleware：1ファイル
約1,200行
フロントエンド
- View：27ファイル
約2,000行
データベース
- Migration：10ファイル
約340行
合計
約3,600行
Laravelアプリとしては十分実用的な規模です。
実装した主な機能
1問1答モード
ランダムに問題を出題し、回答後すぐに採点と解説を表示します。
知識の定着を目的とした学習モードです。
模擬試験モード
実際の試験を意識した50問構成です。
- Round1〜Round6を混在出題
- 制限時間90分
- 最後に一括採点
という流れになっています。
ダッシュボード
学習状況を可視化する機能です。
- 総回答数
- 正答率
- 学習履歴
- 週間学習状況
- 月間学習状況
を確認できます。
GitHub連携
今回の特徴の一つが問題管理です。
問題データはGitHub上で管理しています。
Round1〜Round6まで、
- 各50問
- 合計300問
をJSON形式で保存しています。
管理画面から同期を実行すると、GitHub上の問題を自動でデータベースへ反映できます。
Claude Codeは一発で完成するのか？
結論から言うと、一発では完成しません。
今回も実装中に10回以上の修正が発生しました。
（質問も加えると100回程度になると思います）
例えば、
- 複数選択問題の判定ミス
- 学習統計が表示されない
- タイムゾーンの不一致
- レイアウト崩れ
などです。
しかし興味深かったのは、エラー内容を伝えるとClaude Codeが原因を特定し、修正案まで提示してくれることでした。
人間は、「何が起きているか」を確認し、「修正内容が妥当か」を判断する役割に集中できます。
人間の役割はなくなるのか
今回の開発を通じて感じたのは、人間の役割はなくならないということです。
むしろ重要性は増しています。
Claude Codeは大量のコードを高速に生成できますが、
- 要件が正しいか
- 実装方針が適切か
- UIが使いやすいか
- 本当に解決したい課題を満たしているか
は人間が判断する必要があります。
実際、今回もAIが「完成しました」と返した後に動作確認すると問題が見つかるケースが何度もありました。
最終的な品質を担保するのは人間です。
今後の展開
現在はローカル環境で動作確認が完了しています。
今後は、
- レンタルサーバへのデプロイ
- Google AdSense導入
- セキュリティ強化
- パフォーマンス最適化
を進めた上で一般公開する予定です。
まとめ
今回のプロジェクトでは、
- ChatGPTで設計
- Claude Codeで実装
- 人間がレビュー
という役割分担で開発を進めました。
結果として、約300問を管理するLaravel製学習サービスを短期間で構築できました。
AIは開発者の代わりになる存在ではなく、優秀な開発パートナーです。
設計、実装、テスト、それぞれの工程で適切に活用することで、開発スピードと品質の両立が可能になると感じています。
これからAIを活用した開発に取り組む方の参考になれば幸いです。
