AIを使ったWebアプリ開発を行って感じたこと

はじめに

こんにちは。クラウド活用推進担当の安田です。今回は、AIアシスタントツールのGenUとQ Developer Proを使って実際にWebアプリケーションを開発し、それぞれの特徴や使い分けについて体験談をまとめたいと思います。

プログラミング初心者の私が、どちらのツールを使ってどのようなシステムを構築できたのか、実際の開発体験を通じて感じた違いを詳しく解説します。

目次

  1. 開発したWebアプリの概要
  2. 使用したAI開発ツールについて
  3. 開発の進め方と使い分け
  4. 共通して良かった点
  5. 共通して困った点
  6. GenUの特徴
  7. Q Developer Proの特徴
  8. 開発期間とコストパフォーマンス
  9. 推奨する使い分け戦略
  10. 最後に

開発したWebアプリの概要

今回開発したのは、以下のサービスで構成されたWebアプリケーションです。


構成

  • フロントエンド: HTML/CSS/JavaScript (AWS Amplify)
  • バックエンド: Python 3.13 (AWS Lambda)
  • データベース: DynamoDB + Amazon Athena
  • インフラ: AWS (API Gateway, S3)
  • アーキテクチャ: サーバーレス構成

開発未経験の人が1人で開発するには長い期間が必要ですが、AI開発ツールを活用することで大幅に開発期間を短縮できました。

使用したAI開発ツールについて

項目 GenU Q Developer Pro
提供元 Amazon Web Services Amazon Web Services
使用モデル Claude Sonnet 4 Claude Sonnet 4
特徴 AWS公式が提供するオープンソースの生成AIデモアプリケーション IDE統合型のAI開発支援ツール、CLI環境での操作が可能

両ツールとも同じAIモデルを使用していますが、提供形態や機能に大きな違いがありました。

開発の進め方と使い分け

開発フェーズ別の使い分け

前半(要件定義・基本設計): GenU使用

  • 要件の整理と技術選定の相談
  • システムアーキテクチャの検討
  • 類似サービスとの比較検討
  • 基本的なコード構造の設計

後半(実装・デプロイ・運用): Q Developer Pro使用

  • 実際のコーディング作業
  • ファイル間の整合性管理
  • AWS環境へのデプロイ
  • エラー対応と機能追加

この使い分けにより、それぞれのツールの強みを最大限活用できました。

共通して良かった点

1. 開発経験がなくても本格的なシステムが作れる

プログラミング初心者の私でも、Webアプリケーションを完成させることができました。

コード生成機能により、複雑なAWSサービス連携も実現できました。

2. 優れたエラー対応支援

エラーが発生した際に、どのような処理をするべきかを具体的に提案してくれます。

「任せます」と言うだけで、適切な解決策を実装してくれるのは非常に助かりました。

3. 要件定義段階からの相談が可能

技術選定の段階から相談に乗ってくれるため、類似サービスと比較しながら最適な構成を検討できました。

特に初心者の私にとっては、この段階での支援が非常に価値がありました。

4. 学習効果が高い

実装しながらベストプラクティスを学習でき、AWSサービス連携の理解が深まりました。

単純にコードを生成するだけでなく、なぜその実装が良いのかも説明してくれます。

共通して困った点

1. 指示の明確性が重要

曖昧な指示を出すと、意図しない修正が行われることがあります。

: ある部分の変更指示を出したところ、関係のない他機能の改善点も見つけて一緒に修正を始めてしまい、予期しない動作になることがありました。

対策: 修正範囲を明確に指定し、「この機能のみ修正して」と限定的な指示を出すことが重要です。

2. セッション管理の制限

新しいチャットを始めると、以前のやり取りを記憶していないため、毎回コンテキストを説明し直す必要があります。

対策: 重要な設定情報や仕様は別途ドキュメント化し、新しいセッションでも素早く状況を共有できるようにしました。

GenUの特徴

良い点

1. 高品質なコード生成

生成されるコードの品質が高く、実際に動作するコードを提供してくれます。

エラーコードを渡すと、具体的にどこを確認すればよいかを教えてくれます。

2. 継続的なコード生成

コードが長すぎて途中で生成が止まっても、「続けて」と指示するだけで再開してくれます。

大規模なファイルの生成時に非常に便利でした。

3. 簡単な導入

GenU環境があれば追加のインストールが不要で、すぐに使い始められます。

ブラウザだけで完結するのは大きなメリットです。


微妙だった点

1. ファイル添付の制限

添付できるファイルの形式やサイズに制限があるため、大きなコードファイルはチャットに直接貼り付ける必要がありました。

2. 複数ファイル管理の困難さ

アプリ開発が進んでファイル数が増えてくると、1箇所の修正に合わせて他のファイルも修正する必要があります。

しかし、ユーザーが変更箇所を把握していないと渡し忘れたファイルが出てきて修正漏れが発生し、エラーが出てしまいます。

3. デプロイ機能なし

