Aider + Claude 3.5 Sonnet:使用 AI 生成全栈应用程序(NextJS + Supabase)

我将告诉您如何使用 Aider 和 Claude-3.5-Sonnet 生成全栈生产就绪的 Web 应用程序。我将使用 AI 创建一个全栈 NextJS (React) + Supabase 日历应用程序,而无需编写任何代码。

你还可以将其与开源 LLMs 一起使用,例如 DeepSeek-Coder-V2、Qwen2、Llama-3 和其他此类 LLMs。这将是关于如何使用人工智能创建全栈应用程序的全面实践。

起初,我学习了C语言,

直到我终于记住了数据结构,而人们对我说,这是网络的时代:

你应该学习PHP:

然后我学会了它。

接着人们对我说,所有东西都将移到客户端,

然后我学会了JavaScript。

之后人们说,应该更加互动和用户友好,所以我开始使用React。

现在人们说你不需要学习任何东西,因为显然计算机将自己完成所有事情,因为AI。

所以现在写AI相关的文章,这样AI就不会很快取代我。这些说法最初被认为是噱头,但随着大型语言模型(LLMs)的增强,这些说法真的变成了现实。

我写了相当多的文章关于文本到应用程序软件,其中有一篇我使用Claude制作了一个带有声音效果和一切的完整游戏。

这些AI文章或许可以让你知道AI的边界在哪里,AI能干什么,其实他远比你想的有能力。

