Tweet
Tweet

Slide 1

Slide 1 text

第16回 雲勉LT【オンライン】 Amazon CodeWhispererを 使った開発を体験してみる

Slide 2

Slide 2 text

アジェンダ 2 1. 本⽇のゴール 2. ⾃⼰紹介 3. Amazon CodeWhispererとは 4. Amazon CodeWhispererを使ってみる 5. まとめ 4-1. 事前準備 4-2. 実装例① 4-3. 実装例②

Slide 3

Slide 3 text

1. 本⽇のゴール 3

Slide 4

Slide 4 text

1. 本⽇のゴール 4 n Amazon CodeWhispererについての理解 • 環境構築および使⽤⽅法を理解する • どのような場合に有⽤かを理解する

Slide 5

Slide 5 text

2. ⾃⼰紹介 5

Slide 6

Slide 6 text

2．講師⾃⼰紹介 6 n 林⽥ 玲⾳ • クラウドインテグレーション事業部 開発第⼆セクション 第三開発グループ • 社内SE→オープン系SIer→ヘルステック⾃社開発→アイレット • アイレット歴 約2年 • バックエンド経験が多め • 好きなもの、お家・ゲーム・観葉植物・キーボードいじる

Slide 7

Slide 7 text

3. Amazon CodeWhispererとは 7

Slide 8

Slide 8 text

3．Amazon CodeWhispererとは 8 n いわゆるAIコードジェネレーター • ⾃然⾔語 (英語) で記述されたコメントを理解し、コードの提案をリアルタイムで⽣成 • AWS API向けに最適化 • AWS版GitHub Copilotとも⾔える n 主要なプログラミング⾔語のサポート • Python、Java、JS、TS、C#、Go、Rust、PHP、Ruby、Kotlin、C、C++、etc... n 料⾦体系 • 個⼈プラン（無料）とプロフェッショナルプラン（19USD/⽉） • ユーザー単位の課⾦（1⽉でアクセスできるユーザー数）

Slide 9

Slide 9 text

4. Amazon CodeWhispererを使ってみる 9

Slide 10

Slide 10 text

4-1．Amazon CodeWhispererを使ってみる - 事前準備 - 10 n CodeWhispererを使った開発の流れ • AWS Builder IDを⽤意する • AWS ToolKitをインストール • AWS Builder IDで認証 • VS Codeでコメントを記述し使ってみる • Lambdaを動かしてテスト

Slide 11

Slide 11 text

11 n AWS Builder IDを⽤意する • https://profile.aws.amazon.com/へアクセスし、アカウント作成 メールアドレス、パスワードを⼊⼒し、 アカウント作成 4-1．Amazon CodeWhispererを使ってみる - 事前準備 -

Slide 12

Slide 12 text

12 n AWS ToolKitをインストールする • 拡張機能から「AWS Toolkit - Amazon Q, CodeWhisperer, and more」をインストール 4-1．Amazon CodeWhispererを使ってみる - 事前準備 -

Slide 13

Slide 13 text

13 n AWS Builder IDで認証 • VS Codeから認証を開始 4-1．Amazon CodeWhispererを使ってみる - 事前準備 -

Slide 14

Slide 14 text

14 n AWS Builder IDで認証 • Builder IDでログインし、認証を完了させる 4-1．Amazon CodeWhispererを使ってみる - 事前準備 -

Slide 15

Slide 15 text

15 この状態になれば、準備OK n AWS Builder IDで認証 • サインインが完了したら、準備完了 4-1．Amazon CodeWhispererを使ってみる - 事前準備 -

Slide 16

Slide 16 text

4-2．Amazon CodeWhispererを使ってみる – 実装例① - 16 n 例︓S3、SESを利⽤したLambdaを作成 • S3からCSVを読み込む • CSVの内容をログに出⼒ AWS Cloud AWS Lambda Amazon Simple Storage Service (Amazon S3) CSV読み込み ログ出⼒ Amazon CloudWatch

Slide 17

Slide 17 text

17 n VS Codeでコメントを記述し使ってみる • 前準備︓「hayashida-kumoben-test」 S3バケットに”test.csv”を格納 4-2．Amazon CodeWhispererを使ってみる – 実装例① -

Slide 18

Slide 18 text

