美文网首页关于hexoHexo程序员
githubpage + hexo 创建个人博客

githubpage + hexo 创建个人博客

作者: 起个名忒难 | 来源:发表于2016-12-11 03:07 被阅读200次

    前言

    很久之前就像要一个自己的博客,想在这个浩瀚的网络上,能有一个自己的小家,简单的写写文章,记录一下自己的心路历程。虽然有各种博客,但是风格都是官方定好的,完全没有自己发挥的空间。 虽然wordpress可以搭建个人博客,但是服务器空间域名等都需要钱来维护,而且wordpress使用起来也不是很爽。直到发现了githubpage和hexo。一颗躁动的心又要起航了。

    概述

    github: 是一个面向开源及私有软件项目的托管平台,只支持git作为唯一的版本库格式进行托管,故名GitHub 。也是众多程序员聚集的地方,目前拥有超过 900 万的开发用户。

    node.js: Node是一个服务端JavaScript解析器,他将改变服务器如何工作的概念。目标是帮助程序员构建可伸缩的应用程序,虽然说了这么多,我能说其实我也不会用吗 。。。

    git: 一款免费的开源的分布式版本控制系统,用于敏捷高效的处理任何或小或大的项目

    Hexo: 一款基于NODE.JS的快速、简单的博客框架,能够创建一个项目进行编辑后生成一套静态网页,比较适合个人博客的搭建。可以急速生成静态网页,支持MarkDown。

    github pages : 300M免费空间,资料可以自己管理,免费使用,并且快速稳定。

    软件下载地址传送门

    node.js : https://nodejs.org/en/download/
    git : https://github.com/git-for-windows/git/releases/tag/v2.11.0.windows.1

    环境安装

    • 安装node.js, 我下载的是 .msi 的安装包, 软件会默认将安装路径添加到path中。
    • 安装git,如果不会安装,请自行搜索教程

    本机环境

    1. windows 8.1
    2. git版本: version 2.10.1.windows.1
    3. nodejs版本: v6.9.2

    实战开始 安装 配装 使用 Hexo

    Hexo需要的环境搭建好之后,我们开始安装hexo 。

    安装Hexo

    在电脑的任意位置,创建一个文件夹,文字随便命名看你喜欢了,鼠标右键,点击Git Bash Here ,输入命令即可安装 。

    1. npm install -g hexo
    2. npm install hexo --save
    3. hexo init
    4. npm install
    5. npm install hexo-deployer-git --save //ERROR Deployer not found: git 安装这个插件

    安装成功的目录:

    本地查看运行效果:

    运行命令:

    hexo generate 命令简写 hexo g
    hexo server 命令简写 hexo s

    浏览器运行结果:

    在浏览器输入 http://localhost:4000 , 即可看到本地的运行的效果。

    淘宝源安装

    看到上面的图片,说明我们hexo本地的安装已经成功,接下来就是将我们的文件上传到github了,首先我们需要有一个github账号,直接去注册就好了,作为一个屌丝程序员,怎么可能没有github账号,之后就是设置ssh公钥,设置的方式:

    • 登陆账号后,鼠标点击你的头像,点击-Your profile
    • 点击左边的 , Edit profile
    • 左边,SSH and GPG keys
    • 右边,New SSH key
    • 随便输入 title , key 文本框中,输入公钥,点击Add SSH key

    创建仓库

    • New repository , 创建新仓库
    • Repository name ,这个是重点 !!一点要填写为:你的账号名.github.io 。
    • 完成仓库的创建 。

    结果如下图:

    部署到github

    仓库创建成功以后,我们可以将本地的网页文件上传到github了,下面我们看一下具体的设置:

    打开,你创建文件夹的根目录 ,找到 _config.yml文件 ,在最后面添加下面的代码:

    deploy:
      type: git
      repository: 你的仓库地址
      branch: master
    

    hexo 的配置已经完成。

    接下来,我们使用hexo命令将文件上传到github仓库中。

    hexo clean # 清楚缓存
    hexo g  # 生成静态网页至public目录
    hexo d  # 发布到github
    

    效果如下图说明发布成功

    在浏览器输入 Your-Github-Name.github.io ,就可以查看你的博客了。

    到这里,博客已经基本创建好了,后续会继续跟进博客主题的替换,博客样式的设置。


    少年听雨歌楼上,红烛昏罗帐。  
    壮年听雨客舟中,江阔云低,断雁叫西风。
    感谢支持!
                                            ---起个名忒难
    

    相关文章

      网友评论

      本文标题:githubpage + hexo 创建个人博客

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