很多人vibe coding的第一个项目往往是网站,这个问题估计会是小白脑子里蹦出来的第一个问题。
这篇文章就是帮助你理清这个问题的。而且全程大白话,用我的亲身经历,帮你扫盲。
做一个网站,本质就这几步:
第一步:想清楚。 你要做什么、给谁用、什么算完成。一般叫SPEC——别被英文吓到,它就是一份"需求说明书"。动手前写清楚做什么、不做什么、怎样算完成。这一步跳过了,后面全白干。
第二步:搭界面。 用户在浏览器里看到的东西——按钮、表单、输入框——这叫前端。你手机上打开一个网页,看到的一切,都是前端。
第三步:接服务。 你的网站要调用AI模型、要保存用户数据、要处理支付——这些"看不见"的工作,叫后端。后端在服务器上跑,前端看不到,但离了它什么都干不了。
第四步:连起来。 前端和后端怎么对话?靠API。
第五步:放到网上。 代码写好了,得放到一台24小时开着的电脑上,让别人能访问。这个过程叫部署。
就这五步。后面所有术语,都挂在这条链路的某个环节上。

小明想做一个AI写作网站。
他先写了一份SPEC,说清楚做什么、不做什么。然后他让AI生成了前端页面——一个输入框加一个按钮。接着他申请了DeepSeek的API钥匙,把钥匙存进环境变量。他让AI写了后端逻辑:用户点按钮,后端调用API,返回AI写的文章。
文章写好了,用户想保存。小明用Supabase搭了个数据库。他用Git管理代码,每次改动都有记录。
最后,他买了域名,做了备案,还加了HTTPS让传输安全。
一个完整的网站,上线了。
整个过程,小明没写一行代码——但他理解每一步在做什么,知道怎么验收,知道出了问题去哪里查。
API是出现频率最高的词,也是最被滥用的词。
简单说:API就是一个"窗口"。你的网站通过这个窗口,向另一个软件发请求、拿结果。
举个例子:你做了一个AI写作网站。用户输入一句话,你的网站需要让AI模型生成一篇文章。怎么让?通过API。你的网站把一个请求发给DeepSeek的API,API返回生成的文章。
API有四个要素:地址(Base URL)、接口(Endpoint)、模型(Model)、钥匙(Key)。
地址:去哪里找这个服务
接口:具体要做什么事
模型:用哪个AI来干活
钥匙:证明你有权限使用
少一个都不行。钥匙要藏在环境变量里(下面讲),绝对不能写在代码中。

环境变量就是放在代码外面的配置信息。
最典型的用途:保存你的API钥匙、数据库密码这些敏感信息。
为什么不直接写在代码里?因为代码会上传、会分享、会被别人看到。钥匙写在代码里,等于把家门钥匙贴在了公告栏。
在项目中,环境变量通常存在一个叫 .env 的文件里。这个文件绝对不能上传到Git。
Git是一个记录工具。你每改一次代码,它就拍一张"快照"。
改坏了?回到上一个快照。多人协作?各改各的再合并。
在AI编程时代,Git的重要性反而更高了——因为AI改代码非常快,一不留神就改飞了。没有Git,你连"改之前长什么样"都看不到。
Git里有两个关键概念:
commit(提交):一次快照,附带一句说明
仓库(repository):所有快照的集合
网站要记住东西——用户信息、订单记录、文章内容。这些存在哪里?数据库。
数据库就像一个巨大的Excel表格,但比Excel强大一万倍:可以同时被几万人读写、可以按条件快速查询、可以设定谁能看什么。
比如Supabase,这是一个开源的云端数据库服务。你不需要自己装数据库,注册一个账号就能用。
你的代码写好了,也部署到服务器上了。但别人怎么找到你?
需要一个域名——就是网址,比如 guokeai.com.cn。域名要花钱买,每年几十块到几百块不等。
国外上线不需要备案,但是国内需要绑定域名,还需要备案——向工信部提交申请,审核通过才能用。大概需要1-2周。这一块我之前写过文章,就不详细说了。可以看这篇很少有人告诉你的国内网站备案全流程,帮你避开90%的坑
HTTPS是加密连接。你看到浏览器地址栏有个小锁,就是HTTPS。没有HTTPS,用户和你之间传输的数据是"裸奔"的,谁都能截获。现在没有HTTPS的网站,浏览器会直接标"不安全"。
下周我会开讲AI编程,上文中说到的流程我会用一个一个鲜活的例子带你看清楚
2周搞定AI编程!Coze+TraeWork+Codex三大工具×6大案例,直播实战营带你从0到1

过客AI官网已上线!权益全新升级,介绍戳
大家好,我是AI实战博主过客,累计打造100+Coze落地玩法、60+Skill实战项目,现阶段AI编程实战连载中,案例素材获取过客AI官网https://guokeai.com.cn,欢迎下方关注!