18 n VS Codeでコメントを記述し使ってみる • 英語でコメントを記述 ・環境変数からS3バケット名を取得 ・S3バケットから”test.csv”を取得 ・”test.csv”の内容をログに出⼒ 4-2．Amazon CodeWhispererを使ってみる – 実装例① -

Slide 19

Slide 19 text

19 n VS Codeでコメントを記述し使ってみる • 英語でコメントした場合の実際の挙動 コードが⽣成された︕ 4-2．Amazon CodeWhispererを使ってみる – 実装例① -

Slide 20

Slide 20 text

20 n VS Codeでコメントを記述し使ってみる • ⽇本語でも試してみる ⽇本語でもコード⽣成できた︕ 4-2．Amazon CodeWhispererを使ってみる – 実装例① -

Slide 21

Slide 21 text

21 n Lambdaを動かしてテスト • VS Codeで⽣成したコードを試してみる コードを貼り付けてTest 4-2．Amazon CodeWhispererを使ってみる – 実装例① -

Slide 22

Slide 22 text

22 n Lambdaを動かしてテスト • VS Codeで⽣成したコードを試してみる CSVの内容がログ出⼒されている 4-2．Amazon CodeWhispererを使ってみる – 実装例① -

Slide 23

Slide 23 text

23 n Lambdaを動かしてテスト • VS Codeで⽣成したコードを試してみる CloudWatchにも問題なく出⼒されている 4-2．Amazon CodeWhispererを使ってみる – 実装例① -

Slide 24

Slide 24 text

24 n 例︓S3、SESを利⽤したLambdaを作成 • S3からCSVを読み込む • CSVの内容からメールアドレスを取得 • 取得した宛先にメールを送信 AWS Cloud AWS Lambda Amazon Simple Storage Service (Amazon S3) CSV読み込み メール送信 Amazon Simple Email Service (Amazon SES) Email 4-3．Amazon CodeWhispererを使ってみる – 実装例② -

Slide 25

Slide 25 text

25 n 例︓S3、SESを利⽤したLambdaを作成 • 下記CSVをS3バケットに格納 ※2列⽬のメールアドレスを読み込む想定 • メールアドレスをSESで検証済みにしておく 4-3．Amazon CodeWhispererを使ってみる – 実装例② -

Slide 26

Slide 26 text

26 n 例︓S3、SESを利⽤したLambdaを作成 • コメントを記述 4-3．Amazon CodeWhispererを使ってみる – 実装例② -

Slide 27

Slide 27 text

27 n 例︓S3、SESを利⽤したLambdaを作成 • コードを⽣成 ざっくりしたコメントでも、 意図を汲み取って⽣成してくれる 4-3．Amazon CodeWhispererを使ってみる – 実装例② -

Slide 28

Slide 28 text

28 n 例︓S3、SESを利⽤したLambdaを作成 • ⽣成されたコードでLambdaを動かしてみる Fromアドレスのみ修正 4-3．Amazon CodeWhispererを使ってみる – 実装例② -

Slide 29

Slide 29 text

29 n 例︓S3、SESを利⽤したLambdaを作成 • ⽣成されたコードでLambdaを動かしてみる 正常終了している 4-3．Amazon CodeWhispererを使ってみる – 実装例② -

Slide 30

Slide 30 text

30 n 例︓S3、SESを利⽤したLambdaを作成 • ⽣成されたコードでLambdaを動かしてみる 無事にメールが届いている 4-3．Amazon CodeWhispererを使ってみる – 実装例② -

Slide 31

Slide 31 text

5. まとめ 31

Slide 32

Slide 32 text

5．まとめ 32 n 所感 • 想定とは異なるコードが⽣成される事はなく、精度は⾼いように感じた ※ただし、記述する内容も当然重要と思われる • コード⽣成速度は実⽤レベルだが、⽣成するコードを⼀⾏ずつEnterを押していかなければな らないのは少々⾯倒 • あくまでコメント箇所のみ⽣成されるので注意が必要（Pythonで⾔うと、Import⽂は⾃動⽣ 成されなかった） • 「書き⽅を忘れた」「ある程度の処理の枠組みを作りたい」等のケースで便利 • アプリケーションの要件を満たしているかは必ず確認が必要、あくまで補助ツールとして使う

Slide 33

Slide 33 text

動画URL 33 n 動画タイトル 第16回 雲勉LT Amazon CodeWhispererを使った開発を体験してみる n 動画URL https://youtu.be/NfTEmva1R_o