手把手教你从0到1开始部署博客（一）

小志Codings
1,331 阅读5分钟

本次教程主要是来教会大家怎么样从0到1搭建自己的个人博客，一步一步带你。

  • 搭建环境
  • 初始化个人博客
  • 写博客
  • 部署远端
  • 更换博客主题

如果各位读者在部署的时候出现了什么问题的话，可以在评论区内留下，以后会继续更新其余博客框架的部署

在这里，我先说一下关于写博客的好处。不论你是哪所大学毕业，也不论你是研究生毕业还是博士毕业，在找工作的时候都少不了一份简历。简历上面有自己的个人博客会大大加分。

之前在学校的时候很多师兄师姐们都找不到工作，或者是很容易就被刷了下来。原因是什么呢？除开个人对本职工作的知识是否扎实，你的leader能力、博客等等这些都是很重要，很多人往往都会忽略这些事情，导致面试的前一晚才开始准备自己的简历。

大家都知道在高考前要提前100天发起冲刺，在单元考试前要提前一个星期去复习，那你为什么在面试前一晚在做准备呢？

所以我在这边就来带领大家，一步一步把这博客给搭建好，为了大家的面试可以加分，也希望大家可以形成写博客的习惯。

一、主流博客框架介绍

现在主流的博客框架有哪些呢？

  • Wordpress
  • Hexo
  • Jekyll
  • Hugo

1.1 Wordpress

Wordpress是一个基于php，用来搭建动态的博客的CMS系统。wordpress也是一个开源的，可以使用wordpress来制作网站，或者是app。wordpress这个框架还是比较成熟的，使用的人也比较多，根据官网统计全球有38%的网站使用的都是wordpress。

wordpress框架主要的作用是做新闻网站和博客网站，照这样分析，可以说是所有该类型的网站使用的都是wordpress框架。wordpress的文档特别丰富，我最近去看的时候发现wordpress的汉化已经比较全面了。

1.2 Hexo

Hexo是基于js，是一款快速、简洁且高效的博客框架。Hexo支持markdown，这一点对于程序员来说是比较友好的，比如像我们写文档基本上用的都是markdown。

Hexo部署起来是非常方便的，5行命令就部署完了。可以部署到github、码云或是是云主机。

1.3 jekyllrb

jekyllrb是基于ruby，同样也是一个静态网站生成器，它的使用与Hexo的使用方法很像，也是很简单的博客框架。

1.4 hugo

hugo是基于go语言的，hugo在安装、创建新的页面、更换主题等的操作也是很方便，同样，几行命令就可以搞定。

二、hexo框架的使用

hexo框架还是比较简单的，基本的使用说明在官方文档里面都是有详细说明的。但是为什么还是要写这一块呢？原因是在配置环境的时候我踩了几个坑，所以不希望后来的小伙伴做博客的时候也踩相同的坑

2.1 安装node.js

前面介绍hexo的时候说过，hexo是基于js的，安装node.js是为了快速渲染界面。

安装node.js的时候，我看很多教程要么就直接通过下载安装包安装或者直接==apt-get install nodejs==

这样安装的话，很难去控制版本，注定只能去安装这个版本，一但要更新版本的话，迁移代码的工作量是非常大的。那么怎么办呢？

经过看官方文档，我觉得最合理的方式是通过npm包管理器进行安装时最方便管理，以后只需要通过npm命令进行升级即可，并不会覆盖原来的配置。

==安装node.js==

# Using Ubuntu
curl -sL https://deb.nodesource.com/setup_12.x | sudo -E bash -
sudo apt-get install -y nodejs

因为我的电脑版本使用的是Ubuntu，具体可以查看node.js安装参考安装

安装git

  • windows：下载并扮装gitgit
  • mac：Homebrew,MacPorts或者直接下载安装程序
  • Linux (Ubuntu, Debian)：sudo apt-get install git-core
  • Linux (Fedora, Red Hat, CentOS)：sudo yum install git-core

在安装git之后应该先配置好ssh，你总不能自己去上传每一个写好的文章吧。详细配置请参考SSH关联授权

三、hexo框架的部署

4.1 安装hexo

将hexo的配置环境都安装好了之后,接下来就是安装hexo了。

npm install hexo-cli -g 
hexo init blog
cd blog
npm install
hexo server
  • npm install hexo-cli -g ==安装hexo==
  • hexo init blog ==初始化hexo,并生成文件blog==
  • cd blog ==进入blog文件==
  • npm install ==在初始化时，出现错误时的解决方案==
  • hexo server ==运行hexo==

4.3 新建文章

$ hexo new [layout] <title>

如果你的标题存空格的话，需要用引号括起来

hexo new "post title with whitespace"

当这个命令运行之后，刚刚创建的文件会出现子在blog/source/_post下

接下来先清空

hexo clean

生成页面

hexo g

运行hexo

hexo s

4.12部署到github

在将项目部署到github之前需要先下载github部署插件

npm install hexo-deployer-git --save

安装之后在_config.yml添加如下配置

deploy:
  type: git
  repo: https://github.com/<username>/<project>
  # example, https://github.com/hexojs/hexojs.github.io
  branch: master

接下来在github仓库中创建一个仓库，仓库名为：用户名.github.io

配置好了之后，保存。部署的时候输入: ==hexo d==

现在就成功部署到了github了！

本文使用 mdnice 排版

avatar
文章
阅读
粉丝