Slide 1

Slide 1 text

AI支援の実装をやってみる 2024/12/16 @insyo 1

Slide 2

Slide 2 text

内容 AI支援型IDEあれこれ コスト 向いている用途 実務でどこまで使えるか 実演 2

Slide 3

Slide 3 text

AI支援型IDEあれこれ VSCode系 Cline Cursor ブラウザ完結系 その他 3

Slide 4

Slide 4 text

コスト GitHub Copilot $10/月のサブスク Cline Anthropic,OpenAI,GoogleのAPIキー (課金要.従量課金!) Cursor Hobby(無料) , Pro($20/月) , Business v0 Free(無料) , Premiun($20/月) , Enterprize JetBrains系IDEのAI Assistant Trial(7日間) , Pro(14,300円/年) , Enterprize 4

Slide 5

Slide 5 text

向いている用途 GitHub Copilot 文書作成におけるIMEのような位置づけ 体力系実装がだいぶ楽になる 外部APIから取得したパラメータの内部クラスへの転記 パラメータ多めの関数パラメータ指定 Cline/Cursor/v0 プロトタイプをゼロからちゃちゃっと作る ブラックボックスで構わない使い捨てツール 苦手ジャンル(フロントエンドとか)のプロト作成 未知のコードの読み解き mermaid形式の図にしてもらうと理解が捗る 5

Slide 6

Slide 6 text

実務でどこまで使えるか できること 既存コードの局所的な改修 責務が明らか&複雑性の低い新規実装 まだ無理なところ 複雑&規模の大きいプロダクションコードの的確な修正 アーキテクチャ設計/実装設計 注意ポイント AIは結構間違えるので、誤り検知&軌道修正できる力量が必要 実装方法の引き出し (プラクティス/アンチパターン) (特に外部)ライブラリの使い方 的確な言語化力 (=プロンプトの精度) 駆け出し君は実装よりも、学習とコードレビューにAIを活用すべし 6

Slide 7

Slide 7 text

実演 (GitHub Copilotにクラスを書いてもらう) from dataclasses import dataclass CSV_FILENAME = "pref.csv" # # 都道府県コード,都道府県名,都道府県名(ローマ字),県庁所在地,地方 # ,面積(km2),総人口2020年,人口密度(人/km2),市区町村数 # ,一人当たり県民所得(千円),年間平均気温(℃),年間降水量(mm) # ,高齢化率(%),第一次産業比率(%),第二次産業比率(%) # ,第三次産業比率(%),観光客数(万人/年),主要産業,代表的な特産品 # ,伝統工芸品,世界遺産数,国立公園数,有名な祭り,主要大学数,医療機関数 # 都道府県情報を格納するデータクラス @dataclass(frozen=True) class Pref: 7

Slide 8

Slide 8 text

実演 (Clineに簡単なWebアプリケーションを書いてもらう) メモの編集を行うWebアプリケーションを開発してください。 - バックエンド - FastAPIを利用 - REST APIをフロントエンド向けに公開 - メモはシンプルなファイルとして永続化する - 編集するメモは一つのみとする - フロントエンドのHTMLをFastAPIで/staticパス上にホスティングする - フロントエンド - AlpinejsとTailwinCSSを使用 - レスポンシブデザインであること - 一つのHTMLにJavaScript/CSSを含めてまとめて実装する 8

Slide 9

Slide 9 text

ご清聴ありがとうございました 9