Mirror新手入门10步从GitHub仓库到发布第一篇文章完整教程【免费下载链接】MirrorA blogging tool powered by GitHub API. Write your blog on GitHub issue.项目地址: https://gitcode.com/gh_mirrors/mirror9/MirrorMirror是一款基于GitHub API的博客工具核心玩法是用GitHub Issue写博客每一条Issue就是一篇文章Issue的评论区就是博客评论区完全不需要服务器和数据库。这份Mirror新手入门教程将用10个步骤带你从克隆GitHub仓库开始完成配置、本地预览、构建部署最终顺利发布第一篇文章让你的个人博客在几分钟内免费上线。为什么推荐用Mirror写博客在开始之前先花30秒了解它的独特优势✅零成本数据全部存在GitHub上不用买服务器、不用买域名✅零维护没有数据库和后台也就没有崩溃和备份的烦恼✅Markdown原生支持用你最熟悉的Markdown语法写作✅评论功能免费送Issue评论区天然就是博客评论区✅数据可迁移文章就是Issue随时可以导出带走它的原理其实很朴素Mirror通过GitHub GraphQL API拉取仓库里的Issue在浏览器端渲染成博客页面。相关请求逻辑都集中在src/api/目录下比如负责文章列表的issues.js和负责单篇文章的issue.js。第1步 注册GitHub账号用GitHub Issue写博客前提当然是有一个GitHub账号。如果你还没有先去官网免费注册一个整个过程不到2分钟。小提示账号名会出现在博客首页的作者卡片上建议注册时选一个和你博客定位相符的名字。第2步 获取GitHub Token3分钟准备Mirror需要读取你仓库中的Issue数据这要通过一个Access Token来授权。在GitHub的Settings → Developer settings → Personal access tokens页面创建一个新Token勾选public_repo权限即可如果博客仓库是私有的则需要repo权限。⚠️注意Token相当于你账号的钥匙务必妥善保管不要泄露给任何人。稍后我们会教你把Token加密后安全地放进配置里。第3步 创建博客仓库回到GitHub首页点击New repository新建一个仓库这就是你存放文章的博客仓库。仓库名建议简短好记比如my-blog创建时可以选择私有或公开对Mirror来说都能正常工作。第4步 获取Mirror源码克隆仓库并安装依赖在终端中执行以下命令把Mirror源码克隆到本地git clone https://gitcode.com/gh_mirrors/mirror9/Mirror进入项目目录后安装依赖npm install安装完成后整个项目就绪。你可以在package.json里看到项目提供的几个命令npm start用于本地预览npm run build用于构建部署npm run lint用于代码检查。第5步 填写核心配置Mirror最快配置方法Mirror的配置非常轻量全部集中在一个window.config对象里。项目自带一份模板文件index.sample.html把它复制一份改名为index.html然后修改里面的配置即可配置项含义示例值user你的GitHub用户名或组织名LoeiFyrepository存放文章的仓库名Recordumorganization是否使用组织账号true/falsefalsetitle博客标题会显示在页面顶部Mirrororder文章排序UPDATED_AT按更新时间、CREATED_AT按创建时间UPDATED_ATperpage首页每页显示的文章数量5ignores忽略不展示的Issue编号用逗号分隔17,13host你的博客域名用于Token加密mirror.am0200.comhash加密后的GitHub Token见第6步核心就三项user、repository和hash。前两项告诉Mirror去哪个仓库读文章第三项是访问凭证。第6步 生成加密Token安全填入hash字段直接把Token明文写进HTML有泄露风险所以Mirror提供了一套简单的加密方案实现在src/helper/secret.js中。方法并不复杂把Token中的数字替换为对应符号0→)、1→!、2→、3→#、4→$、5→%、6→^、7→、8→*、9→(把你的博客域名做base64编码把两者拼接加密后的Token 替换符号后的Token 域名base64举个例子Token为ghp_123替换后变成ghp_!#再拼接上域名的base64结果就是最终的hash值。本地预览时使用配置里的host进行加密部署上线后Mirror会自动用你的真实域名解密这也是host必须和部署域名保持一致的原因。第7步 本地预览npm start一键启动配置完成后在项目根目录运行npm start终端会启动一个本地开发服务器打开浏览器访问提示的地址你就能看到博客首页了。此时文章列表、文章详情页、评论加载等功能全部可用可以先确认数据是否正常显示再进入下一步部署。第8步 构建静态文件npm run build生成docs目录本地预览没问题后执行构建命令npm run build构建脚本定义在package.json中构建完成后会在项目根目录生成一个docs文件夹里面就是打包好的静态网站文件包括带hash的JS文件比如docs/index.xxxx.js这个文件夹就是可以直接部署的内容。第9步 部署上线把博客发布到GitHub PagesMirror构建产物是纯静态文件可以部署到任何静态托管平台。最省事的方式是GitHub Pages新建一个仓库或直接使用你的博客仓库把docs文件夹的内容推送上去在仓库的Settings → Pages中把发布目录设置为docs稍等片刻访问https://你的用户名.github.io/仓库名博客就上线了 到这里一个完全免费、无需服务器的个人博客就诞生了。第10步 发布第一篇文章用Issue写博客完整流程博客上线后写文章的操作非常直观——去你的博客仓库新建一条IssueIssue标题 文章标题Issue正文 文章内容直接用Markdown编写标签Labels 文章分类每篇文章最多展示3个标签Issue评论 博客评论读者可以直接在下面互动一些实用技巧想暂时隐藏某篇文章把它对应的Issue编号加进ignores配置即可想调整文章排序在order里切换UPDATED_AT和CREATED_AT文章翻页由src/router/index.js中的路由规则处理包括/after/:cursor和/before/:cursor两个分页路径你无需关心细节总结至此你已走完了Mirror新手入门的全部10步从GitHub仓库获取源码到配置Token、本地预览、构建部署最后用Issue发布了第一篇文章。整个过程不需要写后端代码、不需要数据库、不花一分钱。往后你的全部精力只需要放在一件事上——写文章剩下的交给Mirror就好。【免费下载链接】MirrorA blogging tool powered by GitHub API. Write your blog on GitHub issue.项目地址: https://gitcode.com/gh_mirrors/mirror9/Mirror创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考 Mirror新手入门10步：从GitHub仓库到发布第一篇文章完整教程
Mirror新手入门10步从GitHub仓库到发布第一篇文章完整教程【免费下载链接】MirrorA blogging tool powered by GitHub API. Write your blog on GitHub issue.项目地址: https://gitcode.com/gh_mirrors/mirror9/MirrorMirror是一款基于GitHub API的博客工具核心玩法是用GitHub Issue写博客每一条Issue就是一篇文章Issue的评论区就是博客评论区完全不需要服务器和数据库。这份Mirror新手入门教程将用10个步骤带你从克隆GitHub仓库开始完成配置、本地预览、构建部署最终顺利发布第一篇文章让你的个人博客在几分钟内免费上线。为什么推荐用Mirror写博客在开始之前先花30秒了解它的独特优势✅零成本数据全部存在GitHub上不用买服务器、不用买域名✅零维护没有数据库和后台也就没有崩溃和备份的烦恼✅Markdown原生支持用你最熟悉的Markdown语法写作✅评论功能免费送Issue评论区天然就是博客评论区✅数据可迁移文章就是Issue随时可以导出带走它的原理其实很朴素Mirror通过GitHub GraphQL API拉取仓库里的Issue在浏览器端渲染成博客页面。相关请求逻辑都集中在src/api/目录下比如负责文章列表的issues.js和负责单篇文章的issue.js。第1步 注册GitHub账号用GitHub Issue写博客前提当然是有一个GitHub账号。如果你还没有先去官网免费注册一个整个过程不到2分钟。小提示账号名会出现在博客首页的作者卡片上建议注册时选一个和你博客定位相符的名字。第2步 获取GitHub Token3分钟准备Mirror需要读取你仓库中的Issue数据这要通过一个Access Token来授权。在GitHub的Settings → Developer settings → Personal access tokens页面创建一个新Token勾选public_repo权限即可如果博客仓库是私有的则需要repo权限。⚠️注意Token相当于你账号的钥匙务必妥善保管不要泄露给任何人。稍后我们会教你把Token加密后安全地放进配置里。第3步 创建博客仓库回到GitHub首页点击New repository新建一个仓库这就是你存放文章的博客仓库。仓库名建议简短好记比如my-blog创建时可以选择私有或公开对Mirror来说都能正常工作。第4步 获取Mirror源码克隆仓库并安装依赖在终端中执行以下命令把Mirror源码克隆到本地git clone https://gitcode.com/gh_mirrors/mirror9/Mirror进入项目目录后安装依赖npm install安装完成后整个项目就绪。你可以在package.json里看到项目提供的几个命令npm start用于本地预览npm run build用于构建部署npm run lint用于代码检查。第5步 填写核心配置Mirror最快配置方法Mirror的配置非常轻量全部集中在一个window.config对象里。项目自带一份模板文件index.sample.html把它复制一份改名为index.html然后修改里面的配置即可配置项含义示例值user你的GitHub用户名或组织名LoeiFyrepository存放文章的仓库名Recordumorganization是否使用组织账号true/falsefalsetitle博客标题会显示在页面顶部Mirrororder文章排序UPDATED_AT按更新时间、CREATED_AT按创建时间UPDATED_ATperpage首页每页显示的文章数量5ignores忽略不展示的Issue编号用逗号分隔17,13host你的博客域名用于Token加密mirror.am0200.comhash加密后的GitHub Token见第6步核心就三项user、repository和hash。前两项告诉Mirror去哪个仓库读文章第三项是访问凭证。第6步 生成加密Token安全填入hash字段直接把Token明文写进HTML有泄露风险所以Mirror提供了一套简单的加密方案实现在src/helper/secret.js中。方法并不复杂把Token中的数字替换为对应符号0→)、1→!、2→、3→#、4→$、5→%、6→^、7→、8→*、9→(把你的博客域名做base64编码把两者拼接加密后的Token 替换符号后的Token 域名base64举个例子Token为ghp_123替换后变成ghp_!#再拼接上域名的base64结果就是最终的hash值。本地预览时使用配置里的host进行加密部署上线后Mirror会自动用你的真实域名解密这也是host必须和部署域名保持一致的原因。第7步 本地预览npm start一键启动配置完成后在项目根目录运行npm start终端会启动一个本地开发服务器打开浏览器访问提示的地址你就能看到博客首页了。此时文章列表、文章详情页、评论加载等功能全部可用可以先确认数据是否正常显示再进入下一步部署。第8步 构建静态文件npm run build生成docs目录本地预览没问题后执行构建命令npm run build构建脚本定义在package.json中构建完成后会在项目根目录生成一个docs文件夹里面就是打包好的静态网站文件包括带hash的JS文件比如docs/index.xxxx.js这个文件夹就是可以直接部署的内容。第9步 部署上线把博客发布到GitHub PagesMirror构建产物是纯静态文件可以部署到任何静态托管平台。最省事的方式是GitHub Pages新建一个仓库或直接使用你的博客仓库把docs文件夹的内容推送上去在仓库的Settings → Pages中把发布目录设置为docs稍等片刻访问https://你的用户名.github.io/仓库名博客就上线了 到这里一个完全免费、无需服务器的个人博客就诞生了。第10步 发布第一篇文章用Issue写博客完整流程博客上线后写文章的操作非常直观——去你的博客仓库新建一条IssueIssue标题 文章标题Issue正文 文章内容直接用Markdown编写标签Labels 文章分类每篇文章最多展示3个标签Issue评论 博客评论读者可以直接在下面互动一些实用技巧想暂时隐藏某篇文章把它对应的Issue编号加进ignores配置即可想调整文章排序在order里切换UPDATED_AT和CREATED_AT文章翻页由src/router/index.js中的路由规则处理包括/after/:cursor和/before/:cursor两个分页路径你无需关心细节总结至此你已走完了Mirror新手入门的全部10步从GitHub仓库获取源码到配置Token、本地预览、构建部署最后用Issue发布了第一篇文章。整个过程不需要写后端代码、不需要数据库、不花一分钱。往后你的全部精力只需要放在一件事上——写文章剩下的交给Mirror就好。【免费下载链接】MirrorA blogging tool powered by GitHub API. Write your blog on GitHub issue.项目地址: https://gitcode.com/gh_mirrors/mirror9/Mirror创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考