type
status
date
slug
summary
tags
category
icon
password
Copilot Chat简介
Github Copilot官方介绍:https://github.com/features/copilot
![notion image](https://www.notion.so/image/https%3A%2F%2Fprod-files-secure.s3.us-west-2.amazonaws.com%2F5fdde3cf-8f5c-4292-84e6-0bb16a36f7d7%2Fc45f7c3c-d344-4996-8ffb-c54389ef7b3b%2FUntitled.png?table=block&id=c36a5c71-5c10-40c4-8547-23aa651d0104&t=c36a5c71-5c10-40c4-8547-23aa651d0104&width=1587&cache=v2)
GitHub Copilot可以提供代码行内建议来帮助程序员提效。它是一款AI辅助程序员的工具。你可以使用GitHub Copilot在你的编辑器中获取整行或整个函数的建议。
Copilot就像你的编程路上的「副驾驶」,你是主驾驶负责把控方向,它负责帮你完整具体任务。
Copilot Chat是Copilot的升级版本,目前正处于公测阶段。
Copilot Chat是一个类似ChatGPT的聊天界面,可以直接在IDE中使用自然语言和Copilot进行交互,并且可以分多步。这一点比只有代码补全功能的Copilot的功能要强大很多。
Copilot Chat可以回答与编码相关的各种问题,包括语法、编程概念、测试用例、调试等。Copilot Chat不适用于回答非编码问题。
Copilot Chat安装
开通Copilot
使用CopilotChat首先得开通Copilot。
订阅分为个人版和企业版。企业版本19美金一个月,个人版本10美金一个月。
我们使用个人版就可以,当然也可是使用学生版,或者去万能的某宝上找找。
个人版也会有一定的免费试用时间
![notion image](https://www.notion.so/image/https%3A%2F%2Fprod-files-secure.s3.us-west-2.amazonaws.com%2F5fdde3cf-8f5c-4292-84e6-0bb16a36f7d7%2F6a433446-c304-40eb-ac7a-cc71423bc430%2FUntitled.png?table=block&id=f7716b1f-18f3-4a2e-a086-d68f6a8a8442&t=f7716b1f-18f3-4a2e-a086-d68f6a8a8442&width=1464&cache=v2)
开通流程:
- 点击设置页中的开通链接:https://github.com/github-copilot/signup
- 在GitHub Copilot设置页面,点击启用GitHub Copilot。
- 选择您是要按月付费还是按年付费,然后点击继续以获取Copilot访问权限。
- 如果您的个人账户符合免费GitHub Copilot订阅的条件,而不是试用或付费订阅,您将自动进入第5步。
- 按照步骤确认您的付款详情,然后点击提交。
- 选择您的偏好设置,然后点击保存并开始使用。
开通Copilot Chat
Copilot Chat目前需要waitlist等待官方开放。
![notion image](https://www.notion.so/image/https%3A%2F%2Fprod-files-secure.s3.us-west-2.amazonaws.com%2F5fdde3cf-8f5c-4292-84e6-0bb16a36f7d7%2Fb7f8e35b-d60b-4195-8c65-fa78018e1caf%2FUntitled.png?table=block&id=8044e35f-4056-4696-8ee9-a9cad81efeec&t=8044e35f-4056-4696-8ee9-a9cad81efeec&width=1691&cache=v2)
安装IDE插件
我们这里使用微软自家的Visual Studio Code插件来做示范。
- 下载微软自家的IDE Visual Studio Code
- 安装插件
在扩展里搜索「Copilot」,点击安装即可。安装完成后右下角会有个小飞行员的图标就安装完成了。
![notion image](https://www.notion.so/image/https%3A%2F%2Fprod-files-secure.s3.us-west-2.amazonaws.com%2F5fdde3cf-8f5c-4292-84e6-0bb16a36f7d7%2F338ee598-22a8-4c7d-bbc0-0de6491a7177%2FUntitled.png?table=block&id=d17ba941-b866-4fd3-bb6b-0b4f3e4514dd&t=d17ba941-b866-4fd3-bb6b-0b4f3e4514dd&width=1906&cache=v2)
- 点击飞行员图标登录你开通订阅的Github账户即可
开始使用
如果开通了Copilot Chat权限,就可以打开一个类似ChatGPT的聊天界面。
输入”/” 即可触发自带AI命令,也可以在聊天框中进行含有上下文的连续对话。
![notion image](https://www.notion.so/image/https%3A%2F%2Fprod-files-secure.s3.us-west-2.amazonaws.com%2F5fdde3cf-8f5c-4292-84e6-0bb16a36f7d7%2Fbace11a0-50d5-4c55-afe0-07ae85a85a0e%2FUntitled.png?table=block&id=92f1bc2d-70c0-47eb-b8ae-77bf97e564ac&t=92f1bc2d-70c0-47eb-b8ae-77bf97e564ac&width=448&cache=v2)
![notion image](https://www.notion.so/image/https%3A%2F%2Fprod-files-secure.s3.us-west-2.amazonaws.com%2F5fdde3cf-8f5c-4292-84e6-0bb16a36f7d7%2F356e7473-9f4c-458b-b68e-4de25c734e08%2FUntitled.png?table=block&id=31c6f2d1-2af6-4c8b-a0c0-8c824b10fc20&t=31c6f2d1-2af6-4c8b-a0c0-8c824b10fc20&width=447&cache=v2)
用Copilot Chat实战开发一个网站
代码生成
NextJs是一个基于NodeJs的前后端全栈一体项目,这里我就选这个技术让一个小白也可以建立自己的网站。
我们使用 「/new」命令,直接创建一个完整的NextJs工程。
首先他列出来了需要生成的文件,点击「Create Workspace」生成这一堆文件(时间可能会稍长)。
![notion image](https://www.notion.so/image/https%3A%2F%2Fprod-files-secure.s3.us-west-2.amazonaws.com%2F5fdde3cf-8f5c-4292-84e6-0bb16a36f7d7%2Fcb868bb4-7e9d-434d-8c8a-902271bb85ae%2FUntitled.png?table=block&id=ecb9f019-9867-48a7-8d65-0493c9c79bc2&t=ecb9f019-9867-48a7-8d65-0493c9c79bc2&width=520&cache=v2)
代码运行
我是个小白不懂NextJs,也不懂NodeJs咋办呢?
额~继续让Copilot大佬教教我
![notion image](https://www.notion.so/image/https%3A%2F%2Fprod-files-secure.s3.us-west-2.amazonaws.com%2F5fdde3cf-8f5c-4292-84e6-0bb16a36f7d7%2Fd4cc91b6-e2b4-439d-b11b-5eafae6998ad%2FUntitled.png?table=block&id=21cdd8d7-577a-4202-a436-b94a86f325d6&t=21cdd8d7-577a-4202-a436-b94a86f325d6&width=517&cache=v2)
那么我们打开终端原神启动!
运行
npm install
居然报错了![notion image](https://www.notion.so/image/https%3A%2F%2Fprod-files-secure.s3.us-west-2.amazonaws.com%2F5fdde3cf-8f5c-4292-84e6-0bb16a36f7d7%2F91c276d5-70b1-41fc-9d90-fc3f8c5002eb%2FUntitled.png?table=block&id=345f1132-6286-481c-8889-6968f588f339&t=345f1132-6286-481c-8889-6968f588f339&width=1906&cache=v2)
代码修复
继续借助Copilot老师修复代码。
把上面的报错发给Copilot去让它协助我修复问题。
![notion image](https://www.notion.so/image/https%3A%2F%2Fprod-files-secure.s3.us-west-2.amazonaws.com%2F5fdde3cf-8f5c-4292-84e6-0bb16a36f7d7%2Fd5a3e6fc-eb8c-418b-87df-bd21f0660e9a%2FUntitled.png?table=block&id=1cadaae1-1da3-4c83-a1d1-556cbbf7a904&t=1cadaae1-1da3-4c83-a1d1-556cbbf7a904&width=502&cache=v2)
中间遇到的问题都可以继续去提问,让Copilot帮我排查问题。
经过一系列的排查最终运行
npm run dev
启动服务,浏览器打开 http://localhost:3000/ 进行访问。成果展示
首页:
![notion image](https://www.notion.so/image/https%3A%2F%2Fprod-files-secure.s3.us-west-2.amazonaws.com%2F5fdde3cf-8f5c-4292-84e6-0bb16a36f7d7%2Fd64ff791-f98d-4115-b610-9f9971f3af0b%2FUntitled.png?table=block&id=60bdd96c-add8-4355-88b7-3f5bc805e869&t=60bdd96c-add8-4355-88b7-3f5bc805e869&width=500&cache=v2)
注册:
![notion image](https://www.notion.so/image/https%3A%2F%2Fprod-files-secure.s3.us-west-2.amazonaws.com%2F5fdde3cf-8f5c-4292-84e6-0bb16a36f7d7%2Ff5510269-9e7f-4d39-8003-55a3a4055cea%2FUntitled.png?table=block&id=332655dc-1c8a-433f-9dba-ea3eedd386c1&t=332655dc-1c8a-433f-9dba-ea3eedd386c1&width=834&cache=v2)
登陆:
![notion image](https://www.notion.so/image/https%3A%2F%2Fprod-files-secure.s3.us-west-2.amazonaws.com%2F5fdde3cf-8f5c-4292-84e6-0bb16a36f7d7%2F292f769b-ccb7-4e83-b816-ad40ca855318%2FUntitled.png?table=block&id=6fc33df6-c910-40f9-87b8-ec4e3d02c28e&t=6fc33df6-c910-40f9-87b8-ec4e3d02c28e&width=695&cache=v2)
代码完整github链接:https://github.com/hehan-wang/nextjs-copilot-demo
这个代码还比较初级,页面样式,后端数据库等还有很多功能需要逐渐完善。
也都是根据我们的「根本需求」,在聊天框与Copilot不断对话进行代码编写。
做一个系统再也不是先都学会对应技术才开始开发。而是先开发,再去学习对应技术。
联系我
AIGC交流群:
![notion image](https://www.notion.so/image/https%3A%2F%2Fprod-files-secure.s3.us-west-2.amazonaws.com%2F5fdde3cf-8f5c-4292-84e6-0bb16a36f7d7%2Fa0878e89-e2fc-4036-b9a2-f2e7ac8f1ef3%2FUntitled.png?table=block&id=815dcadb-4b3f-4e89-bc9f-b34affd64675&t=815dcadb-4b3f-4e89-bc9f-b34affd64675&width=384&cache=v2)
微信:
添加微信回复「加群」,拉你入交流群
![notion image](https://s2.loli.net/2023/09/07/vfFCGmnzsbMTupy.png?t=063a9153-f9c4-470b-b6eb-0c344a77f276)
- 作者:鹤涵
- 链接:https://www.hehanwang.com/article/copilot-chat
- 声明:本文采用 CC BY-NC-SA 4.0 许可协议,转载请注明出处。