[

Aider + Claude + Invoke + Udio :从头到尾使用 AI 创建游戏!(音乐、代码、动画)

今天我们继续上一点难度,使用Aider和Claude制作一个完整的全栈应用程序

现在问题是我会创建什么以及我会使用什么工具。好吧,我会使用NextJS作为前端,Supabase作为后端。我将创建一个包含登 录页、认证等的完整应用程序。

我会使用这些工具,因为大多数人现在都在使用它们,这将确保我们使用的是当前流行的前端和后端。

那么,我会创建什么呢?我会创建一个日历应用程序,这个日历应用程序将类似于Google日历,您可以创建事件、在日历上安排它们并查看您的日程,和通常日历应用程序中的功能一样。

如前所述,我将使用Claude 3.5 Sonet和AER来制作它。我不会触碰任何代码文件,除了设置环境变量和其他基本设置的东西,比如创建表等。

所以让我们开始吧,

好的,首先我们需要安装AER,

你可以通过pip install 命令轻松完成。

一旦完成,像这样导入你的Anthropic API密钥(上方插入的文章有提到免费API项目)。

现在你可以使用AER命令,但在此之前我们需要创建一个NextJS项目。为此,我们运行create next app命令,命名为calendar app。

好,它已经创建好了。现在我们进入文件夹。现在运行AER命令。

首先我们要求它生成一个简单的日历应用程序,

连接到Supabase进行认证等功能。确保你给出详细的提示以获得更好的结果。无论如何,发送请求。

好,它正在生成,稍等片刻。

好了,它已经生成了。

现在运行它,在运行之前,确保你运行npm install命令,以便安装所有依赖项。

现在启动它。

好,它报了一个错误。我们将这个错误粘贴到AER并让它修复这个问题。

它说它已经修复了。

好,它现在要求添加Supabase凭证的环境变量。所以,我创建了一个Supabase项目,并从那里获得了URL和一个匿名密钥。

然后我创建了一个.env文件并输入了详细信息,现在它运行正常。

你可以看到,这是登录和注册页面,我在文本框中输入的文本是不可读的,因为它是白色的,但无论如何,我注册并登录了。

你可以看到,这个日历看起来很好,并且有控件和一切,

但现在没有任何功能。

所以,首先我们让它修复设计,以确保一切可读(太黑了,字都看不清)。

好,它现在已经完成了。现在你可以看到一切都可读了。

▲ 上方视频5分钟部分查看动态内容

现在我们让AER连接到数据库并使其正常工作。

它现在已经完成了,并要求在Supabase中创建一个表。

还有一些其他问题,我也修复了。现在我可以创建事件,但上个月、下个月和不同的视图不起作用。所以我通过更多的提示修复了这些问题,现在它可以工作了。

这非常酷,你可以在任何月份创建事件,查看当天、一周的日程等。

▲ 上方视频5分钟部分查看动态内容

尽管在我们创建事件时,每个事件的时间仍然缺失,所以我也添加了这一点。现在它非常酷了。

在这之后,我又通过AER做了更多的修改,我添加了一个登陆页面,使其更美观,添加了Framer Motion等。

这是登陆页面,看起来很不错,有一个好的横幅部分、功能部分、推荐部分和一个CTA横幅。

如果我点击它,你可以看到这里有一个很酷的登录和注册页面。如果我在这里注册:

你可以看到它还会发送一个Supabase的验证邮件。

一旦你验证了,你就可以登录,你会看到这个日历,你可以点击任何日期,输入你的事件名称和时间,然后它就会被添加。

我通过AER添加了动画,这使整个应用程序更加流畅。你还可以看到多个视图,以及在不同月份之间切换。这看起来非常酷。

如何学习大模型 AI ?

由于新岗位的生产效率,要优于被取代岗位的生产效率,所以实际上整个社会的生产效率是提升的。

但是具体到个人,只能说是:

“最先掌握AI的人,将会比较晚掌握AI的人有竞争优势”。

这句话,放在计算机、互联网、移动互联网的开局时期,都是一样的道理。

我在一线互联网企业工作十余年里,指导过不少同行后辈。帮助很多人得到了学习和成长。

我意识到有很多经验和知识值得分享给大家,也可以通过我们的能力和经验解答大家在人工智能学习中的很多困惑,所以在工作繁忙的情况下还是坚持各种整理和分享。但苦于知识传播途径有限,很多互联网行业朋友无法获得正确的资料得到学习提升,故此将并将重要的AI大模型资料包括AI大模型入门学习思维导图、精品AI大模型学习书籍手册、视频教程、实战学习等录播视频免费分享出来。

在这里插入图片描述

第一阶段(10天):初阶应用

该阶段让大家对大模型 AI有一个最前沿的认识,对大模型 AI 的理解超过 95% 的人,可以在相关讨论时发表高级、不跟风、又接地气的见解,别人只会和 AI 聊天,而你能调教 AI,并能用代码将大模型和业务衔接。

  • 大模型 AI 能干什么?
  • 大模型是怎样获得「智能」的?
  • 用好 AI 的核心心法
  • 大模型应用业务架构
  • 大模型应用技术架构
  • 代码示例:向 GPT-3.5 灌入新知识
  • 提示工程的意义和核心思想
  • Prompt 典型构成
  • 指令调优方法论
  • 思维链和思维树
  • Prompt 攻击和防范

第二阶段(30天):高阶应用

该阶段我们正式进入大模型 AI 进阶实战学习,学会构造私有知识库,扩展 AI 的能力。快速开发一个完整的基于 agent 对话机器人。掌握功能最强的大模型开发框架,抓住最新的技术进展,适合 Python 和 JavaScript 程序员。

  • 为什么要做 RAG
  • 搭建一个简单的 ChatPDF
  • 检索的基础概念
  • 什么是向量表示(Embeddings)
  • 向量数据库与向量检索
  • 基于向量检索的 RAG
  • 搭建 RAG 系统的扩展知识
  • 混合检索与 RAG-Fusion 简介
  • 向量模型本地部署

第三阶段(30天):模型训练

恭喜你,如果学到这里,你基本可以找到一份大模型 AI相关的工作,自己也能训练 GPT 了!通过微调,训练自己的垂直大模型,能独立训练开源多模态大模型,掌握更多技术方案。

到此为止,大概2个月的时间。你已经成为了一名“AI小子”。那么你还想往下探索吗?

  • 为什么要做 RAG
  • 什么是模型
  • 什么是模型训练
  • 求解器 & 损失函数简介
  • 小实验2:手写一个简单的神经网络并训练它
  • 什么是训练/预训练/微调/轻量化微调
  • Transformer结构简介
  • 轻量化微调
  • 实验数据集的构建

第四阶段(20天):商业闭环

对全球大模型从性能、吞吐量、成本等方面有一定的认知,可以在云端和本地等多种环境下部署大模型,找到适合自己的项目/创业方向,做一名被 AI 武装的产品经理。

  • 硬件选型
  • 带你了解全球大模型
  • 使用国产大模型服务
  • 搭建 OpenAI 代理
  • 热身:基于阿里云 PAI 部署 Stable Diffusion
  • 在本地计算机运行大模型
  • 大模型的私有化部署
  • 基于 vLLM 部署大模型
  • 案例:如何优雅地在阿里云私有部署开源大模型
  • 部署一套开源 LLM 项目
  • 内容安全
  • 互联网信息服务算法备案

学习是一个过程,只要学习就会有挑战。天道酬勤,你越努力,就会成为越优秀的自己。

如果你能在15天内完成所有的任务,那你堪称天才。然而,如果你能完成 60-70% 的内容,你就已经开始具备成为一名大模型 AI 的正确特征了。

这份完整版的大模型 AI 学习资料已经上传CSDN,朋友们如果需要可以微信扫描下方CSDN官方认证二维码免费领取【保证100%免费

在这里插入图片描述

  • 17
    点赞
  • 9
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值