全部路线
上线:我的代码、我的域名、真正的地址
精通

上线:我的代码、我的域名、真正的地址

从代码所有权到域名连接、GitHub、Launchpad 公开。课程的最后一关

约 60 分钟16 步

完成后你将拥有

能把自己的成果发布到真正的地址,握着代码和数据的所有权,向世界公开。

准备清单

  • VibeCampus 账号必需

    只要注册,就能立刻跟上这门课的实操。发布和领取免费网址都没有额外费用。

  • 推荐先修:可信的成果可选

    要上线的作品最好是核查过的作品。修完可信课程再来,这门课才算完整。

1

做出来的东西和存在于世上的东西的差别

到现在为止你做了很多东西。但它们还都待在工作室里。这门课学完就不一样了:能发给朋友说“这是我的网站地址”的真地址,在搜索栏里输入就能打开的我的域名,在 Launchpad 上收着反馈和助力的公开项目。从做出东西的人,变成上线过东西的人。

一说上线,服务器、部署、DNS 这些词可能像一堵墙。没关系。这门课会把那堵墙的砖头用术语卡片一块块拆开,而真正的按钮只需要几次点击。可怕的是名字,不是实体。

这门课里还流着另一个主题:所有权。代码、数据、域名,都是你的。你会亲自确认,上线不是被平台拴住,而是把自己的资产立到世上。

2

查看全部代码:这些代码是我的

在工作室按下代码标签,当前作品的全部源代码尽收眼底。一行都不藏。看不懂也没关系。重要的是这件事实:随时能全部看到、能复制、能带走。

这为什么重要?有些工具把成果锁在自己肚子里,离开那个工具就什么都不剩。VibeCampus 相反。成果的代码整体归你,随时可以搬去别处、拿给别的开发者看、亲手修改。

翻一翻代码,会有意外读得懂的部分。当按钮的文案、色号、板块的标题开始映入眼帘,代码就从外星语变成文档,这是第一步。

出现这样就成功了

在代码标签里显示完整源码,复制按钮可以放进剪贴板。边滚动边发现你网站的文案就藏在代码里,这一步就够了。

3

下载代码:握在手里的备份

按下下载按钮,作品会以文件形式存下来。这个文件是躺在你电脑里的完整副本。断网也好,出什么事也好,成果都留在你手里。

下载的文件可以直接用浏览器打开。双击一下,刚才还在工作室里看的网站就在你自己的电脑上打开了。不用服务器也能打开,这个体验是理解网页本质的好时刻。

重要的作品建议每个版本都下载、按文件夹整理。起上 v1、v2 这样的名字,就是你自己的历史档案馆。

小贴士

下载是免费的,每次大改之前都存一份。这是最原始、也最可靠的备份。

4

交接包:搬去哪里都接得上的行李

交接包是下载的完全版。除了完成的成果(index.html),还有讲解运行、托管和后端连接的 README,以及向 AI 工具交接这个项目的 AGENTS.md,一个 zip 全装下。免费。

这个 zip 的力量是连续性。解压后用 Claude Code、Cursor、VS Code 这类工具打开,那些 AI 会读完 AGENTS.md、在理解项目的状态下接着干。交给开发者时,有 README 在,解释都省了。

而且不管放到哪里,表单、会员、聊天机器人这些功能都被做成持续可用。等于是搬了家,水电照通的行李。

出现这样就成功了

运行交接后会保存 vibecampus-handoff.zip。解压确认里面有 index.html、README、AGENTS.md 三个文件,就算成功。

5

嵌入代码:把我的成果嵌进别处

嵌入是把你的成果嵌进其他页面的复制粘贴代码块。就算你已经有在运营的博客或公司主页,也能把工作室里做的宣传视频或内容放进去。

在视频嵌入页面,无论是工作室宣传视频、YouTube 还是 Vimeo,把视频地址一贴,就能生成定好画面比例、自动播放(静音)、循环、最大宽度、圆角的嵌入代码。复制、贴到想要的位置,结束。

从上线战略看,嵌入是一座桥。不丢掉既有渠道,把新做的东西架上去,连接两个世界。

小贴士

贴嵌入代码时,先用实时预览确认样子。把比例和宽度对准目的地页面,它就会自然得像原本就在那里的内容。

6

域名是什么:招牌、电话簿、门锁

现在说地址。光是发布就有免费网址,但打算做品牌的话,需要自己的域名。myflower.com 比 mysite-abc123 这样的地址更配得上名片,不用解释。

域名身边总跟着两个词:DNS 和 SSL。下面三张卡片整理好了,一张张点开。有这三张,域名相关的对话大半都能听懂。

先安个心:在 VibeCampus 里,这三样几乎不用你亲手碰。概念懂了,按钮由工具来按。

术语卡片 · 点开查看

域名 (domain)

互联网世界里我的店铺招牌兼地址。像 myflower.com 这样。

人们访问你的网站时输入的名字。发布后免费网址马上就有,自有域名是为了品牌另外连接的可选一步。通常按年注册和续费。

DNS

