Claude Code 做个人博客 — 一个广告人 全程让 AI 写代码
我的数字分身用量暴涨扛不住,要把它下线。朋友又一直反馈视频太长,想要文字版。两件事凑在一起 — 干脆做个博客。
- 做这个事之前,先把相关概念问 AI 学清楚(域名/iframe/服务器/备案)
- 已经在腾讯云买了服务器,API key 给 Claude Code,它直接操作服务器
- 视觉走我自己定的 PPVM skill 浅色版
- 强制微信扫码登录才能看正文,保留企业微信二维码
- 逐字稿原文 + 精简版重组,两个版本都要
- 微信回调域名以前踩过坑,经验在 memory 里它自己能查到
- 整个过程一行代码都没看
域名就用我官网的 XNTJ.tv,老的 Live2D 数字分身下线。
最近我发现很多朋友都已经知道,我的视频号的昵称,就是我的官网。
我那个 Live2D 数字分身最近用量暴涨,扛不住了,准备下线。正好很多朋友都在说我每天的视频内容太长,有没有可能有文字的版本。
两件事凑一起 — 今天就一步一步把一个博客的官网做出来,把之前视频的逐字稿和教程都放上去。
一、给数字分身提需求 — 先问 AI 该怎么做
先让我那个 Live2D 数字分身给我两个实现路径:
- Notion + Super — 需求很清晰,内容展示型,视频加教程文字。
- Ghost — 不用碰任何代码,专注写内容;比 WordPress 干净很多,自带会员系统,以后想做付费内容直接有。
分身的判断是:现在是起量阶段,别在工具上耗太多时间。先 Notion + Super,最快一天就能上线;内容积累起来之后,再考虑迁移到 Ghost 或者自建。
它还补了一句结构判断 — 流量从短视频来,沉淀在博客里。视频号是流量入口,博客是根据地。
二、学习 AI 最有意思的点 — 不懂的词,就追问
我没听过这些选项里的很多词,比如 iframe、WordPress、备案。对一个开发新手来讲,可能连”服务器”、“域名”都没听过。
那就继续追问:「域名是什么?我怎么样获得自己的一个域名?」「什么是 IP?什么是备案?」
这些基础概念的学习留给你自己去问 AI。
三、打开 Claude Code 提需求
那我们今天就打开 Claude Code,把这个网站做起来。
在做这步之前,我其实已经在腾讯云上买了自己服务器,同时把腾讯云的 API key 给到了 Claude Code。也就是说,现在的 Claude Code 可以直接操作我的服务器,可以直接在我本地写代码并部署到服务器上。
提需求:
- 把每一篇视频的思考或教程放到博客上
- 用户需要通过微信扫码登录,让我知道谁来看过
- UI 简洁且美观,不要复杂功能
- 部署到我的上海服务器
- 域名就用 XNTJ.tv(官网原来的 Live2D 数字分身可以下线了,确实算力用量超出预算)
- 先做最基础的整个策划,策划出来之后再沟通具体实施方案
它返回了完整方案:微信登录、内容架构、UI 设计原则、技术栈推荐、域名部署切换 — 思考很完整。
我额外限定了视觉走我自有的 PPVM skill 浅色版(这是我自己定的一套 UI 设计审美的标准化系统,有浅色和深色两套,本次用浅色)。
四、内容细节 — 两个版本都要
它问到了一些问题:长视频的逐字稿怎么处理?
我的回答:逐字稿的原文需要保留,同时制作一个精简版。精简版不是摘要,是把里面的核心内容提炼出来做一个重组的版本。两个版本都要。
视频先不嵌入,后期可能增加视频号或其他平台的链接。
登录强度:强制。必须登录才能看到正文。完全只读不带互动,但保留我的企业微信二维码方便交流。
五、微信回调 — 经验在 memory 里它自己能查到
微信扫码登录有个老坑:回调域名报错。我之前第一次做的时候踩过,把经验沉淀到了 memory 里。
这次 Claude Code 直接从我的项目记忆里找到了之前的经验。大家自己去操作的时候不要担心自己没这么多项目经验 — 这些经验都是踩坑一个一个过来的。
万一它也搞不定怎么办?让它去调研微信在哪一个网页里详细说明了回调的使用说明,把那个网页找到给 Claude Code,它自己读那个网页就能解决。
那我其实在整个过程当中是一行代码没有看的,好吗?一行代码都没有看。
六、网站打开实测
它做完了。打开网站看一下,它按照我的习惯自作主张做了一些事情:
- 首页可以加我的微信
- 每一期的封面、标题、简介、日期都有
- 点进去看到精简版(概数)
- 登录之后可以阅读全文
- 登录状态显示在右上角
- 全文还可以一键复制全部文字 → 粘贴到智能体里去学习
- 也能看到这一期的逐字稿
扫码登录走一遍 — 全跑通。完全可用的个人博客。
今天就到这里。21 号我会去深圳参加非凡大赏的活动,欢迎到现场跟我聊聊 AI。
来源:EP0012_audio.mp3 · ASR 模型 gemini-2.5-pro · 10 分钟原片完整文字版
[00:00] 最近我发现很多朋友都已知道我的视频号的昵称,就是我的官网了。我的这个数字分身最近的用量暴涨,就很多人都来问各种各样的问题。那我已经扛不住了,我要把这个数字分身下线了。那我今天给大家讲的这个内容呢是如何去做一个自己的官网吧。正好很多朋友都在说我每天的视频内容太长了,对吧,有没有可能有文字的版本。那我今天就带着大家一步一步的把一个博客的官网做出来,并且把我之前视频的这些逐字稿或者是教程放到这个官网上。
[00:30] 那我也来可以来问一下我的这个分身:我如何去做一个自己的博客,把我的视频内容的教程放在互联网上给大家展示。
[00:40] 我的数字分身还挺有意思的,它是用 Live2D 的一个纸娃娃。给你两个实现路径:第一个,Notion 加 Super。这个需求很清晰,内容展示型,视频加教程文字,最适合你的是两个方向。第二个,直接用 Ghost。好处是你不用碰任何代码,专注写内容就行。你在 Notion 里写教程,Super 帮你把它变成一个真正的网站。
[00:58] 你看学习 AI,界面美观,部署在自己服务器上,一个月几十块。视频的话嵌入 YouTube 或者 B 站的 iframe 就行。这个是专门给内容创作者做的博客平台,比 WordPress 干净很多。自带会员系统,以后想做付费内容直接有。我的判断,你现在是起量阶段,别在工具上耗太多时间。先用 Notion 加 Super,最快一天就能上线。内容积累起来之后,再考虑迁移到 Ghost 或者自建。你现在有多少存量内容了?流量从短视频来,沉淀在博客里。这个结构是对的。视频内容这个是,博客是你的根据地,视频号和其他平台是流量入口,对吧?
[01:26] 学习 AI 比较有意思的点就在这。当我们有一个需求的时候,我们把这个问题提给 AI,它就会在回答当中出现很多可能我们从来没有听过的词。比如说对一个开发的新手来讲的话,他可能就没有听说过服务器、域名,以及这些像 iframe 还有这个 WordPress 这样的一些博客平台的名词。那就其实可以继续追问他,比如说你问他域名是什么,对吧,这个概念是什么,我怎么样获得自己的一个域名。这些基础概念的学习就留给大家自己去问 AI 了。
[01:53] 那我们今天就打开 Claude Code,把我们的这个网站做起来。那在做这步之前呢,我其实已经在腾讯云上买了自己服务器,同时把腾讯云的 API key 给到了 Claude Code。也就是说我现在的 Claude Code 可以直接的去操作我的服务器,以及可以直接在我本地去写代码,并且部署到我的服务器上。那我们来给他提需求。
[02:16] 最近我的视频号的内容还是蛮多人关注的,那大家都反馈说我的视频内容太长了,可能十几分钟的干货内容没有时间去看完。有没有可能去做一个博客,把我每一篇视频内容的思考或者是教程放在这个博客上。那我的想法是说这些用户需要通过微信登录的方式进行登录,好让我知道谁来看过。
[02:38] 那这个博客的界面 UI 的设计需要是一个简洁且美观的方式。不要有复杂的功能,只做到一个最基础的呈现就好了。那它可以部署在我的上海服务器上。域名就使用我的官网的域名,XNTJ.tv。那就我这个域名上面原来我的数字分身就可以下线了,因为确实算力的用量有点超出预算。那我们先做最基础的整个的一个策划好吗,策划出来之后我们沟通具体的实施方案。
[03:10] 其实一点都不难啊。就是首先做这个事之前,要把自己相关的概念通过提问的方式去问去学习。当我知道什么是域名什么是 IP,什么是备案,什么是服务器,之后呢就可以去把这个需求很清晰地告诉给那个 Claude Code。那在它去思考这个阶段,我也可以给大家做一个建议。
[03:33] 就是我最近爱不释手的这个小平板啊,这不是广告啊就没拿一分广告费,太好用了。这个是华为鸿蒙的 MatePad Mini,它是一个 8.8 寸的一个小平板啊,非常的轻,只有 200 克的一个重量。大家可以看到我的背后我贴了一个隐私片,它就可以贴在各种各样的支架上。然后我还贴了一个小的这个笔记本的支脚。这整个的重量跟一个手机的重量是几乎是一致的。
[03:59] 然后我用它做什么呢,我用它远程操作我的电脑。你看这个小支架,一按打开之后就可以横着支竖着支都是可以的。然后这个平板简直绝了,窄边框对吧,然后响应非常地快。那不论大家可以看到我这个上面就是显示了我当前电脑的屏幕,我的随着我的手的这个滑动,这个鼠标是一点延迟都没有的。
[04:22] 这个可以用向日葵的远程遥控的方案,或者我是用的这个 Moonlight 的这个方案,延迟更低,完全可以。不论是躺在床上也好或者是我出门在外面,我把它吸在车上也好,我都可以随时跟我的 Claude Code 进行沟通。
[04:41] 那同样也可以用鸿蒙的这个小艺的输入法。我觉得是比我的输入法做得要好了,可惜它只是有鸿蒙的版本。比如说我现在遥控它,我想想说什么呢:这个网站要采用我的视觉风格设计的美学,然后用浅色版的方案吧。你看,就直接发出去了,直接就发出去了。真的是很好用。
[05:10] 我不是华为的粉丝啊,但是我真的觉得华为的平板做的非常的棒。那我们看啊,它已经返回来了。好,其实我们看到它已经做出了一个完整的一个方案啊。包括这个微信登录,包括内容的构架,UI 设计的原则,技术栈的推荐。那什么是技术栈,大家也可以去问一下 AI 啊。域名的部署也切换,思考的非常的完整啊。
[05:36] 那我刚才在我的 Pad 上面给它提出了一个要求,说需要使用我的视觉风格的设计美学,然后用浅色版的方案。就是我有一个 skill 是关于 UI 设计的审美的整个系统的一个标准化的,那这个就叫做 PPVM。这个方案里面就浅色和深色版的方案,那我给它限定了是浅色版的方案,它就会按照那样的标准去进行设计。
[05:55] 那我觉得它这套方案几乎是没有什么问题的,思路还是比较完整的。我们就让它好的,就按照你的整套的计划进行执行就好。那我们再完成这个网站之后,你自己去做测试。测试没问题,我再线上进行测试。好,那我们就等着它就好了。就是这么简单。
[06:18] 他问到了一些问题,长视频的逐字稿。我觉得这样吧,就是逐字稿的原文需要保留,然后需要去制作一个精简版的,这个重写,就是把这里面的核心内容提炼出来,做一个重组的版本。两个版本都要。
[06:38] 然后它会去想到说,需不需要在博客里嵌入视频。我们就不在这个里面嵌入视频了,后期可能增加视频号或者是其他视频平台的链接。
[06:51] 登录强度,强制。必须登录才可以看到正文。完全只读不带互动,但是可以保留我的企业微信的二维码,这样方便大家与我交流。好我们看它怎么做设计。
[07:09] 今天不好意思有点咳嗽,北京真的是昨天下了很大的雨,然后我事有一点过敏性的气道敏感,这是第一年出现这种问题。
[07:21] 我们看到它已经开发完了,它需要我去做一些配置和测试。那我们直接就让它继续就好了。我的微信的回调域名,已经绑定在主域名上了。那主域名绑定之后呢,子域名也都是可以用的。这是微信的一个回调的一个方式,请你去确认一下。
[07:40] 那我们直接把之前所有,真人长视频的文章在博客上进行上架,全部都完成了之后,直接下架 Live2D 的数字分身。那用我的这个主域名,作为博客的域名就可以了。全部完成之后,我再来进行测试。一定要确保微信登录,它的回调是正常的。那这个问题之前我们已经去处理过了。相关的经验可以去记忆里面去查询。
[08:05] 好,那我们就已经让它继续了啊。那大家可以看到说整个过程当中,它非常可以去找到,我之前的项目的这些经验啊。大家自己去操作的时候也不要担心啊,就不用担心是说没有这么多项目经验。那这些项目的经验其实都是踩坑一个一个过来的。
[08:21] 就比如说我之前第一次做微信回调的时候,他就会提示我说这个域名有问题啊。那我们这时候怎么办呢?我们只需要让它去调研一下微信在哪一个网页里面去详细说明了这个回调的使用说明。只需要把这个网页找到,给到 Claude Code,它就可以自己去阅读那个网页,并且去解决这个问题。那我其实在整个过程当中是一行代码没有看的,好吗?一行代码都没有看。那我们继续等它把这个制作完成。
[08:46] 好,我们看一下啊,它做完了。打开这个网站,它应该是按照我的习惯自作主张做了一些事情啊。首先可以加我的写微信,然后可以看到每一期的封面、标题和一个简介。它哪一期、每一期的这个内容是哪天发的都有。那点进去之后,可以看到一个概数。那登录之后可以去阅读全文。那我们扫码登录一下看看啊,我们登录一下。
[09:18] 可以看到登录之后呢,它显示了一个概数的一个精简版。这期的内容,然后还可以去复制这一期的全部的文字,直接粘贴到智能体里面去学习。然后也可以看到这一期的逐字稿。逐字稿,那已经是一个登录之后还在右上角,显示了这个登录的状态啊。已经是完全可用的,一个个人博客的一个状态了。
[09:42] 好,那今天的内容其实就到这里了哈。那既然大家看到了最后,那我做一个小小的一个广告。那有的朋友们会最近在私信留言说能不能到线下来找我交流。那过两天的时候,21 号的时候呢,我会去深圳参加非凡大赏的活动。欢迎大家到现场跟我去聊一聊 AI 的事情。再见拜拜。