探索 GitHub Copilot 的新功能，讓我們的應用程式開發更快一步 @Google Developer Group Taichung 十一月小聚

by Alan Tsai

Slide 1

Slide 1 text

探索 GitHub Copilot 的新功能讓我們的應用程式開發更快一步 By Alan Tsai

Slide 2

Slide 2 text

簡單的自我介紹 2 @Alan Tsai 的學習筆記 • Alan Tsai • 蔡孟玹 • 後端工程師 - .NET 技術為主 • 喜歡學習不同東西 • Azure • Data Science、Chatbot • Container、DevOps • 加强開發的Tools、架構 • 翻譯文章/軟體 • 兩本翻譯書 • 三門線上課程 • 看小說、玩手游

Slide 3

Slide 3 text

@Alan Tsai 的學習筆記教就是最好的學習方式 - 喜歡考證驗證所學 3

Slide 4

Slide 4 text

喜歡技術分享 4 ▰ TSMC IT Community Meetup ▻ 聊聊生成式 AI 的衝擊下，作為工程師我們需要做好什麼準備 ▰ 2023 .NET Conf ▻ 探索 API 開發的挑戰與解決之道 ▻ 從 GitHub Copilot 到 Enterprise Copilot：打造符合企業需求的智能開發助手之路 ▰ 2022 .NET Conf ▻ 談 Event Driven Architecture 之前是不是該把 Event 規格搞定？ CloudEvents 是什麼？ | 邁上 Cloud Native App 之路 @Alan Tsai 的學習筆記

Slide 5

Slide 5 text

喜歡技術分享 5 ▰Tibame ▻AZ-900、AZ-104、AZ-204 ▻GitHub Copilot：企業導入，在製造業、金融業、服務業，已培訓近 2000 人次 ▰Trainocate ▻AZ-104、AZ-204、AZ-400、DP-200、DP-201、PL-900、DA-100 ▰台灣智慧自動化與機器人協會 ▻運用Python進行大數據分析、機器學習基礎理論課程及人工智慧 – ML.NET ▰中華電信學院 ▻Windows Container 技術實務班、使用Azure AI打造有人工智能的Line聊天機器人、 DevOps與CI/CD實務研習班 @Alan Tsai 的學習筆記

Slide 6

Slide 6 text

歡迎訂閲、按讚 + 分享 FB 粉絲頁 http://fb.alantsai.net Alan Tsai 的學習筆記 https://blog.alantsai.net http://yt.alantsai.net http://bili.alantsai.net 影片 [email protected] @Alan Tsai 的學習筆記 6 [email protected]

Slide 7

Slide 7 text

Agenda 7 ▰What is GitHub Copilot ？ ▰What is new？ ▻Switch Model ▻GitHub Copilot Edit ▻GitHub Copilot Review ▻GitHub Copilot Extension ▻GitHub Spark @Alan Tsai 的學習筆記

Slide 8

Slide 8 text

What is GitHub Copilot 8

Slide 9

Slide 9 text

What is GitHub Copilot 9 @Alan Tsai 的學習筆記 GitHub Copilot is an AI pair programmer that offers autocomplete-style suggestions as you code About GitHub Copilot for Individuals - GitHub Docs

Slide 10

Slide 10 text

What is GitHub Copilot 10 @Alan Tsai 的學習筆記 You can receive suggestions from GitHub Copilot either by starting to write the code you want to use, or by writing a natural language comment describing what you want the code to do About GitHub Copilot for Individuals - GitHub Docs

Slide 11

Slide 11 text

What other chose do I have? 11 @Alan Tsai 的學習筆記

Slide 12

Slide 12 text

開發 vs 審閱 12 @Alan Tsai 的學習筆記

Slide 13

Slide 13 text

Prepare Environment - Supported IDE 13 @Alan Tsai 的學習筆記 Visual Studio Code Visual Studio Jet Brains neovim

Slide 14

Slide 14 text

從需求開發功能實際上可以做什麼 14 @Alan Tsai 的學習筆

Slide 15

Slide 15 text

Slide 16

Slide 16 text

從規格產生 Code 16 @Alan Tsai 的學習筆記

Slide 17

Slide 17 text

從規格產生 Code 17 @Alan Tsai 的學習筆記

Slide 18

Slide 18 text

從規格產生 Code 18 @Alan Tsai 的學習筆記

Slide 19

Slide 19 text

Code Review 解程式碼/詢問改善空間實際上可以做什麼 19 @Alan Tsai 的學習筆

Slide 20

Slide 20 text

No content

Slide 21

Slide 21 text

21 @Alan Tsai 的學習筆記

Slide 22

Slide 22 text

22 @Alan Tsai 的學習筆記

Slide 23

Slide 23 text

了解程式碼 23 @Alan Tsai 的學習筆記

Slide 24

Slide 24 text

產生用 Powershell 呼叫的語法 24 @Alan Tsai 的學習筆記

Slide 25

Slide 25 text

撰寫測試 25 @Alan Tsai 的學習筆記

Slide 26

Slide 26 text

