Amazon CodeWhispererのはじめかた

# Amazon CodeWhispererのはじめかた
### はじめに
将来何かの役に立つかもしれない、開始手順で間違っていたら見返るからという理由でQiitaに残しています。

### Builder IDの作成
#### 1. AWSビルダーの作成にアクセスする
[こちら](https://us-east-1.signin.aws/platform/login?workflowStateHandle=d25755bb-7134-4be5-a17f-1c73636b4a59)にアクセスすると、以下の画像の画面に到達する。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3344320/d044452d-da1f-89ef-4986-761b0f4422bc.png)

#### 2. メアドを入力する
［Eメールアドレス］の箇所に自分のメールアドレスを入力する。入力したメールアドレス宛に６桁の認証コードが届く。（件名は「Verify your identity」、メアドはno-reply@login.awsapps.com）

![無題.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3344320/236d809c-a8a8-ef43-98d8-4f8ce404f51b.png)

#### 3. 認証コードを入力する
［認証コード］に入力して、［Verify］をクリックする。正常するとパスワード設定画面に遷移する。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3344320/8ec2bf6d-24e4-83a5-3374-6b349aab6a4a.png)

#### 4. パスワードを設定する
パスワードには次のものを使用する。
+ 8～64 characters
+ 大文字 &amp; 小文字
+ 数値
+ 英数字以外の文字

入力したら［AWSビルダーIDの作成］をクリックします。

#### 5. 失敗...??
私は以下の画像のような画面に案内されました。［Try again］を押しても何も起こらない....。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3344320/a81f85b5-b33d-0a62-1210-8cd01d710e9a.png)

#### 6. 一番最初からやってみる
そこで再度以下の画面に行きメアドを入力しました。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3344320/d044452d-da1f-89ef-4986-761b0f4422bc.png)

#### 7. 作成完了
すると、パスワード入力画面がでてきました。先ほど作成したパスワードを入力して［サインイン］をクリックすると問題なく作成できていたようです。

![無題.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3344320/71d070c5-2f91-75bf-9abf-1b50f71b6614.png)


### VsCodeでつかってみる

#### 1. 準備
準備としてVscodeにAWS Toolkitをインストールする必要があります。

https://marketplace.visualstudio.com/items?itemName=AmazonWebServices.aws-toolkit-vscode

#### 2. サインイン
Amazon Codewhispererにサインインする。
![無題2.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3344320/329fed57-5686-37ba-c6b7-d5da03b6347a.png)

#### 3. 接続を開始する
CodeWhisperer > StartでStartをクリックする。

![無題3.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3344320/8bfac916-cbdf-45d0-3ffc-a3d12290372d.png)

黄色枠を選択すると以下の案内がでました。
[Copy Code and Proceed]をクリックしてコードをコピーする。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3344320/ac416e03-7d98-6465-c220-b1b74248c6e1.png)


![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3344320/4e66582e-f082-9cec-0b91-31e2eca64151.png)

［開く］をクリックする。

#### 4. AWS Builder IDにログインする
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3344320/e77639c3-ee03-0ee7-3bc2-c9f6be129b7d.png)

先ほどコピーしたコードをペーストする。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3344320/a94feb33-13b6-f10d-14d1-39450aa22813.png)

Nextをクリックすると以下の画面に遷移する。
必要な情報を入力する。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3344320/104799c4-9b01-cf3f-bbbd-f4130a02b0db.png)

許可する。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3344320/89d905ae-b266-a6c3-8401-675d72905d36.png)

うまくいくと以下の画面がでる。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3344320/0d58d35b-834c-8616-e957-5bd547d98fc6.png)

#### 4. Vscodeに戻る
画像をキャプチャし忘れたが、Vscodeに戻り、[Yes, keep using AWS Builder ID with CodeWhisperer while using profile:default with other...]を選択する。
すると、CodeWhisperer のメニューが追加される。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3344320/eeda8453-8a8e-9ec2-da46-fe851f8b2374.png)


# おわりに
手順自体はそれほど難しくありませんでした。
確実にこの記事よりも以下の記事を確認するほうが良いです。
参考までに。

https://dev.classmethod.jp/articles/amazon-codewhisperer-individual-vs-code/