Merge branch 'main' of github.com:coderPerseus/blog

Author: coderPerseus

data/blog/post-7.mdx

@@ -18,11 +18,11 @@ tags: ["blog","教程"]
 
 ## 背景
 
-虽然我经常在CSDN、掘金和微信公众号等平台发布文章，其实这些平台编辑体验很好 ，而且自带流量，对乐意分享的人来说，是非常有好的，但我一直希望能够拥有一个完全属于自己的博客平台。之前我尝试过使用Hexo、Docusaurus 和基于其他项目（`https://giscafer.com/`） Next.js 博客方案，但都不能完全满足我的需求。
+虽然我经常在CSDN、掘金和微信公众号等平台发布文章，这些平台编辑体验也很好 ，还自带流量，对内容分享的人来说，是非常友好的，但我一直希望能够拥有一个完全属于自己的博客平台。之前我尝试过使用Hexo、Docusaurus 和基于其他项目（`https://giscafer.com/`） Next.js 博客方案，但都不能完全满足我的需求。
 
 受到许多技术大佬个人博客的启发，加上我最近在学习Next.js（冴羽的 Next.js 掘金小册），我决定从零开始打造一个属于自己的博客系统。
 
-这次开发之前，我是想要直接修改开源的` blog （https://cali.so/）` ，fork 这个项目来进行二创，我也是这样做的，我都改了很多东西了，但是一个非常难受的点，就是它使用的都是国外的服务，尤其是 sanity ，我本地连接会经常连不上，非常影响开发体验，而且它的源码，很多是我不需要的，综合考虑就下定决定要做一个自己的 博客
+这次开发之前，我是想要直接修改开源的 blog （`https://cali.so/` ），fork 这个项目来进行二创，我也是这样做的，我都改了很多东西了，但是一个非常难受的点，就是它使用的都是国外的服务，尤其是 sanity ，我本地连接会经常连不上，非常影响开发体验，而且它的源码，很多是我不需要的，综合考虑就下定决定要做一个自己的 博客
 
 ## 需求梳理
 
@@ -42,7 +42,7 @@ tags: ["blog","教程"]
   - [x] 提交规范：husky + lint-staged + @commitlint/cli + @commitlint/config-conventional
   - [x] 网站 SEO 元信息
   - [x] 主题切换
-  - [x] 使用 src作为源码目录， 项目目录更加简洁
+  - [x] 使用 src 作为源码目录， 让目录更加简洁直观
 
 - [x] 全局 导航栏 、底部 、布局组件、网站 SEO 信息、logo 、 404 页面开发
 
@@ -60,7 +60,7 @@ tags: ["blog","教程"]
   - [x] 优化移动端展示效果
   - [x] 推荐阅读（上一篇，下一篇）
   - [x] 博客内容添加
-  - [x] 为代码添加高亮
+  - [x] 优化代码展示效果
   - [x] loading 页面
 
 - [x] 添加 github actions ，实现 提交 issues ，转为帖子
@@ -71,33 +71,35 @@ tags: ["blog","教程"]
 
   >  以上代码 commit：https://github.com/coderPerseus/blog/commits/main/
 