產生 SQL 語法和建議索引 26 @Alan Tsai 的學習筆記

Slide 27

Slide 27 text

提供重構建議 27 @Alan Tsai 的學習筆記

Slide 28

Slide 28 text

產生文件 28 @Alan Tsai 的學習筆記

Slide 29

Slide 29 text

Visual Studio Code – GitHub Copilot Chat 29 @Alan Tsai 的學習筆記

Slide 30

Slide 30 text

30 @Alan Tsai 的學習筆記 https://stock.adobe.com/tw/images/software-development- life-cycle-6-process-of-sdlc-vector/423979611 撰寫 Pseudocode 系統架構設計資料庫設計輔助程式開發註解變程式碼轉換程式碼語言單元測試整合測試 Code Review Exception 排查優化重構效能調教

Slide 31

Slide 31 text

Copilot Workspace 從需求到開發一條龍 31

Slide 32

Slide 32 text

@Alan Tsai 的學習筆記 32

Slide 33

Slide 33 text

What is new? 33

Slide 34

Slide 34 text

GitHub Universe 24 & VS Code October Update 34 New from Universe 2024: Get the latest previews and releases Multi-file editing, code review, custom instructions, and more for GitHub Copilot in VS Code October release (v0.22)

Slide 35

Slide 35 text

GitHub Copilot Pricing 35 @Alan Tsai 的學習筆記 https://github.com/features/copilot/plans

Slide 36

Slide 36 text

GitHub Copilot Pricing 36 @Alan Tsai 的學習筆記 https://github.com/features/copilot/plans

Slide 37

Slide 37 text

Switch Model What is new 37 @Alan Tsai 的學習筆

Slide 38

Slide 38 text

Ability to Switch Model 38 ▰GPT 4o (Default) ▻provide fast, reliable responses, superior performance in non-English languages ▻Model’s capabilities、model card ▰o1-preview ▻advanced reasoning and solving complex problems. in particular in math and science ▻Model’s capabilities、model card ▰o1-mini ▻code generation and small context operations ▻Model’s capabilities、 model card Hosted on Azure @Alan Tsai 的學習筆記 ▰Claude 3.5 Sonnet ▻coding tasks across the entire software development lifecycle ▻Model’s capabilities、model card Hosted on AWS ▰Gemini 1.5 Pro (Coming Soon) ▻code generation, analysis, and optimization ▻can process more than 100,000 lines of code Gemini models are coming to GitHub Copilot

Slide 39

Slide 39 text

Ability to Switch Model 39 @Alan Tsai 的學習筆記

Slide 40

Slide 40 text

Challenge 40 排一下 .NET Conf 2024 的議程 @Alan Tsai 的學習筆記

Slide 41

Slide 41 text

Prepare the data 41 @Alan Tsai 的學習筆記

Slide 42

Slide 42 text

GPT-4o 42 @Alan Tsai 的學習筆記

Slide 43

Slide 43 text

GPT-4o – First draft 43 @Alan Tsai 的學習筆記

Slide 44

Slide 44 text

GPT-4o asking why 44 @Alan Tsai 的學習筆記

Slide 45

Slide 45 text

GPT-4o – specific problem 45 @Alan Tsai 的學習筆記

Slide 46

Slide 46 text

GPT-4o – specific problem 46 @Alan Tsai 的學習筆記

Slide 47

Slide 47 text

Claude 3.5 47 @Alan Tsai 的學習筆記

Slide 48

Slide 48 text

Claude 3.5 48 @Alan Tsai 的學習筆記

Slide 49

Slide 49 text

Claude 3.5 - layout 49 @Alan Tsai 的學習筆記

Slide 50

Slide 50 text

Claude 3.5 - theme 50 @Alan Tsai 的學習筆記

Slide 51

Slide 51 text

Claude 3.5 - theme 51 @Alan Tsai 的學習筆記

Slide 52

Slide 52 text

Claude 3.5 – speaker preference 52 @Alan Tsai 的學習筆記

Slide 53

Slide 53 text

GPT-4o – found the problem, ask it to leave blank if available 53 @Alan Tsai 的學習筆記

Slide 54

Slide 54 text

GPT-4o check speaker preference 54 @Alan Tsai 的學習筆記

Slide 55

Slide 55 text

Copilot Edit What is new 55 @Alan Tsai 的學習筆

Slide 56

Slide 56 text

Slide 57

Slide 57 text

Comparison 57 Capability Copilot Edits Chat view Inline Chat Quick Chat Multi-file edits * * Preview code edits Code review flow Roll back changes Attach context Use participants & commands Generate shell commands General-purpose chat @Alan Tsai 的學習筆記

Slide 58

Slide 58 text

Limitation 58 •Multiple simultaneous edit sessions are not supported yet. •The use of @workspace /new to scaffold a new project is not supported yet in an Edit session. For now, use Copilot Chat for the initial scaffolding. •Although #codebase is great at finding relevant context for your query, subsequent generated edits are of widely varying quality. Explicitly adding files to your working set creates better results. •Support for Jupyter notebooks, other custom text formats, and binary file formats is absent or untested. •The working set is currently limited to 10 files. •Copilot Edits is limited to 7 editing requests per 10 minutes. @Alan Tsai 的學習筆記