コード生成はできますが、実際のデプロイは別途手動で行う必要があります。

Q Developer Proの特徴

良い点

1. ローカルファイルシステムとの統合

WindowsのWSLでQ Developer CLIを使用することで、ローカルにあるフォルダを直接読み取ってくれます。

ファイルパスを渡すだけで、複数のファイルを一度に処理できます。

2. 直接的なファイル操作

ファイルを直接修正してくれ、さらにデプロイまで自動で実行してくれます。

開発からリリースまでの一連の流れを自動化できました。

3. AWS環境との連携

AWS CLIを通じてAWS上での設定状況も確認してくれるため、インフラの状態を把握しながら開発を進められます。

4. 依存関係の自動管理

必要なモジュールがあれば自動でインストールしてくれるため、環境構築の手間が大幅に削減されました。


微妙だった点

1. 影響範囲の指示が必要

機能の修正をする際に、影響のあるファイルの修正も行うように明確に指示しないと、修正を忘れてエラーが出ることがあります。

指示さえすればエラー無く変更をしてくれます!

対策: 「○○機能に影響するすべてのファイルを修正して」と具体的に指示することで、エラーなく変更できました。

開発期間とコストパフォーマンス

開発期間

  • 要件定義・設計フェーズ(GenU使用): 約3週間
  • 実装・デプロイフェーズ(Q Developer Pro使用): 約4週間
  • 総開発期間: 約7週間


開発未経験者1人で開発していたら何か月かかるか分からないようなシステムを、7週間で完成させることができました。


生産性向上の効果

  • コード生成による開発速度向上
  • エラー対応時間の短縮: AI が解決策を即座に提案するため、デバッグ時間が大幅に短縮
  • 学習コストの削減: 実装しながらベストプラクティスを学習できるため、効率的にスキルアップ

推奨する使い分け戦略

実際に使ってみて

実際に両ツールを使ってみて分かったのは、企画・要件定義段階では大差がないが、コーディング段階ではQ Developer Proが圧倒的に有利ということです。


企画・要件定義段階での比較

システムの企画や要件定義、技術選定の相談段階では、GenUとQ Developer Proに大きな差はありません。

同じClaude Sonnet 4を使用しているため、回答の品質は同等です。この段階では、ブラウザで手軽に始められるGenUが若干便利な程度の差しかありません。


コーディング段階での圧倒的な差

しかし、実際にコーディングを始めると、Q Developer Proの優位性が圧倒的になります。

以下の機能により、開発効率が大幅に向上します:

  • ファイル管理の自動化
    複数ファイルの同期修正が自動で行われる
  • デプロイの自動化
    コード生成からデプロイまで一連の流れが自動化
  • 環境連携
    AWS CLIとの連携により、インフラ状態を把握しながら開発可能
  • 依存関係の自動管理
    必要なモジュールの自動インストール


初心者向けの段階的アプローチ

プログラミング初心者の場合は、以下の段階的アプローチが有効です:

推奨フロー:
  1. GenUで慣れる
    ブラウザベースで手軽にAI開発支援を体験
  2. 基本的な相談・企画
    要件定義や技術選定をGenUで相談
  3. Q Developer Proに移行
    本格的なコーディング段階でQ Developer Proを導入
  4. 継続的な開発・運用
    Q Developer Proで効率的な開発サイクルを確立


結論:コーディングするならQ Developer Pro一択

企画段階では両ツールに大差はありませんが、実際にシステムを開発するなら、Q Developer Proが必須と言えます。

特に以下のような場合は、最初からQ Developer Proを使うことをお勧めします:

  • 本格的なWebアプリケーション開発
  • 複数ファイルにわたる大規模な修正
  • AWS環境への継続的なデプロイが必要


一方、以下の用途であれば、GenUでも十分対応可能です:

  • プログラミング学習・教育目的
  • 簡単なコードスニペットの生成
  • 技術的な相談・質問
  • アーキテクチャ設計の検討

最後に

GenUとQ Developer Proを使った開発体験を通じて、AI開発ツールの可能性を実感しました。

企画段階では両ツールに大差がないが、実際の開発段階ではQ Developer Proが圧倒的に優位ということです。


プログラミング未経験者でも、適切なツール選択により本格的なシステム開発が可能になる時代が到来しています。

初心者の方は、まずGenUでAI開発支援に慣れ、本格的な開発段階でQ Developer Proに移行するという段階的アプローチをお勧めします。

一方、既にある程度の開発経験がある方や、最初から本格的なシステム開発を目指す方は、Q Developer Proから始めることで、より効率的な開発が可能になるでしょう。


今後、企業のDX推進において、このようなAI開発ツールの活用は必須になると考えています。

適切なツール選択と明確な指示により、開発効率を大幅に向上させることができるでしょう。

AI開発ツールの導入を検討されている方の参考になれば幸いです。ここまで読んでいただき、ありがとうございました。


参考

GenU

Amazon Q Developer

クラウド基盤ソリューション