Amazon Q Developer Pro CLIで簡単アプリ作成

# はじめに
こちらは、Amazon Q Developer Pro CLIを使って、入力した自然言語からノーコーディングでアプリケーションを作成する記事になります。この記事では、Amazon Q Developer ProをAWSアカウントでサブスクリプリョンを有効にした状態から、CLIの設定とアプリの作成を紹介します。

# Amazon Q Developer Pro CLIとは

CLIを使って、Amazon Qを呼び出し、入力した質問に対して回答を返したり、コード生成などを行うことができます。

1ユーザーあたり19ドル/月かかる有料サービスとなっており、無料で使用できるAmazon Q Developerより、機能の上限が緩和されています。

両者の比較はAWSのサイトに記載されています。
https://aws.amazon.com/jp/q/developer/pricing/

# 使用する環境の注意点
2025/3/30現在、Amazon Q Developer Pro CLIは、MacまたはLinuxのみ使用できます。windows環境は使用できません。

# Amazon Q Developer Pro をCLIに設定する手順

今回は、Macを使用した手順を記載します。

1. AWSのガイドから、Amazon Qをダウンロードし、PCにインストールします
https://docs.aws.amazon.com/ja_jp/amazonq/latest/qdeveloper-ug/command-line-installing.html


2. インストール後に、Amazon Q を起動します
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3671603/d5eef888-9311-4183-8073-94b9b454f84b.png)

3. Get Startedをクリックします
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3671603/44b243f9-e254-43ab-9622-6c0b2c5738cb.png)

4. 有料版を使用するため、Use with Pro licenceをクリックします
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3671603/a97981c3-9c62-4936-a437-d2f4935c1256.png)

5. AWSでAmazon Q Developer Proを有効にしたユーザの、IAM Identity CenterのURLを、Start URLを入力します
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3671603/fb5354fa-79bf-4528-9f2e-eb6203ba482a.png)

6. ブラウザが起動して、AWSのログイン画面が表示されるので、ログイン操作をします。ログイン操作の画面は割愛します

7. ログインが完了後に、Amazon Q Developerを許可する画面が表示されるので、アクセス許可を押します
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3671603/a8d93666-98de-4466-8ac9-39084f889071.png)

8. アクセス許可を押下後、こちらの画面が表示されたら、ブラウザ上の操作は完了になります
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3671603/6cf77194-dda0-42f0-bebf-f9c70784d486.png)

9. 2で起動したAmazon Qのアプリ画面に戻り、Integrationsをクリックして、許可したいCLIをクリックしてEnableにします。（私は、TerminalとVS Code TerminalをEnableにしました）
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3671603/34149ab8-8dce-4c54-a58a-7769af1ff895.png)

これで設定は以上となり、CLIからAmazon Q Developer Pro CLIを使用できます。

# CLIでアプリ作成
早速CLIで、自然言語を使用してノーコーディングでアプリ作成をしてみます。今回は、簡単な例として、時刻をブラウザ上で表示するアプリを作ってみます。自然言語はまだ、日本語対応してないため、英語で記述します。

コマンドはこちらを実行しました。
```
q translate "Create html for a clock application that runs in a browser" 
```
`q translate `で、自然言語でコーディングする意味になります。
`"Create html for a clock application that runs in a browser" `
は時刻表示をブラウザで実行する記述を英語にしています。

先ほどのコマンドを実行すると、echoコマンドで生成されたコードに加え、Execute command〜cancelが表示されます。今回はすぐ実行したいので、Execute commandをEnterキーを押して実行します。（Execute command〜cancelの間は、十字キーで移動できます。）

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3671603/4a75909d-c4e1-49ca-a248-7ba83525ddbc.png)

コマンド実行後、clock.htmlが生成されていました。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3671603/d7931659-14f6-48e0-b2c4-c07557b59e4b.png)

clock.htmlを実行すると、現在時刻が表示さていました。また、PCの時刻とも比較しても揃っているため時刻同期もできてました。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3671603/9d9e5d0a-36b2-492b-9844-b39e78406b21.png)
PCの時計と比較しても、時間の同期はできていることが確認できました。


# まとめ
自然言語で、アプリを作ってとCLIに入力して実行したら、アプリのコードを生成してファイル出力するまで一気にできるのは便利だと感じました。
Amazon Q Developerは、まだ使い始めたばかりですが、今後も、より高度なアプリ生成も生成できるか試してみようと思います。