JiaXin‘s Blog

Back

关于我的博客

前言#

随着时间过去,接触的东西越来越多,之前做过的技术和有的想法慢慢的陌生,每次回开始都要花时间在寻找之前做过的回忆,我有时候会用我手机的备忘录进行记录,但内容量相当有限。去年10月份刷到一个博主介绍自己静态博客的视频,能在互联网上面有自己的小空间,当然也可以分享自己的生活与感受,并且可以很方便记录与回看,在寒假的时候我就有想去弄一下,可是放假嘛,都想玩,不想去搞,但也是逼着自己了解了一些内容,把我的博客网站有了个大致规划了,于是开学后我就开始慢慢做,在课余时间就弄一下,搭建我的静态网站,打算写博客记录下来有意义的内容,。由于不想在这个方面花太多时间在前端和配置上面,更想专注于内容,本人也还没到手搓Vue的能力,但得益于网上有很多成熟的博客框架,可以非常方便的搭建和部署,感谢大佬分享。 做静态网站也是有几个麻烦,一是你需要一个域名(有特点需求还需要备案流程),还有公网IP,还有一个尽量24小时都开着的稳定性能足够的电脑等等麻烦的事情。 于是我在网上找了一些资料,看了很多大佬的博客,比如[《如何用Hexo搭建博客》]等等。我了解到可以部署在github或者其他平台上,这样就解决了域名和服务器费用,真是令人兴奋,现在就差自己把框架搭好了。

我需要什么?#

我需要的是一个相当于备忘录pro或者日记,我随时可以查看,并且其他人也能看,而且我希望我不会因此花费太多钱和时间,重在内容。但是我又想可以做点美观个性东西,所以我的博客风格是简洁的,但是又有一点温柔,有些许多彩的小东西点缀,看着舒服点。

技术路线#

根据前言,我为什么选择了Astro和静态网站了呢?我找了一些博客框架,分析他们之间都有什么优缺点,什么最适合我。下面是询问ai的介绍。

类型代表框架渲染方式速度安全性部署成本动态功能适合人群
静态站点生成器 SSGHugo、Hexo、Astro、Jekyll、VuePress预编译生成纯 HTML极快极高(无数据库)极低(可免费部署)弱,需借助第三方程序员常用、追求稳定简洁
动态 CMSWordPress、Typecho、Ghost数据库 + 服务端渲染一般一般(需维护安全)较高(需服务器/域名)强,原生支持评论、用户非技术、需要丰富插件
全栈现代框架Next.js、Nuxt.js、SvelteKit混合渲染(SSR/SSG/CSR)极强,可做完整应用前端开发高度自定义

决策导向#

框架开发语言构建速度上手难度主题生态中文生态扩展性部署难度典型特点
HugoGo极快中等丰富一般极低编译快、多语言、文档友好
HexoNode.js较快极低极丰富顶级极低中文教程最多、新手友好
AstroTypeScript/JS中高中等较好极高现代架构、支持多框架零 JS shipped
JekyllRuby较慢丰富一般GitHubPages 支持、历史久
VuePressNode.js + Vue一般技术文档为主、Vue 生态
VitePressNode.js + Vue较少Vue 官方文档工具、简洁现代

部署与成本#

项目现实情况
服务器费用GitHub Pages / Cloudflare Pages / Vercel 基本为 0
域名费用默认可用 username.github.io(免费);自定义域名通常需要付费
运维成本静态站点基本为 0 运维

虽然Astro自由度高,需要自己决策可能是一个坑,但对我反而或许是一个优势了,我可以挑选我喜欢的组件,至于域名和服务器问题,一开始想的是 Cloudflare,但是既然项目要上传github,那么github pages反而相当的方便,因为我设置完后,每次只要push推送上去就能更新了,相当的方便。

开发环境#

我选用的是用 VS Code 作为我的文本编辑器进行开发,并且已经安装了 Astro 的扩展。推荐安装的 VS Code 扩展:

  • Astro - 官方扩展,提供语法高亮和代码补全
  • Markdown All in One - Markdown 编辑增强
  • Prettier - 代码格式化
  • GitLens - Git 功能增强

关于 Github Pages#

首先需要提及的是 Github Pages,简单来说,这是一种 Github 提供的静态网站托管服务,至于什么是静态网站,一种简易的理解是,至少上面不会有一个数据库,网站也不存在任何对数据的读写操作,一切的风格化变化只来自于网站提前搭建好的框架。

在提供静态网页这件事情上,Github 可以说是十分慷慨的,每一个用户可以创建近乎无限的仓库,而每一个仓库都可以对应一个 Github Pages。

关于 Github Actions#

