基于github和hexo的个人博客搭建步骤

hexo
, ,

原理

  • 本地编写markdown文件，选择一个喜欢的hexo主题，使用hexo框架生成静态网页，利用git将本地文件推送到github代码托管平台，然后通过网址进行访问（这里也可以自己注册域名，在github上进行绑定，然后可以通过自己的域名来访问网站）

    github是一个代码托管平台，用来存放网页文件，当做服务器使用

    hexo是基于node.js的静态博客框架，用来生成html静态网页

    git是一个分布式版本控制系统，用来将本地文件推送到github上

必备技能

  • markdown编写能力（十分钟就可以掌握，超简单的）

  • github注册账号，创建仓库

  • git的基本使用

步骤

安装node.js git hexo

  • archlinux上安装比较简单

    pacman -S nodejs git      

npm install -g hexo-cli   #这里可能需要花费点时间，也可能会报错，不用管就ok

npm install --save hexo-deployer-git    #解决后面发布时找不到git的问题

  • windows安装
    git

    node.js

    上面两个安装好了之后打开cmd

npm install -g hexo-cli
新建存放hexo的文件夹

  • archlinux

    1
    mkdir hexodir

  • windows

    1
    随便找个地方新建一个文件夹就好了

初始化hexo

需要进入到新建的文件夹下面操作

  • linux
1
2
3
cd hexodir
hexo init
npm install

  • windows

    进入hexo文件夹下面，打开cmd

    1
    2
    hexo init
    npm init
使用hexo生成静态html文件
进入到hexo文件下，windows打开cmd，linux打开终端
1
hexo generate
或者简写为
1
hexo g
本地启动服务
1
hexo server
或者简写为
1
hexo s
使用浏览器访问
1
http://localhost:4000/
如果能打开网页，说明本地已经配置好了
在github上面创建仓库

  • 如果没有github，先去注册一个

  • git与github连接需要使用ssh，所以需要生成ssh 密匙。

    1
    ssh-keygen

    linux在~/.ssh下生成id_rsa.pub文件，复制文件内容

    EYNF7d.png

    EYNm1f.png

    EYNQBQ.png

    EYN3As.png

    EYNGhq.png

    • 复制id_rsa.pub文件内容，添加到key中

    EYNDE9.png

    EYN69x.png

    EYN2jO.png

配置hexo，与github关联起来
注意：在写配置的时候，冒号后面需要有一个空格，不然会报错
编辑hexodir文件夹下面的_config.yml文件，最后面添加
1
2
3
4
deloy:
        type: git
    rpeo: git@github.com:用户名/仓库名.git
    branch: master
将本地文件推送到github上面
1
2
hexo generate
hexo deploy
或者简写为
1
2
    hexo g
    hexo d

然后打开网址就能看到自己的网站了

配置自己喜欢的主题

  • 在官网选择自己喜欢的主题

  • 将主题下载到hexodir下的themes目录下，比如我下载的next主题

    1
    2
    cd hexodir
    git clone https://github.com/iissnan/hexo-theme-next themes/next

  • 修改hexodir目录下的_config.yml配置文件,修改theme

    1
          theme: next

  • 然后重新生成静态网页，并将网页推送到github上

1
    hexo g && hexo d