Transcript
00:00:00这是我自己仅花了几分钟就搭建好的活动落地页。
00:00:05它甚至还包含了一个由 AI 驱动的虚拟试穿体验。
00:00:09老板把这个项目交给我，而 V0 帮我把想法变成了真实的软件。
00:00:14在接下来的视频中，我将向你介绍什么是 V0，以及如何一步步构建项目。
00:00:19那么，什么是 V0 呢？
00:00:21AI 让生成代码变得轻而易举。
00:00:23V0 将这种能力转化为一种全新的形式，让任何人都能轻松构建真实的应用程序
00:00:28和网站，或是与开发人员进行协作。
00:00:30V0 旨在帮助你以最快的速度实现“从零到上线”。
00:00:36以下是 V0 的工作原理。
00:00:37你只需描述你想要的 App、智能体或网站，V0 就会在
00:00:42实时预览中生成代码。
00:00:43你可以通过与 V0 对话来对项目进行修改和调整，告诉它需要做哪些改动，
00:00:48它就会为你自动完成。
00:00:49V0 使用 Vercel 和 Next.js 生成真实的软件，但它不仅仅是一个网站生成器。
00:00:56它能生成真实的 App，将其连接到 AI 和数据库，并生成开发人员
00:01:00可以直接使用和部署的代码。
00:01:02这之所以可行，是因为 V0 是由 Next.js 编码框架的创造者 Vercel 开发的，
00:01:08该框架被 Under Armour、Stripe 和 Notion 等知名品牌所使用。
00:01:11因此，当 V0 构建并部署你的 Next.js App 时，你使用的是与
00:01:15全球顶尖公司相同的代码和安全基础设施。
00:01:19让我们展示几个项目，以便你亲眼看看 V0 的实际应用，以及上手有多么简单。
00:01:24假设我在一个营销团队，这周我有两个大项目要做。
00:01:27首先，我需要为我们即将推出的一款新产品搭建一个活动页面。
00:01:31其次，我需要更新我们网站上的一个落地页。
00:01:34我们先从活动页面开始。
00:01:36这个活动是一个新品发布派对，届时我们将推出一款名为 "Son of
00:01:40Ali" 的新腕表。
00:01:41我想把这个落地页设计得时尚且令人兴奋，以制造噱头，并为访客创造
00:01:45极具吸引力的虚拟试穿体验，从而吸引他们注册。
00:01:48所以，我打算直接把这个想法告诉 V0。
00:01:53我的提示词已经写好了。
00:01:54现在我提交这些指令，V0 就会开始构建。
00:01:59在 V0 构建的过程中，我想向你展示是什么让它如此强大。
00:02:02如果你点击“Settings”（设置），然后点击“Integrations”（集成），你就会看到
00:02:07V0 中所有可用的集成功能。
00:02:09首先，你可以看到 V0 已经内置了 AI。
00:02:12它将使用 AI SDK 来构建 AI 功能，并通过 AI Gateway 自动让你的
00:02:17应用访问数百个 AI 模型。
00:02:20你还可以构建或连接数据库来驱动应用的后端，甚至
00:02:25能通过 Stripe 接收付款。
00:02:27通过这些集成，你可以构建出真实的、全栈且支持 AI 的应用程序。
00:02:32好了，我们来看看我们的活动页面。
00:02:34V0 已经完成了第一版的构建，我们来测试一下。
00:02:38现在我要上传一张我自己的照片，它应该会像我们要求的那样，
00:02:44生成四张虚拟腕表试穿的效果图。
00:02:49太棒了，V0 确实采纳了我的指令并更新了代码。
00:02:55如果我们看一下编辑器，就会发现 V0 正在积极地更新 Next.js 代码。
00:03:00该编辑器还便于开发人员审查和编辑代码。
00:03:04好的，V0 已经完成了修改，看起来效果非常棒。
00:03:09在发布之前，我想把它分享给我的团队以获取反馈。
00:03:12我可以点击“Share”（分享），然后复制链接，将聊天和预览发送给我的团队。
00:03:18他们在这个预览中看到的内容，将与我公开页面时用户看到的内容完全一致，
00:03:22所以我不用担心在实际部署时会发生任何变化。
00:03:26团队审查完页面后，我就准备给它一个自定义 URL 并进行发布。
00:03:31更棒的是，这实际上已经在 Vercel 上为我创建的这个 V0 作品
00:03:36自动创建了一个项目。
00:03:37所以如果我点击“Inspect on Vercel”（在 Vercel 上检查），我就可以去实际查看那个项目。
00:03:42在该项目中，我可以查看所有的分析数据、错误以及完整的部署历史记录。
00:03:48太好了，我已经把这个 App 发布到生产环境了。
00:03:51现在我可以实际访问这个上线网站了，这就是用户会看到的内容，我可以分享
00:03:56该链接，大家就可以公开访问它了。
00:03:59V0 非常酷的一点是，我实际上可以选择添加自定义域名。
00:04:03我可以定制以 .vercel.app 结尾的域名，购买新域名，或者添加我
00:04:09已经拥有的域名。
00:04:10由于这是一个针对一次性活动的页面，我打算自定义基础域名，
00:04:14然后再次发布。
00:04:15太棒了。
00:04:16好了，现在域名已经更新，我可以通过我刚刚编辑并添加的新域名
00:04:21访问同一个页面了。
00:04:23就是这样。
00:04:24V0 现在已经将我的 App 部署在 Vercel 的基础设施上，并且向所有人公开访问。
00:04:30现在让我们转到我的下一个项目，即更新一个已经
00:04:34发布在我们营销网站上的落地页。
00:04:36我们的开发团队管理着该网站，并通过 GitHub 对代码进行版本控制，所以我需要
00:04:41将这次更新融入到他们的工作流程中。
00:04:44好消息是，V0 让我可以非常轻松地做到这一点。
00:04:48我要打开一个全新的 V0 窗口，然后点击“Import from GitHub”（从 GitHub 导入）。
00:04:52我其实已经拿到了我想访问的这个 GitHub 仓库的 URL，所以我
00:04:56直接把它粘贴到顶部的输入栏中，然后点击导入。
00:05:01就像这样，V0 导入了该仓库。
00:05:05现在 V0 已经导入了仓库，我准备好进行修改了。
00:05:08我想做的是在这个营销页面的顶部添加一个横幅，引导人们
00:05:12前往我们刚刚创建的活动落地页，以便他们注册 Son of Ali 的发布
00:05:17活动。
00:05:18所以，我要让 V0 帮我完成这个操作。
00:05:21在 V0 进行修改的同时，我将点击“Git”。
00:05:27你可以看到，V0 已经自动为我创建了一个分支，这将便于
00:05:31我的开发人员在将这些改动合并到主站之前，对其进行审查和测试。
00:05:35网站。
00:05:36好了，V0 已经完成了修改，现在是时候创建一个拉取请求（Pull Request）让我的
00:05:42团队进行审查了。
00:05:44所以我要点击“Open PR”（开启 PR），然后点击“Open pull request”（开启拉取请求）。
00:05:49现在如果我点击“View PR”（查看 PR），我就能看到我的拉取请求已经在 GitHub 上开启了。
00:05:54而且因为我们的网站托管在 Vercel 上，所以一个预览构建版本已经自动生成了。
00:05:59这样一来，不仅我们的开发人员可以审查代码，团队的其他成员也可以看到
00:06:03更新后的样子，并通过评论提供反馈。
00:06:06就是这样。
00:06:07我刚刚在没有给工程团队提工单的情况下，自己完成了营销网站的修改，
00:06:11而且他们可以在现有的流程中直接审查这些改动。
00:06:15我们为那些需要与开发人员协作的团队打造了 V0，无论是营销、产品、创始人，
00:06:19甚至是工程师自己。
00:06:22借助 V0，任何人都可以把自己的想法变成真实的软件，并在现有的应用和
00:06:27网站上进行协作。
00:06:28立即访问 v0.app，上线你的第一个项目吧。