在github上搭建属于自己的博客(windows操作系统演示)

在github上搭建属于自己的个人博客

概述

​ 该教程学习自B站up主codesheep《手把手教你从0开始搭建自己的个人博客 |无坑版视频教程| hexo》,该up使用的是mac系统教学,实际学习中,使用windows操作系统的小伙伴不在少数,此教程一是为了方便我以后复习,二是给win的小伙伴教程中埋的坑按照我实际搭建中出现的问题填一填。

搭建博客步骤

1. 安装Nodejs

   • 在浏览器打开nodejs.org
   • 下载后面为LTS长期版本
   • 无脑下一步安装即可
   • win+r 输入cmd打开命令提示符，输入 node -v ，如果出现node版本则代表安装成功

2. 安装淘宝的cnpm 管理器

   • npm install -g cnpm --registry=http://registry.npm.taobao.org
   • 输入 cnpm -v 有版本则代表安装成功

3. 安装hexo框架

   • cnpm install -g hexo-cli
   • 查看hexo版本：hexo -v

4. 创建本机博客文件夹

   • 这个自定义，如笔者就在D盘下新建了一个blog文件夹
   • 在命令行输入blog文件地址 如 cd D:\blog 然后输入d：进入blog文件夹

   在这里建一个文件夹，以后的步骤如果出现无法挽回的错误，可以留个后路，删除文件夹重新开始步骤

5. 生成博客 初始化博客

   • hexo init在此文件夹自动生成博客框架

6. 启动本地博客服务

   • cd source/_posts/ 进入文档管理文件夹

   • hexo s

   • http://localhost:4000/ 本地访问地址

   • hexo n “我的第一篇文章” 创建新的文章

     生成我的第一篇文章.md,这里可以使用vim(后续git安装完可以使用)编辑，也可以自行下载如vscode,typora等markdown编辑软件编辑

   • cd …/… 返回blog文件夹

   • hexo clean 清理

   • hexo g 生成

   • hexo s启动然后访问看效果

7. 安装git插件

   • https://git-scm.com/downloads在此网站直接下载，无脑下一步
   • 安装完成后到任意位置右键有git bash表示安装成功 并点击他，下面就不用命令行了，直接在这里面操作
   • 先cd /d/blog(根据个人情况看)进入blog文件夹

8. 将博客部署到github上去

   • 访问github.com登陆/注册账号

   • 点击右上角头像左侧加号New repository

   • YourGithubName.github.io Github创建一个新的仓库

     用户部署个人博客的github仓库命名必须符合特定的要求，如这里我的就是JY741.github.io

   • 在git bash下输入cnpm install --save hexo-deployer-git #在blog目录下安装git部署插件

   • 完成上一步后找到blog文件下下的_config.yml用记事本方式打开

   • 找到最下面修改如下代码

   # Deployment
   ## Docs: https://hexo.io/docs/deployment.html
   deploy:
   type: git
   repo: https://github.com/YourGithubName/YourGithubName.github.io.git
   branch: master
   

   • hexo d #部署到Github仓库里

   这时候有个弹窗自动弹出让你输入自己GitHub上用户名邮箱密码等信息，输入等待即可

   • https://YourGithubName.github.io/ #访问这个地址可以查看博客(如我的JY741.github.io)

9. 修改自己想要的博客主题(yilia为例)

   • git clone https://github.com/litten/hexo-theme-yilia.git themes/yilia #下载yilia主题到本地
   • #修改hexo根目录下的 _config.yml 文件 ： theme: yilia
   • hexo c #清理一下
     hexo g #生成
     hexo d #部署到远程Github仓库
     https://YourGithubName.github.io/ #查看博客

结语

​ 这是笔者第一篇博客，怎么说也有个纪念意义吧！！希望对看的你们有所帮助😘