用 Gemini 一小时搭建免费个人网站

从今年上半年开始，我就成了Gemini Pro 的订阅用户，这款产品已经超越其他大模型，成了我心中当今最好的AI，尤其是它的中文能力出乎意料的强大。即便我是ChatGPT最早的一批用户，现在也被我放在角落吃灰了。

Gemini 3 Pro 发布后，网上的震惊声一片，标题党满天飞，似乎跟以往没有什么差别。不过我还是简单尝试了一下，首先是做了一个网页版模拟实体时钟，这是考验大模型能力的常用技俩，我提出需求后，Gemini 3 一次成功，而且成品非常惊艳。然后我又让它设计了几个小游戏，也都是一次成功，能力完全超过了其他大模型。

今天中午休息的时候，我又突然产生了搭建个人网站的想法。很多年前就想用WordPress搭建个人博客，但是一直没有动手，既然现在有了大模型，应该会简单很多。在搭建网站之前，我对这项工作没有任何概念，完全没有头绪。

最开始，我给Gemini 输入指令： “给我生成一个极简风的个人网页，主要用于发布个人的文章……支持插入图片，有留言功能……需要隐形后台。”Gemini 给出了一个基于 React (单文件架构) + Firebase (云端后端) 的方案。然后直接输出了完整的代码。按照它的指导，我复制代码后，在本地保存为html格式文件。

配置后端是比较烧脑的，不过Gemini 给出了完整的操作流程，我只需要按照它的操作指南去 Firebase 控制台申请一个免费账号，按步骤开启数据库和身份验证，数据库安全规则都是由Gemini撰写。

完成前面的步骤，将代码修改后的html文件拖到 Netlify（一个免费的静态网站托管平台），个人就这样上线了，快得有点超乎我的想象。网站上线跑通后，还是会有一些小bug，例如留言经后台审核后没法正常显示，文章发布后没法重新编辑，这些功能都是再和Gemini的对话中一步步解决掉的。

到了这一步，其实已经算完工了，不过这个网站目前还只拥有一个随机生成的域名，比较难看。提出需求后，Gemini又让我去 Namecheap 上花21块钱买了个性化域名 chrisreading.blog，在 Namecheap 后台设置 DNS 解析指向 Netlify，在 Firebase 后台添加白名单，允许新域名访问数据库。

搞定上面，在浏览器输入 chrisreading.blog，就可以指向我这片刚上线的自留地了。

其实，Gemini 3 的UI设计能力也是超强的，我又让Gemini基于 chrisreading.blog 和我的网站名称设计了一个放在微信公众号文章里的卡片：“这是我的个人网站主页链接chrisreading.blog，请基于此帮我设计一个卡片，用于微信公众号文章底部。”经过几轮调整，就出现了一张与网站风格相符的卡片。

最后，我让Gemini给了一个此次网站搭建的技术栈总结：

*前端：HTML5 + Tailwind CSS + React (CDN引入) *后端/数据库：Google Firebase (Spark Plan 免费版) *托管：Netlify (Drop 免费版) *域名：Namecheap *总耗时：约 1 小时

总体就这么简单，有想法的不放自己试着练练手。