美文网首页搭建博客Hexo自博客
使用 GitHub Pages + Hexo 免服务器搭建个人博

使用 GitHub Pages + Hexo 免服务器搭建个人博

作者: luozijian | 来源:发表于2017-05-31 00:43 被阅读58次

    废话不说,先上图

    file

    背景

    很久之前就想搭建一个属于自己的博客,也有人推荐用 WordPress 啥的,但是之前也一直抽不出时间来弄,最近参加的比赛暂时过了校赛,闲暇之余,就想起来把博客整一整啦

    GitHub Pages 是什么

    GitHub Pages 是通过在 GitHub 网站托管和发布的公开网页,因此是不需要我们搭建服务器的

    Hexo 是什么

    Hexo 是一个用来生成静态界面的框架,使用 Hexo,你就可以直接使用 Markdown 来写文章,而不用关心前端样式的展现,想深入研究的同学可以通过 传送门 查看官方中文文档。

    注册 GitHub 并初始化一个 GitHub Pages 的仓库

    注册就不多说啦,GitHub Pages 的仓库搭建官方文档也说的很明白了,这里就不赘述了,小伙伴可以移步 GitHub Pages 官方文档

    克隆项目仓库到本地

    git clone git@github.com:your username/your username.github.io.git
    

    准备工作

    安装 Hexo 之前需要安装 GitNode.jsnpm,还没安装的小伙伴请 查看安装教程

    安装 Hexo

    1. 进入到你的本地项目文件目录(路径替换成你的项目路径哦)
    cd /Code/luozijian.github.io
    
    1. 下载并安装 Hexo
    npm install hexo-cli -g
    

    若出现如图所示内容,则表示安装成功


    file

    配置 Hexo

    1. 初始化博客
    // 建立一个文件夹,并初始化博客,<folder>为文件夹的名称,可以随便起名字
    $ hexo init <folder>
    // 进入博客文件夹,<folder>为文件夹的名称
    $ cd <folder>
    // node.js的命令,根据博客既定的dependencies配置安装所有的依赖包
    $ npm install
    
    1. 配置博客
    vi _config.yml
    
    • 配置基本信息
    title: 这是标题
    subtitle: 这是副标题
    description: 这是描述
    author: 作者随便填
    language: zh-CN
    timezone: Asia/Shanghai
    
    • 配置个人域名
    url: http://你的域名
    
    • 部署 GitHub

    注意要部署 GitHub 要先跑这个命令 npm install hexo-deployer-git --save

    deploy:
      type: git
      repo: git@github.com:your username/your username.github.io.git
      branch: master
    

    发布

    简单的一条命令就可以发布到 GitHub Pages 啦,注意每次修改你的博客后都要记得发布哦~

    hexo g -d
    

    使用阿里云自定义域名

    1. 来到阿里云的 域名解析控制台,选择添加解析

      file
    2. 添加一个 blog 的子域名,然后保存

      file
    3. 来到你的 GitHub Pages 在仓库点击 Setting

      file
    4. 选择自定义域名,填写你的阿里云域名,点击 save 按钮

      file
    5. 为了防止你每次使用 hexo g -d 布到 GitHub Pages 的时候会覆盖掉你的自定义域名设置(步骤四),因为要在本地 source 目录 新建一个 CNAME 文件,无后缀,如图,然后在 CNAME 文件里面写上需要绑定的域名即可(仅域名,不要http)

      file

    最后

    我的博客,想自己搞博客的同学可以搞起啦,不喜欢默认的主题的话还可以去 Hexo 主题 找找自己喜欢的主题哦,如果还有什么问题欢迎在下面评论哦~
    ps:我的博客用了 Disqus 评论插件,但是因为在国内被墙的原因,想要评论或者看别人的评论的小伙伴需要翻墙才能看到哦~

    相关文章

      网友评论

        本文标题:使用 GitHub Pages + Hexo 免服务器搭建个人博

        本文链接:https://www.haomeiwen.com/subject/kpddfxtx.html