-我们可以看一下 chrome 的 LIghthouse 分数
+我们可以看一下网站在 chrome 的 LIghthouse 分数
 
 ![image-20240808082948886](https://blog-1304565468.cos.ap-shanghai.myqcloud.com/work/image-20240808082948886.png)
 
 还是挺不错的，
 
 ## 技术栈
 
-我是先做了一个基础干净的 [[Next.js 启动项目](https://github.com/axin-s-Template/Nextjs-Boilerplate)](https://github.com/axin-s-Template/Nextjs-Boilerplate)，下面来看看我这个项目使用了哪些技术吧！
+我是先做了一个基础干净的 [Next.js 启动项目](https://github.com/axin-s-Template/Nextjs-Boilerplate)，然后基于启动项目来开发我的博客。下面来看看具体博客使用了哪些技术吧！
 
-- Next.js：react 框架
+- Next.js：React 框架
 - shadcn/ui ：UI 库
 - tailwindcss: CSS 框架，用于快速构建响应式设计网站（移动优先）
 - contentlayer: 内容层，用于获取和渲染内容。
 - next-themes: 主题切换库。
 - framer-motion：为网站添加动效
 - ESLint + Prettier ：代码格式化
-- husky: Git 钩子管理；lint-staged: 在提交前检查暂存文件；@commitlint/cli 和 @commitlint/config-conventional: 用于规范化提交信息
+- husky: Git 钩子管理；
+- lint-staged: 在提交前检查暂存文件；
+- @commitlint/cli 和 @commitlint/config-conventional: 用于规范化提交信息
 - rss：实现 RSS 订阅能力
 - github-api + fs-extra ：同步 github issues 内容到项目作为帖子
 - gray-matter + reading-time + rehype-autolink-headings + rehype-prism-plus + rehype-slug + remark-gfm：优化博客渲染
 
-可以看到使用的都是非常成熟，社区活跃的技术和框架，让我们项目即使遇到问题也能很快解决
+可以看到使用的都是非常成熟，社区活跃的技术和框架，我们项目即使遇到问题也能很快解决
 
 ## 项目简介
 
-由于没有任何调用接口的需求，我目前就把项目做成了[[静态导出](https://nextjs.org/docs/app/building-your-application/deploying/static-exports)](https://nextjs.org/docs/app/building-your-application/deploying/static-exports) 的，也就是说我们其实构建后的是一个静态网站。然后我目前是在 vercel 部署我的 blog，它有很多好处：
+由于没有任何调用接口的需求，我目前就把项目做成了[静态导出](https://nextjs.org/docs/app/building-your-application/deploying/static-exports)的，也就是说我们其实构建生成的是一个静态网站。然后我目前是在 vercel 部署我的 blog，它有很多好处：
 
 1. Vercel 提供了与 GitHub 的无缝集成，只需将项目链接到 Vercel，每次推送到 GitHub 仓库时，Vercel 都会自动构建和部署最新的代码。自动化流程大大简化了部署过程，确保每次提交的代码都能自动构建发布
 2. Vercel 使用全球内容分发网络（CDN）来加速静态资源的加载。无论用户身处何地，都可以快速访问网站内容，提升用户体验和网站性能
@@ -107,7 +109,7 @@ tags: ["blog","教程"]
 
 如果你希望使用这个项目作为自己的 blog，非常简单，只需要三步，
 
-### fork 项目 + 修改网站 SEO 信息
+### fork 项目 + 修改
 
 1. 首先 fork 项目，然后去 `src/config/site.ts `  这里放着网站的所有元信息，修改对应的内容为自己的就好，
 2. 然后去创建 .env 复制 .env.example 的代码，把对应的数据改为自己的。
@@ -121,7 +123,7 @@ tags: ["blog","教程"]
 
 ![image-20240808090833701](https://blog-1304565468.cos.ap-shanghai.myqcloud.com/work/image-20240808090833701.png)
 
-它给我们免费的有域名，我们可以点击查看我们的在线链接，这时候就可以把我们的 blog 分享出去了，我们如果主要是国内访问，我们会发现国内访问很慢，我推荐大家买一个国内的域名，在 settings 下的 domains 中进行绑定，然后我们使用绑定的国内域名访问，就会很快啦！
+vercel 会提供三个免费域名给我们，我们可以访问链接查看我们部署在 vercel的 blog，这时候就可以把我们的 blog 分享出去，但我们如果主要是国内访问，我们会发现国内访问很慢，我推荐大家买一个国内的域名，在 settings 下的 domains 中进行绑定，然后我们使用绑定的国内域名访问，就会很快啦！
 
 ## TODO
 
@@ -137,7 +139,7 @@ tags: ["blog","教程"]
 
 ## 感谢
 
-通过这个项目，我不仅实现了自己的博客系统，还深入学习了 Next.js、GitHub Actions 和 Vercel 部署等技术。希望这篇文章能够帮助到想要搭建个人博客的朋友们。在我开发这个 blog 的时候，我参考了很多我觉得不错的 blog。下面是我参考的和看过源码的 blog
+通过这个项目，我不仅实现了自己的博客系统，还深入学习了 Next.js、GitHub Actions 和 Vercel 部署等技术。希望这篇文章能够帮助到想要搭建个人博客的朋友们。在我开发这个 blog 的时候，我参考了很多我觉得不错的 blog。下面是我参考的和看过源码的 blog，感谢它们的开源
 
 - 在设计和 UI 上，很多都是参考了：`https://cali.so/` 。这是一个开源的 blog（我的也开源啦）
 - https://www.giscafer.com/