爬向天花板的蚂蚁

上善若水,水善则利万物

人可以一无所有,但绝不能让人看不到任何希望


搭建个人免费博客

基于Node.js + Hexo + Github Pages搭建

针对Mac系统,Window的安装差别在指令

本人也是一个小白,所以这也是一篇小白也能看懂的文章。我在搭建自己的博客也踩了不少的坑,希望这篇文章能让想搭建博客的小白少踩坑

先来一个喵神的博客的看下效果

1.Github域名

先注册Github账号,正常人都可以注册成功的,这里略过

创建仓库(repository) 来存储我们的网站,点击首页的 New repository

给仓库起名,仓库的前缀是用户名,我已经创建过同名的仓库了,所以显示重名了

2.安装环境软件

2.1 安装Git

Mac系统安装Git很简单,就两行指令

// 如果已安装HomeBrew 无需执行此行
$ /usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"
 $ brew install git   // 安装Git

Window系统请自行百度,也很简单的,不停点下一步就好

2.2 安装Node.js

要安装Node要先安装nvm,nvm是Node的版本管理工具

$ curl https://raw.github.com/creationix/nvm/master/install.sh | sh

安装完成后,一定要 重启终端
然后安装Node.js

$ nvm install 4

注意 这里安装可能会出现坑,我就是在这里踩的坑,然后我付出了沉重的代价

安装nvm后,命令窗输出 Warning: nvm-0.31.0 already installed
或nvm install 4 指令出现 command not found

出现这种问题,我是直接下载Node.js来安装,下载地址

2.3 安装Hexo

要前面的git,node都安装了,再安装Hexo

$ sudo npm install hexo-cli -g

3.博客

  1. 初始化博客文件区

选择一个自己的工作文件下,执行下面的指令,username根据自己的喜欢来命名

$ hexo init username.github.io
  1. 配置博客主题

    毕竟这是一个看脸的年代,执行下面的指令,进入刚才生成的博客文件区

    $ cd username.github.io
    

    安装主题,这里选择的主题是喵神的主题,个人比较喜欢,更多主题请点击

    $ git clone https://github.com/monniya/hexo-theme-new-vno.git themes/new-vno
    

    配置主题到博客配置文件,打开当前文件夹下_config.yml修改几个键值对,下面把几个必须设置的列出来按需求修改,记得保存,还有注意配置的键值之间一定要有空格

    title:     //你博客的名字
     author:   //你的名字
     language: zh-Hans    //语言 中文
     theme: new-vno   //刚刚安装的主题名称
    

    github发布的配置,username换成你的github的用户名

    deploy:
       type: git    //使用Git 发布
       repo: https://github.com/username/username.github.io.git    // 刚创建的Github仓库
    

    针对刚才安装的主题的配置在请点击这里有更多的说明

4.测试

到这里,所有的基础框架已经创建完成,执行下面的指令进行

$ hexo s

终端输出服务器启动完成,终端一直运行,在浏览器中输入http://localhost:4000 访问了

5.写文章并发布

1.写文章

可以博客文章了,先写一个来测试下,在username.github.io/source/_posts文件夹下创建FirstTest.md的文件,md是markdown语法编写的文件。
如下面的例子

---
 title: FirstTest
 ---
第一次写博客文章,用于测试

写完一定要保存

可以先在本地看下效果,把终端正在运行的服务器关闭(ctrl + c), 然后重新启动服务器,执行指令 hexo s

2.安装hexo-deployer-git自动部署发布工具

这个工具会自动把博客文章生成的静态网页上传到github,回到username.github.io/文件下,执行下面的指令安装

$ npm install hexo-deployer-git --save

3.发布文章

生成静态网页文件发布至我们的Github pages中,执行下面的指令

$ hexo clean && hexo g && hexo d

如果这是你的第一次,终端会让你输入Github 的邮箱和密码,正确输入后,就会把你的博客上传至Github。以后在每次把博客写完后,执行一下这个命令 hexo clean && hexo g && hexo d 就可以直接发布了

激动时刻

在浏览器中输入 https://username.github.io 就可以访问你的博客了,username是你自己起的用户名

迷之总结

博客的搭建要有耐心,我都捣腾了很久先弄好的,希望这篇文章可以帮助想搭建博客的同学

最近的文章

过去一年的随笔

上一年就想写博客了,记录下自己走过的路,虽然走了比较多的弯路,直到现在才开始写,也是严重的拖延症。 作为一个进入职场不久的弱鸡,以我自身的经历来给大家作参考,希望对一些像我这样的大兄弟或大妹子有帮助。在这里,给各位正在找工作的同学一些个人建议。面试时可以将自身能力强行装到1.5倍,然后在试用期将自身 …

于 继续阅读