这是一篇完整的从零开始搭建，到最终自己的网站上线的全部过程。不需要写任何什么代码，后期只需要写markdown文档，提交文档便会自动化触发部署网站。
站在2026年的视角，AI时代，我们还有必要创建我们的个人门户网站吗？我们还有必要自己写点东西留存在互联网上吗？未来互联网会死吗？
况且现在不论什么问题，我都愿意先问问AI了，看看它能给我什么答案? 我相信已经有很多很多人跟我一样了。那么你有没有想过一个问题: AI给我们的这些高质量答案，又是从哪里来的呢?
答案其实就是: 来自AI“能看见”的地方。
同时最近的315GEO数据投毒事件，某网上爆火，关注AI几乎所有人都能看到这个话题的内容。那么这里我顺便简单说一下GEO。
GEO（Generative Engine Optimization，也叫生成式引擎优化）是一种针对AI搜索引擎内容的优化策略。核心目标不是让你的网页排名靠前，而是让AI在回答用户问题时，直接引用你的内容、提及你的品牌。
那我们应该怎么做呢？我可以在微信公众号、短视频、小红书、抖音、头条、知乎等等平台来构建自己的内容和品牌。而且完全可以做到全平台批量构建。但是这些平台都有一个重大的弊端，我的内容或者我的账号，会在某个特定的早晨，因为一些各种各样的问题而意外面临某篇文章或视频的下架，甚至某个账号的永久封禁，从而导致我很多的内容资产消失。
所以当下我觉得AI时代，我的个人网站又必须排上日程了。它不再仅仅是给我记录笔记也好，构建内容和品牌也罢，学习当前最流行的AI前线技术也行。而更重要的一点，就是上面提及的让AI能更好的发现我。
我们的网站可能被某某云下架，但是我们的内容在本地，在云端、在github，通过简单整改后仍然可以再次上线，甚至部署在别人无法触手可及的地方，只要不违背大的原因，他甚至可以永远存在。
而针对我们的网站，我们可以给它架设robots.txt确保AI能爬取到我们的内容，也给网站部署上llms.txt，告诉AI我是谁，我的网站干什么的，有什么内容，内容列表又是哪些。
有关SEO和GEO的更多内容可以参考这篇文章
https://www.1ai.net/51310.html
自媒体，现在流行的OPC，甚至越来越多的人，可能都在构建自己的个人独立网站，以前更多的程序员们的玩具。
说了那么多没用的，下面开始建造属于自己的避风港。
1、网站整体搭建流程
我先说一下我这套方案整体的一个工作流程是怎么样的
- 我在本地使用 Obsidian客户端 管理我的个人知识库，作为我的第二大脑
- 目前所有知识库的文章都用 Markdown 编写
- Markdown 的目录结构按 VitePress 规范来组织，其实也就是文件夹而已
- 平常使用 Claude Code 对内容做整理加工
- Claude Code 的处理过程可以拆给多个 Skills / SubAgent/ Agent Teams
- 加工好的 Markdown 文件保存本地仓库，图床下面我会提供最简方案
- 把改动提交到 GitHub
- 提交完毕自动触发 Cloudflare 的 Git 集成流程，Cloudflare Pages 自动构建并发布
- 绑定域名后，页面即可对外访问
下面正式开始，注意从零搭建到最后可以一分钱都不花的，域名可买可不买
2、搭建本地环境
前置条件其实就是安装nodejs、git、Obdisian客户端，如果没有的话可以让AI帮忙安装一下也可以自己手动进行下载，如果你本地没有AI工具，可以先下载使用Codex或者OpenCode，这两个客户端工具不需要其他依赖安装就可以使用，还是非常方便的，然后再来安装其他搭建所需的工具就可以了。版本最好都安装最新的。
“帮我看看nodejs,git,obdisia客户端是否安装了，如果没安装帮我安装一下”
箭头所示中间过程我已经省略了，这里默认工具都已经安装好了，如果你没有安装，可以参考下面的链接根据需要进行逐一安装。
可以先了解一下Git有什么作用
Obsidian安装
给Obsidian装上Claude Code插件
直接使用本地命令行Claude Code， 我觉得才是最有价值的工具，目前来说没有之一。
当然了Claude Code配置确实有门槛，Codex或者Google Antigravity 以及OpenCode也是不错的选择。
这个准备的小章节还有一个重头戏就是markdown里的图应该让他们睡在哪里，这里推荐一种方案：Cloudflare R2 + PicList谁用谁觉得好用，还免费。
初步准备完毕了，开始创建项目吧。
3、安装vitepress准备项目代码
搭建项目前，先来简单看看VitePress用来干什么的。
它主要就是用来把 Markdown 文档变成一个可访问的网站的。所以我们完全可以不关注VitePress，我们只需要关注目录和Markdown文档就可以了，就跟直接在Obsidian 客户端下面打开一个文件夹一样，so easy!
同时他也有很方便的拓展性，这个简单提一嘴，后期有需要专门写一篇。
当然了其实还有很多其他类似的框架，我就不列举了，有兴趣可以多问问AI。
“在当前文件夹下给我使用vitepress给我创建一个代码仓库”
依赖安装完毕，可以叫他本地直接跑项目看效果了。
“你直接给我启动运行本项目”
看到访问地址基本就OK了，浏览器输入访问看效果。
4、将代码上传github
我相信看到这里的人绝大部分人应该都知道它是全球最大的开源项目大本营。现在有太多跟AI相干的开源项目，都放在了这个github网站上。它不仅仅能放项目代码，而且文档、少量图片、教程等都可以，付费用户当然功能更多，咱就不展开了，知道能放代码，知道能跟Git结合使用管理代码的版本历史，暂时就够了。
“将项目上传到github”
上面图里告诉我还差github项目仓库信息，那么现在就需要到github官网上创建一个项目。
https://github.com/new浏览器打开这个链接，直接创建项目
上面链接要先进行登录这里就不进行重点讲解了，主要就是箭头两个重点
- 仓库名称，尽量用英文字母
- choose visibility，我选择的public，意思就是开源，所有人都可以看到，另外一个private就是私有的，只有自己能看到。
- 剩下的你可以直接默认，也可以参考我的进行选择，然后点击右下角 Create repository。
- 仓库创建完毕就会直接跳转到当前仓库。
如上图箭头所示 复制SSH链接， 继续跟AI聊天。
“git@github.com :aehyok/vitepress-obsidian.git 这是我新创建的仓库，创建类型为public，请将当前仓库代码上传github”
好了，我们已经将本地代码上传到Github上了。
5、cloudflare上部署我们的项目代码
cloudfare上功能实在太多，而在中文圈被誉为互联网的赛博菩萨大善人。提供了众多免费的功能。尤其是部署个小站点，完全免费。接下来跟着我操作一下。
https://cloudflare.com打开网站，如果没有账号就进行注册登录，登录之后右上角语言切换简体中文，设置完毕首页如下所示。
点击开始[构建]，进入页面会看到下面 [pages] 点击 [开始使用]
进入页面后点击 导入现有Git存储库 开始使用，如果没关联过需要登录github进行授权的
选择 Only select repositories-> Select repositories=-> 文本框输入 obsidian-> 选中代码仓库->点击绿色的 Save->稍等片刻会返回到cloudflare网站。也就是关闭弹窗。
回到cloudflare网站，选择好刚刚设置的仓库，点击右下角开始设置就可以了。
点击下一步
框架预设：选择VitePress
构建命令： npm vitepress build
构建输出目录：docs/.vitepress/dist
点击保存并部署后，即可看到一个cloudflare送给我们的默认域名。
好了，兄弟们，网站有了。直接进行点击，cloudflare给我们的免费域名
6、更新网站内容
直接用下面的提示词修改首页的title。
更新完毕后，直接提交代码
稍等片刻，或者你也可以在cloudflare中查看部署是否完毕
随后刷新浏览器查看我们部署的网页
左上角的标题更新成功了，以后相当于只更新markdown文档，然后提交代码网站就自动更新。真的太方便了。
7 、spaceship购买域名
此域名下注册登录后直接输入想要的域名
https://www.spaceship.com
8、绑定域名
先在cloudflare.com首页，点击左侧菜单[帐户主页]，然后右上[添加]=>再点击[连接域]，输入上面购买的域名，点击[继续].
选择完最左侧的Free计划即可看到域名解析了，然后你可以直接访问域名了
然后再回到spaceship 右上角点击切换中文。
会在右上角看到[库]->点击后再到[my account]->看到域名管理器->点击行记录右侧会弹出面板->再点击namespace+dns->在点击Change->Custom nameservers->输入上面cloudflare 下有两个dns 品牌服务器，等个十分钟上面DNS解析的类型A前面叹号可能就没了，说明配置成功了。
再根据下图操作
点击设置自定义域，输入我们申请的域名，点击继续，再点击激活域。
稍等片刻就可以针对我们上面部署的网站用自己的域名进行访问了。
最后
文章耗时两周，终于完工了，当然中间断断续续。将整个构建的过程进行了记录。
如果有兴趣的也可以轻轻松松的将它接入小龙虾。