Github Actions 是一个持续集成和持续部署(CI/CD)平台,它允许用户在 Github 上创建自动化流程,用于构建、测试和部署项目,其支持使用 YAML 文件定义工作流程,并且可以与 Github 上的其他服务进行交互,换句话来说,Github Actions 支持我们在 Github 这个理论来说静态的平台上面运行一个脚本。

通过上述的内容,细心的读者应当不难发现,Pages 提供静态服务,而 Actions 则可以运行脚本,二者的互补,因此这一流程也也就不难想象了,创建一个 index.html,在其中写入一些内容,然后将这个文件部署到 Github Pages 中,便可以得到一个网站。

Github Pages 与 Github Actions 可以帮助开发者构建个人网站,更重要的是,完全免费,真好。

关于Obsidian#

Obsidian 是一款本地笔记软件,全部内容可以均保存在本地,保证安全性,也可以通过 Github 等方式进行备份与同步,另外Obsidian 使用 Markdown 语言进行笔记的撰写,上手难度较低。

因为文章是用Markdown 编辑来写的,Obsidian 不同于专业的 Markdown 编辑器,如 Typora 等软件的最大特点便是其使用的双向链接功能,可以非常方便管理文章。 Obsidian 的安装与下载十分简单,你可以在 Obsidian 的官网 ↗︎ 进行下载,之后按照提示进行安装即可。里面也可以安装一些插件。

这样框架搭好了,网站部署好,内容用Obsidian来管理,就只剩下创作内容了。

关于我的感受#

前面几天框架都弄好了,当时非常想写一篇分享我当时的感受,因为一些事情耽搁了,没有正常更新第一篇文章,现在没当时的感觉了。种一棵树最好的时间是十年前,其次是现在。总体来说,其实也不错,当一个起点吧,看看一年,两个或者几年都回看这些会不会有些伤感呢,哈哈哈。现在刚开始,更新频率可能会多些,后面尽量保持每月至少1-2个吧,写写月记感觉也不错。

在我看来,记笔记是一种正反馈

记笔记是我推荐的一种极佳的学习方法,我不了解读者在高中期间对于记笔记的看法,例如是否会在复习的时候回顾这些笔记,或者认为记笔记是否是一种累赘,但是在高中的生活中,我从来没有记过一行笔记,主要还是懒,嘿嘿。

尽管如此,笔者依然推荐在大学期间使用记笔记作为最核心的学习方法。大学的学习以自学为主,这一点是不可置否的,而在自学的过程中,能否让自己获得持续学习的动力,这成为了自学过程中最关键的一环。

有时候学习的难点并不在于如何高效的学习,反而在于更为基础的一点:如何坚持学下去。

假如并非十分自律的人,在学习的过程中,毫无疑问,正反馈是十分重要的。适当的正反馈不但可以让读者有学习的动力,也可以让读者保持学习的节奏。

令人遗憾的是,在大学中,正反馈往往不是如此的常见。在不经常存在考试,甚至课程质量良莠不齐的大学当下,在学习中获得的反馈是十分难得的。更加经常的情况是,你有数不尽的内容可以学习,但是每每学习结束之后你并不知道自己的学习是否为自己带来了改变,这与高中阶段学习少量的内容,但是在重复性的刷题以验证自己的学习成果不同,而一味地向前冲有时会带来迷茫,从而失去兴趣。

关于笔记的用处,不排除一些人通过记笔记起到加深记忆,以及获得一手的复习资料的作用,但是在此之外,记笔记也是一种记录,如日记一般,可以告诉我们:“我今天学习了很多内容”。

总之,在我看来,记笔记是十分有必要的,之前我也有在cdsn上面写了一些踩坑的分享,或者在笔记软件什么写日记心得什么的,现在可以在这里写,熟人看到会有点尴尬哈哈哈,习惯就好了,时间有限今天就这么多吧,写的也不是很好,笔者写作水平有限,有什么问题也可以留言或者私信我。

小结#

以上便是本次介绍的全部内容了,到这一步你们应该了解了大致的流程: 本地写作 -> git push -> GitHub 自动构建并发布。

或许改天会开一个合集,讲一下踩过的坑。 后面就创作一些内容,然后慢慢把样式打磨成喜欢的样子就好。
技术是骨架,内容才是灵魂。先让它跑起来,再让它变好看。

现在使用 AI Code 来协助开发,工作效率大大提升。博客网站的核心目标是实现正常的发布和阅读功能,而增加其他花样功能则是个人情趣的体现 😄

希望我的经验对你有所帮助!


关于我的博客
https://jiaxin404.top/tech/about-my-blog/
Author 嘉心糖
Published at 2026年4月7日
Comment seems to stuck. Try to refresh?✨