Slide 59

Slide 59 text

Customization 59 ▰Chat ▻.github/copilot-instructions.md @Alan Tsai 的學習筆記

Slide 60

Slide 60 text

Copilot Review What is new 60 @Alan Tsai 的學習筆

Slide 61

Slide 61 text

Copilot Review 61 ▰Review selection: Highlight code and ask for an initial review (Visual Studio Code only) ▰Review changes: Request a deeper review of all your changes (GitHub website and Visual Studio Code)

Slide 62

Slide 62 text

Copilot Review in Action 62 @Alan Tsai 的學習筆記

Slide 63

Slide 63 text

Copilot Review in Action - Explain 63 @Alan Tsai 的學習筆記

Slide 64

Slide 64 text

Customization 64 ▰Chat ▻.github/copilot-instructions.md ▰Generation ▻github.copilot.chat.codeGeneration.instructions ▻github.copilot.chat.testGeneration.instructions ▻github.copilot.chat.reviewSelection.instructions @Alan Tsai 的學習筆記

Slide 65

Slide 65 text

Copilot Extension What is new 65 @Alan Tsai 的學習筆

Slide 66

Slide 66 text

What is participant 66 ▰@workspace – search related to code ▰@github – GitHub Related and other skill ▰@terminal – Command line related ▰@vscode – using VS Code related

Slide 67

Slide 67 text

@wrokspace 67 •All files in the workspace, except for files that are ignored by a .gitignore file •Directory structure with nested folder and file names •GitHub's code search index, if the workspace is a GitHub repository and indexed by code search •Symbols and definitions in the workspace •Currently selected text or visible text in the active editor ▰Note: .gitignore is bypassed if you have a file open or have text selected within an ignored file. @Alan Tsai 的學習筆記

Slide 68

Slide 68 text

@github 68 @Alan Tsai 的學習筆記 Asking GitHub Copilot questions in your IDE - GitHub Docs

Slide 69

Slide 69 text

@github 69 @Alan Tsai 的學習筆記 Asking GitHub Copilot questions in your IDE - GitHub Docs

Slide 70

Slide 70 text

@azure – resource management 70 @Alan Tsai 的學習筆記 Streamline Your Azure Workflow: Introducing GitHub Copilot for Azure in VS Code

Slide 71

Slide 71 text

@azure – diagnosis 71 @Alan Tsai 的學習筆記 Streamline Your Azure Workflow: Introducing GitHub Copilot for Azure in VS Code

Slide 72

Slide 72 text

@azure – cost management 72 @Alan Tsai 的學習筆記 Streamline Your Azure Workflow: Introducing GitHub Copilot for Azure in VS Code

Slide 73

Slide 73 text

GitHub Copilot Extension 73 @Alan Tsai 的學習筆記

Slide 74

Slide 74 text

74 @Alan Tsai 的學習筆記 GitHub Copilot Extensions

Slide 75

Slide 75 text

75 @Alan Tsai 的學習筆記 GitHub Copilot Extensions

Slide 76

Slide 76 text

GitHub Spark What is new 76 @Alan Tsai 的學習筆

Slide 77

Slide 77 text

Slide 78

Slide 78 text

78 @Alan Tsai 的學習筆記 A maps app that allows searching for cities by name, and then using an LLM to generate a fun tldr description of it. Created and used by a 10 year old for school

Slide 79

Slide 79 text

79 @Alan Tsai 的學習筆記 A custom HackerNews client that shows the top 20 posts, and uses an LLM to summarize the comment threads (which is really useful!). This is the daily HN driver for the team

Slide 80

Slide 80 text

80 @Alan Tsai 的學習筆記 An app for tracking a weekly karaoke night, along with the status of each invited guest

Slide 81

Slide 81 text

Conclusion 81

Slide 82

Slide 82 text

以前是 Google 工程師，現在是 AI 工程師 82 ▰不會做，就先 Google 啊 => 不會做，就先問 ChatGPT 啊 ▰查不到，要會下關鍵字啊 => 查不到，要會下咒語（Prompt）啊 ▰還查不到，多換幾種查法 => 還查不到，換英文問啊

Slide 83

Slide 83 text

83 @Alan Tsai 的學習筆記

Slide 84

Slide 84 text

Data Collection Operators 84 @Alan Tsai 的學習筆記 https://www.linkedin.com/jobs/view/data- collection-operator-tesla-bot-at-tesla- 3762872578/

Slide 85

Slide 85 text

生成式 AI 的三大定律 -> 拒當電池人 85 ▰ AI 不會取代你的工作，但是會 AI 的人會 ▰ 人人都要有 Technical Leader 的思維 ▰ 越符合業界標準，成效就越好 ▰ 你做不到的事情，AI 就做不到

Slide 86

Slide 86 text

Schillace Laws 86 @Alan Tsai 的學習筆記 Schillace Laws of Semantic AI Don’t write code if the model can do it; the model will get better, but the code won't Hard for you is hard for the model