把招牌名换算成实际建筑位置的互联网电话簿。

把域名连到服务器地址的系统。连接域名时添加记录的操作,就是往这本电话簿里写新的一行,而新行传遍全世界需要一点时间。

SSL (HTTPS)

把客人和店铺之间的对话装进信封密封的那把锁。

地址栏里的小锁标志,为访客与网站之间的通信加密。如今的浏览器会对没有锁的网站弹警告,所以它实际上是必需品;通过 VibeCampus 连接会自动签发证书。

注意

域名与其说是拥有,不如说是租用。忘了续费就会失去地址,热门名字会立刻被别人拿走。注册时建议打开自动续费。

7

域名搜索:找到我的名字

在域名页面输入想要的名字,就能一次查清全球域名的注册状态。它实时查询公开注册局数据,可注册和已注册当场显示。不注册账号也能免费搜索。

名字候选准备三四个。心仪的名字已被注册的情况比想象中多。.com 被占了的话,考虑 .co 或 .kr 这类其他后缀也是办法。

找到可注册的名字,就能一路接到购买。通过 VibeCampus 注册的话,会自动连到你已发布的作品,无需配置 DNS。下一步还会学怎么连接你已经拥有的域名。

出现这样就成功了

搜索结果里按后缀显示可注册或已注册的状态。找到至少一个可注册的候选,这一步就算成功。

动手试试

小贴士

好域名的标准有三条:短,读出来就能想起写法,和品牌接得上。在电话里念给对方、对方一次就能输入,就算合格。

8

连接域名:把我的网站挂上我的地址

如果你已经有域名,可以在连接页面把它挂到已发布的作品上。流程有三步:添加域名后,屏幕上会显示 DNS 记录(类型、主机、值);把这些值原样添加到你买域名的注册商管理后台;回来按校验 DNS 就行。

校验通过后,托管和 HTTPS 会自动收尾,完成时状态变为已上线。你做的只是复制和粘贴,而幕后已完成电话簿登记和门锁签发。

发布让你紧张也没关系。随时可以转回私密,域名连接也可以解除。上线不是不可撤销的图章,而是可调节的开关。

注意

DNS 生效可能要几分钟到几小时。记录刚加上就校验不过,不代表出错。隔段时间再按一次校验。

遇到报错怎么办?

9

部署做的事:发布按钮的幕后

按下发布会发生什么?成果被放上一台永远开着的电脑,签发一个全世界哪里都能打开的免费网址,后端自动开启。这整个过程叫部署。

从前这件事要搭上租服务器、配置、安全、证书,好几天。现在你一个按钮全办完。不过知道按钮背后发生了什么,出问题时你就是知道该看哪里的人。

下面三张卡片整理了部署、托管、服务器。三者连成一句话:部署,就是入驻服务器这栋楼、接受托管。

出现这样就成功了

按下发布,稍后就会签发免费的安全网址,那个地址在你手机上、在别的国家都能打开。复制地址、换台设备打开确认一下。

术语卡片 · 点开查看

部署 (deploy)

开店营业。把做好的东西向真正的客人敞开的那一刻。

把成果放上互联网、让任何人都能打开。在 VibeCampus,发布按钮一下连免费网址一起签发,而且随时可以转回私密。

托管 (hosting)

我的店入驻的那栋楼的物业服务。24 小时灯不灭。

保管网站文件并递送给访客的服务。发布后托管由 VibeCampus 代管,大楼的事你不用操心。

服务器 (server)

每有订单进来就干活的、永远开着的电脑。

让网站昼夜运转的电脑。不用自己买、自己配,发布的同时它就在幕后就位,后端功能也自动开启。

10

为什么存进 GitHub:代码的存档点

交接包让你拿到了代码,现在说说怎么守住它。开发者们把代码记进一个叫 Git 的版本管理系统,再把记录保管到 GitHub 这个线上金库。下面三张卡片就是这个世界的钥匙。

屏幕上的命令,是在下载的项目文件夹里留下第一条记录的三行。git init 是宣布要记录这个文件夹的历史,git add 是挑选要记录的文件,git commit 是连着留言盖下印章。执行完,就有了一个叫 v1 首次上线的存档点。

现在不是必须马上做。但项目越珍贵,存档点越值钱。解开交接包、敲下这三行的那一刻,你的代码就离失误和事故又远了一层。

终端
$git init
$git add -A
$git commit -m "v1 — first launch"
[main (root-commit) a1b2c3d] v1 — first launch

术语卡片 · 点开查看

版本管理 (Git)

像游戏存档点一样,把代码的每个瞬间存下来、随时能回去的装置。

记录代码变更历史的系统。出了错也能回到之前的存档点,修改就不再可怕。一个人干活时,它也是最可靠的安全网。

提交 (commit)

按下存档键的动作。“到这里完成”的印章。

把当前状态连同留言一起记入历史的单位。在有意义的节点都留一个,之后就能精确找到想回去的时刻。

GitHub

保管存档文件的云端金库,也是全世界开发者的工作间。

