高质量教程汇总了用LangChain、CopilotKit等主流框架可快速启动的AI项目案例,大幅降低AI应用开发门槛。
最近这些天对 AI 来说令人兴奋。
然而,作为开发者,我们中的很多人还不完全理解 AI 已经变得多么易于接近。
今天,我们将介绍一些你可以轻松用 AI 构建的精彩项目。无需成为 AI 专家,每个项目都配备了教程或代码演练。
在 React 中集成 AI 功能很困难,这正是 CopilotKit 发挥作用的地方。这是一个简单快速的解决方案,可以将生产就绪的智能体集成到任何产品中!
你可以使用两个 React 组件将关键 AI 功能集成到 React 应用中。它们还提供了内置的(完全可定制的)Copilot 原生 UX 组件,如 <CopilotKit />、<CopilotPopup />、<CopilotSidebar />、<CopilotTextarea />。
使用以下 npm 命令开始。
npm i @copilotkit/react-core @copilotkit/react-ui
Copilot Portal 是 CopilotKit 提供的组件之一,它是一个应用内 AI 聊天机器人,可以查看当前应用状态并在应用内采取行动。它通过插件与应用前后端以及第三方服务通信。
这是你如何集成一个聊天机器人。
一个 CopilotKit 必须包装所有与 CopilotKit 交互的组件。建议你也从 CopilotSidebar 开始(你以后可以切换到不同的 UI 提供者)。
"use client";
import { CopilotKit } from "@copilotkit/react-core";
import { CopilotSidebar } from "@copilotkit/react-ui";
import "@copilotkit/react-ui/styles.css";
export default function RootLayout({children}) {
return (
<CopilotKit url="/path_to_copilotkit_endpoint/see_below">
<CopilotSidebar>
{children}
</CopilotSidebar>
</CopilotKit>
);
}
你可以使用快速入门指南来设置 Copilot 后端端点。
之后,你可以让 Copilot 采取行动。你可以阅读如何提供外部上下文。你可以使用 useMakeCopilotReadable 和 useMakeCopilotDocumentReadable react hooks 来做到这一点。
"use client";
import { useMakeCopilotActionable } from '@copilotkit/react-core';
// Let the copilot take action on behalf of the user.
useMakeCopilotActionable(
{
name: "setEmployeesAsSelected", // no spaces allowed in the function name
description: "\"Set the given employees as 'selected'\","
argumentAnnotations: [
{
name: "employeeIds",
type: "array", items: { type: "string" }
description: "\"The IDs of employees to set as selected\","
required: true
}
],
implementation: async (employeeIds) => setEmployeesAsSelected(employeeIds),
},
[]
);
你可以阅读文档并查看演示视频。
你可以轻松集成 Vercel AI SDK、OpenAI API、Langchain 和其他 LLM 提供者。你可以按照本指南将聊天机器人集成到你的应用中。
基本思想是快速构建 AI 聊天机器人,而无需在开发任何基于 LLM 的应用时费力。
用例非常广泛,作为开发者,我们绝对应该在下一个项目中尝试使用 CopilotKit。
CopilotKit 在 GitHub 上有 5.8k+ Stars,发布了 200+ 个版本,意味着他们在不断改进。
我们可以用 CopilotKit 构建很多创新应用,所以让我们探索一些突出的例子!
你可以阅读这篇文章,使用 Next.js、Langchain、Supabase 和 CopilotKit 来构建这个精彩的应用。
LangChain 和 Tavily 被用作网络搜索 AI 智能体,Supabase 用于存储和检索博客平台文章数据,CopilotKit 用于将 AI 集成到应用中。
你可以查看 GitHub 仓库。
如果你不熟悉,Vercel 的 V0 是一个 AI 驱动的工具,让你根据提示生成 UI,以及许多其他有用的功能。shadcn 组件现在可以直接在 v0 的文档中编辑(如他们网站所示)。
你可以使用 Next.js、GPT4 和 CopilotKit 来创建一个 V0 克隆。这个详细的教程被评为前 7 名,总的来说,这是一个很好的项目来加入你的投资组合。
生成的注册页面输出如下所示。
你可以通过点击右上角的按钮轻松在 React 代码和 UI 之间切换。多么酷的概念!
你可以查看 GitHub 仓库。
你可以阅读这篇文章,使用 Next.js、OpenAI、Radix UI(用于可访问性)、Recharts(用于创建交互式图表)和 CopilotKit 来构建这个精彩的项目。
你可以观看 David 的演示!
如果你想用少量时间学到更多,这是我的最爱。
我喜欢这个 UI(通常教程中情况并非如此),这正是让它成为你编码清单上一个干净项目的原因 :)
你可以查看应用的在线演示。
你可以查看 GitHub 仓库。
你可以阅读这篇文章,使用 Next.js、GPT-4、LangChain 和 CopilotKit 来构建这个精彩的工具。
为了让工作更容易,它使用 React Spreadsheet 包为 React 创建简单的可定制电子表格,以及 Tavily AI 作为搜索引擎,使 AI 智能体能够进行研究并访问实时知识。
你可以观看这个演示!
你也可以查看在线演示。我可以肯定地说,这是一个独特的案例,你可以获得很多灵感。
你可以查看 GitHub 仓库。
你可以阅读这篇文章,使用 Next.js、OpenAI 和 CopilotKit 来构建这个精彩的用例。
不仅可以用 ChatGPT 生成你的简历,还可以将其导出为 PDF,甚至通过与其进行对话来进一步改进它。有多棒,对吧 :)
你可以查看 GitHub 仓库。
你可以阅读这篇文章,使用 Next.js、OpenAI 和 CopilotKit 来构建一个文本转 PowerPoint 应用。
这是一个简单但非常强大的概念,文章还清楚地说明了如何向任何幻灯片添加背景图像。
你可以查看 GitHub 仓库。
你可以从精心策划的列表中选择所需的科目,为个性化学习之旅奠定基础。
你需要提供有关你的教育背景的详细信息,使 StudyPal 能够根据当前知识水平定制材料和练习。
一个额外的详细信息部分允许学生指定关注领域,确保内容与他们的学习目标一致。
你可以阅读这篇文章,使用 React、Node 和 CopilotKit 来构建这个精彩的用例。
你可以观看应用的演示。
你可以查看 GitHub 仓库。
其余的项目将与 LangChain 和 AI 相关(其中一些使用 Python)。最好对此有一些基本了解。
LangChain 是一个用于开发由大型语言模型(LLM)驱动的应用的框架。
总的来说,LangChain 简化了 LLM 应用生命周期的每个阶段。你可以在官方文档中阅读更多内容。
如果你想了解更多关于 LangChain 的内容,我建议观看 freeCodeCamp 的这个教程。
我们可以使用 LangChain 构建大量高层级的应用,所以让我们探索一些突出的例子!
你的语音控制 Mac 助手。GPT Automator 让你使用你的声音在 Mac 上执行任务。例如,打开应用、查找餐厅和综合信息。太棒了 :D
它是在伦敦黑客马拉松期间构建的。
它有两个主要部分:
a. 语音转命令:使用本地运行的 Whisper 生成命令(Buzz 的一个分支)。
b. 命令转行动:你将命令给一个配备了我们编写的自定义工具的 LangChain 智能体。这些工具包括使用 AppleScript 控制计算机操作系统和使用 JavaScript 控制活跃浏览器。最后,像任何好的 AI 一样,我们使用 AppleScript 让智能体说出最终结果,说 "{Result}"(如果你还没有使用过,请尝试在你的 Mac 终端中键入 "Hello World!")。
我们制作的一个自定义工具,用于让 LLM 使用 AppleScript 控制计算机。提示是 docstring:
@tool
def computer_applescript_action(apple_script):
"""
Use this when you want to execute a command on the computer. The command should be in AppleScript.
Here are some examples of good AppleScript commands:
Command: Create a new page in Notion
AppleScript: tell application "Notion"
activate
delay 0.5
tell application "System Events" to keystroke "n" using {{command down}}
end tell
...
Write the AppleScript for the Command:
Command:
"""
p = subprocess.Popen(['osascript', '-'], stdin=subprocess.PIPE, stdout=subprocess.PIPE, stderr=subprocess.PIPE)
stdout, stderr = p.communicate(applescript.encode('utf-8'))
if p.returncode != 0:
raise Exception(stderr)
decoded_text = stdout.decode("utf-8")
return decoded_text
如果你想了解它的工作原理,GPT Automator使用OpenAI的Whisper将您的音频输入转换为文本。然后,它使用LangChain Agent从您的提示中选择一组操作,包括使用OpenAI的GPT-3("text-davinci-003")生成AppleScript(用于桌面自动化)和JavaScript(用于浏览器自动化)命令,然后执行生成的脚本。
记住,这不是用于生产环境。这个项目执行从自然语言生成的代码,可能容易受到提示注入和类似攻击的影响。这项工作是作为概念验证而进行的。
您可以阅读安装指南。
让我们看看一些提示及其将执行的操作:
⚡ 查找计算结果。
提示:"2 + 2 是多少?"
它将编写AppleScript来打开计算器并输入 5 * 5。
⚡ 查找附近的餐厅。
提示:"找到我附近的餐厅"
它将打开Chrome,在Google搜索附近的餐厅,解析页面,然后返回排名最靠前的结果。有时它很调皮,会打开Google Maps结果,并说"最好的餐厅就是Google Maps页面顶部的那些"。有时它会打开Google的首个链接——并卡在Google无障碍页面上……
以下是运行时打印到终端的内容:
Command: Find a great restaurant near Manchester.
> Entering new AgentExecutor chain...
I need to search for a restaurant near Manchester.
Action: chrome_open_url
Action Input: https://www.google.com/search?q=restaurant+near+Manchester
Observation:
Thought: I need to read the page
Action: chrome_read_the_page
Action Input:
Observation: Accessibility links
Skip to main content
... # Shortned for brevity
Dishoom Manchester
4.7
(3.3K) · £££ · Indian
32 Bridge St · Near John Rylands Library
Closes soon ⋅ 11 pm
Stylish eatery for modern Indian fare
San Carlo
4.2
(2.8K) · £££ · Italian
42 King St W · Near John Rylands Library
Closes soon ⋅ 11 pm
Posh, sceney Italian restaurant
Turtle Bay Manchester Northern Quarter
4.7
Thought: I now know the final answer
Final Answer: The 15 best restaurants in Manchester include El Gato Negro, Albert's Schloss, The Refuge, Hawksmoor, On The Hush, Dishoom, Banyan, Zouk Tea Room & Grill, Edison Bar, MyLahore Manchester, Turtle Bay Manchester Northern Quarter, San Carlo, The Black Friar, Mana, and Tast Cuina Catalana.
我不能保证那些餐厅值得去,自担风险访问。哈哈!
您可以在这里看到完整演示!
您可以在Chidi的博客上阅读更多内容。
这更像是一个副业项目,所以他们在GitHub上大约有200个星标,但它非常酷。
您可以查看GitHub仓库。
✅ Instrukt - 集成在终端中的AI。
Instrukt是一个基于终端的AI集成环境。它提供了一个平台,用户可以:
创建并指示模块化AI智能体。
为问答生成文档索引。
为任何智能体创建并附加工具。
用自然语言指示它们,并为了安全起见,在安全容器(当前用Docker实现)内运行它们,以在其专用的沙箱空间中执行任务。
使用Langchain、Textual和Chroma构建。
使用以下命令开始。
pip install instrukt[all]
有许多令人兴奋的功能,例如:
为强大的键盘用户提供的基于终端的界面,可以在不离开键盘的情况下指示AI智能体。
对您的数据进行索引,让智能体检索它以进行问答。您可以使用易用的UI创建和组织索引。
索引创建将自动检测编程语言并相应地优化拆分/分块策略。
在安全的docker容器内运行智能体以确保安全和隐私。
集成的REPL提示符,用于与智能体快速交互,以及开发和测试的快速反馈循环。
您可以使用自定义命令自动化重复任务。它还具有内置的提示/聊天历史记录。
您可以阅读有关所有功能的信息。
您可以阅读安装指南。
您也可以使用内置的IPython控制台调试和自省智能体,这是一个不错的功能。
Instrukt采用AGPL许可证,意味着任何人都可以将其用于任何目的。
可以说,Instrukt是您指尖上的终端AI指挥官。
这是一个新项目,所以他们在GitHub上大约有200多个星标,但用例非常好。
您可以查看GitHub仓库。
✅ ChatFiles - 上传您的文件并与之进行对话。
文档聊天机器人——支持多个文件,由GPT/嵌入驱动。您可以上传任何文档并与之进行对话,考虑到他们使用了另一个著名的开源项目,UI非常好。
它在底层使用Langchain和Chatbot-ui。使用Nextjs、TypeScript、Tailwind和Supabase(向量数据库)构建。
如果您想知道该方法和技术架构,请看这里!
环境仅用于试用,最大支持文件大小为10 MB,这是一个缺点。如果您需要更大的大小,可以在本地安装它。
他们提供了起始问题,您可以使用。您可以查看实时演示。
他们在GitHub上有3000个星标,目前发布到v0.3版本。
您可以查看GitHub仓库。
✅ 使用多智能体协作的终极AI自动化 - LangGraph + GPT Researcher。
LangGraph是一个用于使用LLM构建有状态的多角色应用程序的库。此示例使用Langgraph自动化对任何给定主题进行深度研究的过程。
简而言之,此示例展示了一个AI智能体团队如何协作进行给定主题的研究,从规划到发布。此示例还将利用我在之前的一篇文章中已经介绍过的领先自主研究智能体GPT Researcher。
研究团队由七个LLM智能体组成:
⚡ 主编 - 监督研究过程并管理团队。这是使用LangGraph协调其他智能体的"主"智能体。此智能体充当主LangGraph接口。
⚡ GPT Researcher - 一个专门的自主智能体,对给定主题进行深度研究。
⚡ 编辑 - 负责规划研究大纲和结构。
⚡ 审阅者 - 根据一组标准验证研究结果的正确性。
⚡ 修订者 - 根据审阅者的反馈修订研究结果。
⚡ 写手 - 负责编制和撰写最终报告。
⚡ 发布者 - 负责以各种格式发布最终报告。
自动化过程基于以下阶段(架构),这在文章中清楚地显示:
数据收集和分析。
撰写和提交。
您可以阅读详细的步骤文档,了解发生了什么。
最后运行助手将生成最终研究报告,格式如Markdown、PDF和Docx。
您可以阅读这篇文章,其中包括"如何使用多智能体协作构建终极AI自动化",由Wix的R&D负责人Assaf Elovic讲解如何使用带有专门智能体团队的LangGraph构建自主研究助手。它有易于遵循的代码示例,并清楚地说明了发生的情况。必读!
最好的部分是,如果您想更改研究查询和自定义报告,您只需编辑主目录中的task.json文件。真是太棒了:)
它在GPT Researcher下,有10k星标,但由于最后一次提交仅几天前,它会频繁更新。
您可以查看GitHub仓库。
WingmanAI是一个强大的工具,用于与系统和麦克风音频的实时转录进行交互。
它使用ChatGPT,让您与转录内容实时交互,作为机器人的广泛记忆库,提供独特的通信平台。
当您加载指定人员的转录内容时,机器人甚至可以回答有关过去对话的问题。
所有很棒功能的分解:
⚡ 它可以转录系统输出和麦克风输入音频,允许您以易于阅读的格式查看实时转录。
⚡ 机器人以令牌高效的方式维护对话记录,因为只有当前的转录片段被传递给机器人。
⚡ 您可以与由ChatGPT驱动的机器人聊天,该机器人实时读取您的转录。
⚡ 您可以继续向已保存的转录内容添加内容,随着时间的推移构建一个庞大的数据库供机器人使用。
⚡ 它允许您保存转录以供将来使用。您可以随时加载它们,对机器人所做的任何查询都将与已保存转录的向量数据库进行交叉参考,为机器人提供更丰富的上下文。
您可以阅读安装说明。您只需将OpenAI API密钥放在keys.env文件中并运行main.py。
唯一的缺点是该应用目前仅与Windows兼容。现在Windows用户更高兴了:)
你可以观看完整的演示视频。由于限制,下面附加的gif较短(86秒中只有30秒)。
我对这个概念感到非常惊讶,因为我从未想到以这种方式是可能的。当开发者用最小化的概念创建一些很酷的东西时,感觉真的很棒:)
它在GitHub上有420多个星标,但不再维护。但你可以用它来构建更好的东西。
你可以查看GitHub仓库。
一个允许你根据知识笔记进行考试的应用。它让你专注于你学到和写下的东西🧠。
它不断用问题提示你查看你的笔记内容,这对学生、学者、面试者和终身学习者非常有用。
项目管理员正在使用next.js重构该项目,这对使用next.js的开发者非常有益。
让我们分解一些很棒的功能:
⚡ 创建笔记时,你可以上传相关文档。应用程序根据文档内容从这些文档中生成一组问题。这些问题将在未来呈现给你。创建笔记时,作为用户的你也可以选择要生成的问题类型。
⚡ 收到每日问题后,你可以提供答案。GPT将对答案进行评分、验证并提供正确答案。分数是通过评估答案的正确性和关联文档(0~10分)来确定的。此分数影响后续的艾宾浩斯复习过程。它将在未来版本中进行优化。
⚡ 角色可以为问题生成和评估提供更多可能性。你可以在配置页面上设置角色。有关各种角色的更多信息,建议参考详细的角色手册指南。
⚡ 练习问题时,你可以用不同的方法回答。下面的图像显示了一个单选题的例子。
⚡ 它有一个包含多个模块的列表,如审查、笔记、笔记管理和随机问题,使用这些你可以在笔记中导入问题,删除或向上传的笔记添加新文件,等等。
我喜欢整个概念,这将吸引任何曾经遇到过修改笔记问题的人的注意。
你可以阅读包含有关如何正确使用此工具的详细指南的文档。
它在GitHub上有1k个星标,处于v0.4.2版本。
你可以查看GitHub仓库。
SpeechGPT是一个网络应用程序,使你能够与ChatGPT进行对话。
你可以利用此应用程序改进你的语言表达技能,或者只是享受与ChatGPT聊天的乐趣。
你们大多数人会说这有什么独特之处,但它确实有。
让我们分解一些很棒的功能:
⚡ 所有数据都存储在本地,这提供了更强的隐私保护。
⚡ 根据文档,它支持100多种语言,但我在实时演示中只能看到三种语言的支持。
⚡ 包括内置语音识别和Azure语音服务集成。
⚡ 包括内置语音合成,以及与Amazon Polly和Azure语音服务的集成。
按照文档中的本教程来了解如何使用此工具。
你可以在speechgpt.app上看到实时演示。这是一个完美的例子,说明几个额外的功能如何将你的应用程序提升到下一个级别!
SpeechGPT在GitHub上有2.7k个星标,处于v0.5.1版本。
你可以查看GitHub仓库。
✅ myGPTReader - 阅读和与AI智能体聊天。
myGPTReader是Slack上的一个机器人,可以读取和总结任何网页、文档(包括电子书),甚至YouTube上的视频。它可以通过语音与你交流。
一些值得注意的功能包括:
⚡ 使用myGPTReader通过对话快速读取和理解任何网络内容,甚至视频(目前仅支持带字幕的YouTube视频)。
⚡ 使用myGPTReader快速读取任何文件的内容,支持电子书、PDF、DOCX、TXT和Markdown。
⚡ 通过向myGPTReader说话来练习外语,它可以成为你的个人家教,支持中文、英文、德文和日文。
⚡ 内置了大量的prompt模板,使用它们与ChatGPT进行更好的对话。
⚡ 每天myGPTReader都会发送最新的热门新闻并自动生成摘要,所以你可以快速了解今天的热门话题。
你可以访问官方网站。
你可以加入仓库中的Slack频道,该频道有5000多个成员,可以免费体验所有这些功能。
他们在GitHub上有4.4k个星标,使用Python构建,就像此列表中的其他项目一样。
你可以查看GitHub仓库。
✅ RepoChat - 聊天机器人助手,支持GitHub仓库交互。
Repochat是一个交互式聊天机器人项目,旨在使用大语言模型(LLM)进行关于GitHub仓库的对话。
它允许用户与GitHub仓库进行有意义的讨论、提出问题和检索相关信息。本README提供了在本地计算机上设置和使用Repochat的分步说明。
他们创建了两个具有不同功能的分支,这对我来说有点新奇。
⚡ Repochat的主分支设计为完全在本地计算机上运行。这个版本的Repochat不依赖外部API调用,提供对数据和处理的更大控制。如果你正在寻找一个自包含的解决方案,主分支是正确的选择。
⚡ Repochat的云分支主要依赖于对外部服务的API调用进行模型推理和存储。它非常适合那些更喜欢基于云的解决方案并且不想建立本地环境的人。
你可以阅读安装说明。
Repochat允许你与聊天机器人进行对话。你可以提问或提供输入,聊天机器人将从向量数据库中检索相关文档。
然后它会发送你的输入以及检索到的文