Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
AI-Powered Development with GitHub Copilot 2024...
Search
Sponsored
·
SiteGround - Reliable hosting with speed, security, and support you can count on.
→
Yuki Hattori
February 02, 2024
Technology
8.3k
13
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
AI-Powered Development with GitHub Copilot 20240202
Yuki Hattori
February 02, 2024
More Decks by Yuki Hattori
See All by Yuki Hattori
コーディングエージェント時代のセキュリティレビュー戦略 - 増大するコード量と脆弱性への対応
yuhattor
1
230
AOAI Dev Day 2025 GitHub Keynote
yuhattor
5
1.6k
HOW TO READ Prompt Engineering for LLM (牛本)
yuhattor
22
11k
AI-Driven-Development-20250310
yuhattor
3
690
InnerSource Patterns - Japanese
yuhattor
1
130
Developer Summit 2025 [14-D-1] Yuki Hattori
yuhattor
29
20k
GitHubの軌跡:リポジトリからAIプラットフォームへ
yuhattor
3
300
コードAI本 - コード×AIーソフトウェア開発者のための生成AI実践入門
yuhattor
1
940
Code AI Findy Event
yuhattor
7
1.5k
Other Decks in Technology
See All in Technology
就職⽀援サービスにおけるキャリアアドバイザーのシフトスケジューリング
recruitengineers
PRO
1
140
Android の公式 Skill / Android skills
yanzm
0
130
タクシーアプリ『GO』の実践的データ活用
mot_techtalk
3
190
EventBridge Connection
_kensh
5
700
Chainlitで作るお手軽チャットUI
ynt0485
0
200
エラーバジェットのアラートのタイミングを考える.pdf
kairim0
0
130
2026TECHFRESH畢業分享會 - 原生還是跨平台? App 開發踩坑實錄
line_developers_tw
PRO
0
850
2026TECHFRESH畢業分享會 - Lightning Talk - E起 See See : 電商推薦讀心術? 數據說了算
line_developers_tw
PRO
0
840
AI駆動開発を通して感じた、 AI時代のデザイナーの役割変化
whisaiyo
1
380
エンジニアリング戦略の作り方 / Crafting Engineering Strategy
iwashi86
20
6.6k
protovalidate-es を導入してみた
bengo4com
0
170
やさしいA2A入門
minorun365
PRO
12
1.7k
Featured
See All Featured
RailsConf & Balkan Ruby 2019: The Past, Present, and Future of Rails at GitHub
eileencodes
141
35k
技術選定の審美眼(2025年版) / Understanding the Spiral of Technologies 2025 edition
twada
PRO
118
120k
[RailsConf 2023] Rails as a piece of cake
palkan
59
6.7k
JAMstack: Web Apps at Ludicrous Speed - All Things Open 2022
reverentgeek
1
470
Leading Effective Engineering Teams in the AI Era
addyosmani
9
2k
The Cost Of JavaScript in 2023
addyosmani
55
10k
Leveraging Curiosity to Care for An Aging Population
cassininazir
1
270
GraphQLとの向き合い方2022年版
quramy
50
15k
Making Projects Easy
brettharned
120
6.7k
StorybookのUI Testing Handbookを読んだ
zakiyama
31
6.8k
Building Flexible Design Systems
yeseniaperezcruz
330
40k
How to Talk to Developers About Accessibility
jct
2
230
Transcript
AI-Powered Development with GitHub Copilot Yuki Hattori GitHub
Agenda • GitHub Copilot について • AI を使った開発 うわさについて •
生成 AI ツールを使いこなす際に理解すべきこと • Copilot Tips & Tricks
AI を使った開発と私 2023/02 AI駆動開発 勉強会 2023/09 30のプラクティスで刷新 2023/04 AI-Native.dev 2024
お楽しみに
Integrations & APIs The AI Powered Developer Platform to Build,
Scale, and Deliver Secure Software Collaboration Productivity Security Scale Powered by AI
Once enabled… OpenAI LLM Context Suggestions
AI時代 うわさ • プロンプトエンジニアリング テクニックが AI 時代に 重要 • AI
優秀なエンジニアしか使いこなせない
うわさ: プロンプトエンジニアリング テクニックが AI 時代に 重要
Prompt Engineering (狭義) • 具体的なテクニックに焦点 • AIへ 例示方法 フォーマット、特定キーワード 使用など
• 高精度出力が要求されるサービスや特定フォーマット出力が必要な場合に特に有効 • AI 創 性 向上や出力 量・質 コントロールにも役立つ Prompt Engineering (広義) / Prompt Crafting • 入力 全体的なアプローチに焦点を当てる • 入力フォーマット、例示 有無、内容、文脈 コントロールを含む • 人間 論理思考能力、言語力、専門知識に基づく • 必要なも 習得すべきテクニック だけで なく特定文脈における 人間 能力 うわさ: プロンプトエンジニアリング テクニックが AI 時代に 重要 * 用語 出現時 狭義における定義が主でした。 GitHub で 広義 使い方を Prompt Crafting と呼んでいます プロンプトエンジニアリング テクニックによりもたらされる差異 、 一般的に期待されているほど 大きくない
プロンプトエンジニアリング (狭義) 出力コントロールに大きく貢献 • 反復作業/日常的な作業 出力コントロール、精度向上、時間削減に貢献 • AIをプロダクトに組む際に、常に安定した出力をプログラムや顧客に提供 ただし「あると便利なテクニック」であり、全員が専門家になる必要 ない。
基本的なテクニック 理解だけでも十分。 プロンプトエンジニアリング “テクニック” 知っておくと便利 うわさ: プロンプトエンジニアリング テクニックが AI 時代に 重要
プロンプト クラフティング能力を鍛えよう • プロンプトエンジニアリング どんな入力からも必ず 素晴らしい出力を引き出す銀 弾丸で ない • 泥団子
磨いても泥団子 入力 質が低けれ 、出力 質も限らる。 自分 ダイヤモンド💎 を探し、磨くことが重要!! ✨ うわさ: プロンプトエンジニアリング テクニックが AI 時代に 重要
プロンプト クラフティング能力 どうやって鍛える ❓🤔 以下を実施する • 知識を貯める • 専門技術を身につける •
経験を積む • 特定 分野 研究をする • 実験をして色々試してみる • クリティカル シンキング / ロジカル ライティング技術を鍛え それに、プロンプトエンジニアリング テクニックを組み合わせる! うわさ: プロンプトエンジニアリング テクニックが AI 時代に 重要
うわさ: AI 優秀なエンジニアしか使いこなせない
初心者でもAI 使用で大幅なスキルアップが可能 能力 上限とレビュー能力 関係 • エンジニアが AI から引き出せる能力 上限
レビューできるコード 量や質に依存する • そ ため、「AI 優秀なエンジニアだけが使いこなせる」 という考えが一部で存在。 👉 こ 議論 AI 学習促進機能について言及していない うわさ:AI 優秀なエンジニアしか使いこなせない
AI 学習ツールとして 側面 AI 開発支援ツールであるとともに、最強 学習促進ツールです。 AI エンジニア コード書きやレビュー 間に学習を促進し、新しいライブラリ
使い方やプ ログラミング言語 学習機会を提供します。 採用されない提案においても学習プロセスが発生 • 採用されなかったAI 提案をレビューすることで、開発方向性や手段 洞察を得る • 次回 指示や提案 採用判断に役立つ 中長期的なエンジニア 成長に貢献 • 即時的な能力向上だけでなく、中長期的なスキル向上にも貢献。 • AIから コード提案と採用を繰り返すことで、エンジニア 能力上限を徐々に向上させる。 神話:AI 優秀なエンジニアしか使いこなせない
学習 S字カーブと AI によるエンジニア学習曲線 うわさ:AI 優秀なエンジニアしか使いこなせない AI 対話中にも自分 レビューできる範囲を拡張し続ける =
自分が短期的に学習可能な範囲まで 使いこなすことができる • 好奇心と学習意欲があれ 、より多く 恩恵を受ける • ど 学習フェイズでも、AIから 恩恵を受けられる 経 学 習 全く 初心者 時点で AI 力を十分に引き出せないが、 AI 初期学習 度を早める 🚀 初級者 ~ 中級者 能力一般や、 日常作業タスクにおける処理能力 大幅に引き上がる 上級者 、さらなる高みへ 生産性だけでなく、探求や高度化 ため パートナーになる
有効な開発をするコツ • ツール特性 理解 • プロンプト作成時 4 ポイント を理解
ツール 違いを知る 自動補完型 ボット型 (フリーフォーム型 ) エージェント型 (ソリューション型 ) 入力
エディタへ 入力 フォームへ 入力 フォーム 入力、ファイルアップロードなど 出力内容 コード / コメント コード / コメント / 解説文 編集可能なコードを含む成果物 出力形式 コード 補完 コードを含む返信 成果物 出力 コードサイズ 小規模 (数文字~20行程度) 中規模 (1行~数百行) 大規模 (数百行~数千行) 明示的なプロンプト 0行 ~ 数行程度 数行 ~ 数十行 大量 応答 度 数百ミリ秒 ~ 数秒 数秒 ~ 数十秒 数十秒 ~ ツール フォーカス 応答 度、開発時 集中力 精度、プロンプト構築補助 ソリューションとして 完成度 類似体験 ペアプログラミング モブプログラミング Sack や Teams で 技術質問 軽量なプルリクエスト受け取り ローコードツール 利用 テンプレートエンジン 利用 ツール例 GitHub Copilot (Completion) GitHub Copilot (Inline) ChatGPT GitHub Copilot Chat 一部 GPTs / ローコードツールなど (デファクトスタンダード なし )
Copilot (自動補完) 特徴を理解 ユーザーの入力を 最小化 ツール 質 、ユー ザーから 明示的な
プロンプトなしに、望 まれる出力をどれだ け正確に予測できる かに依存 インクリメンタルな実装 手戻りの許容 迅速なレスポンスと 集中力の維持 確実で 安全な出力 Copilot Completion アジャイルなやりと りをサポート 段階的コード出力と ユーザーによる逐一 採否決定が可能 自動補完型ツール 利点 、迅 なレス ポンスによる集中力 維持 インデックス化された 状態で 96TB にもな る世界最大/ 最新 オープンソー スデータベースと 瞬時にコードマッチン グ、ライセンスに関す る問題発生を 抑止 ツールに求めるべき質 モデルに求めるべき質 と 異なる
Copilot プロンプト コツ Context 文脈 AI がタスクをよりよく 理解する に役立つ Intent
意図 Clarity 明瞭さ Specificity 具体性 プロンプトを作成する 際 具体的な目標や 目的。 曖昧さがなく 理解しやすいこと プロンプト 具体性と 正確さ レベル
Tips & Tricks
エージェント Copilot がより適切な回答を提供できるよう、エージェントを使用 して質問 範囲と意図を示すことができます。 • @workspace: ワークスペース内 コードに関するコンテ キストがあり、コードをナビゲートして関連するファイルやク
ラスを見つける に役立ちます。 • @vscode: VS Code エディタ自体 コマンドと機能につい て知っており、それら 使用を支援できます。 • @terminal: に 、統合ターミナル シェルとそ 内容に関 するコンテキストが含まれています。 @workspace version1.86 @vscode @terminal
スラッシュコマンド Copilot がより適切な回答を提供できるよう、スラッシュコマン ドを使用して質問 範囲と意図を示すことができます。 代表例 • /explain: コードを解説する •
/fix: バグやエラー 修正を実施 • /tests: 単体テストや機能テストを作成 • /new: 新しいプロジェクト テンプレートを作る そ 他拡充されます /explain version1.86 /fix /newChat /tests
コンテキスト変数 Copilot がより適切な回答を提供できるよう、 コンテキスト変数を使用して質問 範囲と意図を示すことができま す。 • #editor: エディタ 中
• #file: 特定 ファイルを指定 • #selection: 選択エリア • #terminalLastCommand: 最後 ターミナルコマンド • #terminalSelection: ターミナル 選択エリア Release: https://code.visualstudio.com/updates/v1_86 #editor version 1.86 #file #selection #terminalLastCommand #terminalSelection
最近 発表
#file コンテキスト変数 指定したファイルをチャットプロンプト コンテキスト としてワークスペースに含めることができるように追 加されました。 #file: 提案コントロールから選択し、表示されるク イック選択からファイルを選択します。 Release:
https://code.visualstudio.com/updates/v1_86 #file:package.json version 1.86
#editor コンテキスト変数 以前 、アクティブなコード エディターから 2 種類 コンテ キストがデフォルトでチャット リクエストに含まれていました。
1. テキスト選択があった場合、そ 選択が含まれる 2. 選択がなかった場合 、アクティブなエディター 表示 ビューポート内 コード範囲が含まれる 現在 2 において、デフォルトで ビューポートにコードを含め ず、選択されたコード みを含めることを実験しています。 一方でエディターに表示されるコードについて質問したい場 合がよくあるため、新しいコンテキスト変数 を追加しました。 Release: https://code.visualstudio.com/updates/v1_86 #editor version 1.86
コミットメッセージ 言語を変更 git コミット メッセージを生成する際、特定 言語で コミット メッセージを生成することができるようになり ました。 Release:
https://code.visualstudio.com/updates/v1_86 github.copilot.chat.localeOverride version 1.86
“Hey Code” 音声コマンド accessibility.voice.keywordActivation 設定により、VS Code が ”Hey Code”音声 コマンドを聞き、Copilot
Chat と 音声セッ ションを開始できるようになります。音声認 識 マシン上でローカルに計算され、サー バーに送信されること ありません。 チャットビューからボイスチャットを開始 クイックチャットコントロールからボイスチャットを開始 エディター インラインチャットからボイスチャットを開始 フォーカスによって、インライン チャットと チャット どちらかが自動で開始 chatInView quickChat inlineChat chatInContext Requirements: Copilot Chat, VS Code Speech Release: https://code.visualstudio.com/updates/v1_86 version 1.86
インラインチャット ホールドして話すモード ⌘+I インライン チャットに「ホールドして話す」機 能が追加されました。これ 次 ように機 能します。 •
ショートカットでインライン チャットをト リガーします • キーを押したままにすると、音声録音 が自動的に開始されます • キーを放して記録を停止し、リクエスト を Copilot に送信します Requirements: Copilot Chat, VS Code Speech Release: https://code.visualstudio.com/updates/v1_86 Ctrl+I inlineChat.holdToSpeech version 1.86
インラインチャット クイックボイス 「ホールドして話す」 に加えて、こ 機能 よ り軽量な代替 UI を実験中です。ショートカット を押し続けると、クイックボイスがアクティブに
なります。 ホルダーを押している間 I、より軽量な録音 UI が表示されます。解放されると、リクエスト が送信されます。 Release: https://code.visualstudio.com/updates/v1_86 ⌘+K Ctrl+K そして、 を押し続ける I version 1.86
AIフレンドリーな開発実践
AIフレンドリーな開発実践 • Copilot デザインパターン • チームコラボレーション for Copilot • テスト
/ リファクタリング GitHub Copilot Patterns & Exercises ai-native.dev
Copilot デザインパターン 一貫性 • AI が理解可能な命名規則 • 一貫性 あるコーディングスタイル アーキテクチャ
• ハイレベルアーキテクチャを先に • コンテキストレス・アーキテクチャ • 小さなコードチャンクで作業する 再利用可能性 • 微細な OSS 依存関係 排除 • インナーソース
チーム コラボレーション for Copilot コードに変換可能な開発リソース作成 • AIフレンドリーなドキュメンテーション • Copilot Enterprise
向けリソース GitHub 集積 コーチング / 育成 • プロンプト コーチング 共有 / 発展 • プロンプトプラクティス 共有 • プロンプトリポジトリ
テスト & リファクタリング テスト • テストコード 生成方法を指定 • 出力ケース数を数で指定 •
自然言語からテストケース 記載を じめる リファクタリング • オープンクエスチョンで尋 る • ロジック 分離で、生成時 不可侵領 域を作る
まとめ:あまり気にしすぎない • 「知っている」と「知らない」で GitHub Copilot 飼い慣らしに差 でますが、 GitHub で それを意識しないでも高いコード提案ができるようにプロダクトを作っています。
• 結局 ところ「良いコーディング」をすれ 、 提案されるコードも「良いコード」になります。 ◦ 人間にとって良いコーディング ◦ 文脈を知らない人でもわかるようなコーディング ◦ ミスを誘発しないような確かなコーディング
None