把 Git 记录保管到线上并共享的服务。电脑坏了代码也安全,向其他开发者或 AI 工具移交项目也更容易。

小贴士

提交留言是写给未来自己的便条。比起“修改”,写“预约表单增加错误提示”这样记下做了什么,一个月后的你会感谢现在的你。

11

带着数据搬家:从一开始就归我所有

和代码一样重要的是数据。预约、会员、订单记录若堆在平台名下的仓库里,离开的那一刻就得全部留下。VibeCampus 的结构不一样:连上后端后,数据从一开始就直接存进你自己名下的数据库(Supabase)。

这个结构的意义在搬家时显现。用交接包把代码带走、放到别处,数据库还在你的账号里,表单、会员、数据原样接续。这不是打包家当的搬家,而是只换房子、家具原封不动的搬家。

上线前只确认一次:有表单或登录的作品,后端连没连上,数据是不是在你的仪表盘里累积。这一次确认,守住的是未来的所有权。

注意

不连后端就发布,表单提交这类数据可能不会被保存。等开始接客才发现,就意味着这期间的咨询都消失了。发布前务必检查。

12

维护三条路:上线之后的日子

上线不是结束,是运营的开始。今后需要修改时,你面前有三条路。第一,留在工作室继续。用持续改进对话和点击编辑,像至今一样修改,这是最容易的路。

第二,交接包加 AI 工具。把代码下载下来,用 Claude Code 或 Cursor 这类工具亲自上手。有 AGENTS.md 在,那些 AI 也是理解项目之后才动工。第三,交给人。带着 README 的代码,任何开发者都能直接接手。

三条路互不封堵。平日走工作室,大改走 AI 工具,专业领域交给人。能按情况随时换乘,这本身就是拥有代码的人的特权。

小贴士

现在不用急着定。只要记住一件事:“卡住了,还有两条路”。这份余裕能把运营的压力砍掉一半。

13

登记 Launchpad:告诉世界

地址有了,该吆喝了。Vibe Launchpad 是把正在做的和已上线的东西展示给世界的舞台。按登记项目,填好名称、一句话介绍、说明、类目和真实网址,就公开了。

公开的项目会收到反馈,喜欢的人会用助力送积分为你加油。还没上线的话,可以用接收上线通知先攒候补名单。切换成已上线的那一刻,所有候补都会收到通知。

在一句话介绍上下功夫。列表里人们读的只有那一句。它是做什么的、为谁做的,装进一个句子里,点击就会跟着来。

出现这样就成功了

登记完成后会生成你的项目页面,访客可以留下反馈和助力。第一次公开项目还有积分奖励。

动手试试
14

结业测验:一道题装下整个课程系列

这是结业测验。一个想法走向世界,按这个课程系列所学,最贴切的流程是哪一个?

15

最终任务:把花艺精品店网站做到上线

课程系列的最后一个任务。下方的“在工作室试试”按钮里备好了街角花艺精品店单页网站的提示词,一件带当季花目录和订购表单的、小而真实的作品。

这次不在做出来就停。发布,再加上告诉大家,才是任务。亲自转完这一整圈,你就不是知道上线的人,而是做过上线的人。

动手试试

任务

用预填提示词构建花艺精品店单页网站,用发布领取免费网址。用手机打开签发的地址确认后,到 Launchpad 登记为项目。有余力的话,再到域名搜索里找几个配得上花艺精品店的名字候选。

做完再展开

检查点:① 发布后免费网址签发了吗?② 手机上打开时订购表单显示正常吗?有表单的作品,记得同时确认后端连接。③ 在 Launchpad 登记时,一句话介绍里装进了对象(比如“为街角花艺精品店而做”)的话,满分。④ 连域名候选都找好了的话,注册和连接照学过的做就行。这一整圈,就是你今后每个项目都会重复的上线例程。

16

课程结业:下一扇门打开了

恭喜。从最初 15 分钟的心跳出发,走过提示词、网站、应用、游戏、媒体、编辑、可信,直到上线。你完整走完了课程的全部旅程。工作室里攒下的作品和真正的地址,就是证据。

现在的你,能一个人转动整个循环:把想法变成画面,把画面变成核查过的成果,把成果变成世上的地址。这个能力不会消失,只会越重复越快、越重复越深。

而下一扇门还在。学会了怎么做,接下来是怎么卖、怎么养。在一人创业学院,从想法验证、众筹市场、团队到营销,把做出来的东西变成生意的旅程正在等你。门是开着的。

记住这些

  • 代码所有权、交接包、域名与 DNS 与 SSL、部署与托管、GitHub、数据所有权、维护三条路,再到 Launchpad。上线的全部过程你已亲手完赛。
  • 这门课真正的收成是所有权的感觉。代码、数据、域名都是你的,任何平台都拽不住你的脚踝。
  • 别忘了上线例程:检查,发布,确认,告诉大家。项目会换,这个节奏不变。
  • 课程到这里结业。想把做出来的东西养成生意的话,一人创业学院就是下一站。
在工作室试试
课程新建作品