Hexo搭建个人博客

[Hexo] [1]是高效的静态站点生成框架,她基于Node.js。 通过 Hexo 你可以轻松地使用 Markdown 编写文章,除了 Markdown 本身的语法之外,还可以使用 Hexo 提供的标签插件来快速的插入特定形式的内容,而且相对于其他框架,Hexo在速度上也有很大优势。

  [1]: https://hexo.io/

## 搭建Node.js环境

我们了解到Hexo基于Node.js的,那么我们搭建博客网站首先需要安装Node.js环境。 Node.js 是一个基于 Chrome V8 引擎的 JavaScript 运行环境,可以在非浏览器环境下,解释运行 JS 代码。

[点击下载 Node.js] [2]

  [2]: https://nodejs.org/dist/v8.11.1/node-v8.11.1-x64.msi

测试安装:命令行使用 `node -v` 和 `npm -v` 查看显示版本号即成功。

## 安装Hexo博客框架工具

Hexo是一个建站工具,可以帮助我们快速生成基本的博客文件,安装它需要在控制台下使用如下命令:

```
    npm install hexo-cli -g
```

## 安装Git版本工具

Git是目前世界上最流行的分布式版本控制系统,是的,没有之一。使用Git可以帮助我们把本地的网页和文章等内容提交到Gihub上,实现同步。

[点击下载 Git] [3]

  [3]: https://github.com/git-for-windows/git/releases/download/v2.17.0.windows.1/Git-2.17.0-64-bit.exe

Windows系统需下载,Mac系统因为自带Git无需操作。
测试安装:命令行使用 `git --version` 查看显示版本号即成功。

## 注册Github账号

Github是一个面向开源及私有软件项目的托管平台,因为只支持 *git* 作为唯一的版本库格式进行托管,故名Github。这里用到Github,是因为我们需要通过Github得到自己的博客网站域名,而且需要使用Github同步我们个人博客的相关文件。

注册地址: [Github 官网] [4]
注册流程: [百度一下,你就知道] [5]

  [4]: https://github.com/
  [5]: https://www.baidu.com/

# 开始搭建博客

搭建我们的个人博客需要一个唯一的域名,当然我们可以申请购买一个域名来使用,但是在不是太必要的情况下,我们也可以通过Github Pages获得一个免费使用的域名,这需要我们在Github上新建一个仓库,如下:

![Alt image](http://p87bi0e6z.bkt.clouddn.com/20180504192557.png)

勾选 `Initialize this repository with a README` 避免后面不必要的麻烦

其中的 `%username%` 替换成Github用户名

这个过程和建立普通的仓库没什么区别,关键在于新仓库的名字,一定要是 `%username%` +“github.io”的形式。这也是之前强调的要起一个好的用户名的原因。这样之后我们最后的博客网站的链接就会是:https://`%username%`.github.io的形式。
注意:固定新仓库的名字格式并非必须,只是这样操作生成的博客域名比较短小简洁,另起他名生成博客域名会很冗长。

点击Create Repository之后,随后选择Setting进入设置,找到Github Pages如下:

![Alt image](http://p87bi0e6z.bkt.clouddn.com/20180504194332.png)

这里我们需要点击Choose a theme任意选择一个选择主题,然后界面会跳转到仓库,我们看到有两个文件如下:

![Alt image](http://p87bi0e6z.bkt.clouddn.com/20180504194740.png)

此时若再查看Setting,我们会看到开启GitHub Pages之后得到的域名如下:

![Alt image](http://p87bi0e6z.bkt.clouddn.com/20180504195040.png)

现在,我们就可以使用 https://`%username%`.github.io 访问自己的博客网站了,打开链接我们会看到默认主题的个人博客样式如下:

![Alt image](http://p87bi0e6z.bkt.clouddn.com/20180504195406.png)

# 创建本地博客站点

上述的步骤相当于我们使用Github page,创建了一个默认的博客页,并且得到了一个可外部访问的域名。但是这个博客页很Low。我们的目的是创建自己个性化的博客网站,所以我们使用Hexo在本地先创建一个本地博客站点,优化后再把它部署到Github上。接下来我们使用控制台命令在本地一个合适的位置创建博客站点文件夹如下:

安装Hexo,在自己认为合适的地方创个文件夹,我是在E盘建了一个blog文件夹。然后通过命令行进入到该文件夹里面

![Alt image](http://p87bi0e6z.bkt.clouddn.com/20180504200531.png)

输入 `npm install hexo -g` 开始安装Hexo

输入 `hexo -v` 检查Hexo是否安装成功

输入 `hexo init` 初始化该文件夹

看到后面的 `Start blogging with Hexo!` 表示成功

输入 `npm install` 安装所需要的组件

输入 `hexo g` g是generetor的缩写,生成博客

![Alt image](http://p87bi0e6z.bkt.clouddn.com/20180504200153.png)

输入 `hexo s` s是server的缩写,启动服务,[访问该网址] [6],正式体验Hexo

  [6]: http://localhost:4000/

问题:假如页面一直无法跳转,那么可能端口被占用了。此时我们ctrl+c停止服务器,接着输入 `hexo server -p 端口号` 来改变端口号

# 同步Github,允许公共访问

在本地我们已经搭建了博客,但是还只能自己本地访问。若要别人也能看到,那就需要我们将其同步部署到GitHub上了。还记得我们之前准备的Github仓库吗,这里就要用到了。
首先找到我们的博客仓库,并拷贝仓库地址:

![Alt image](http://p87bi0e6z.bkt.clouddn.com/20180504202454.png)

修改本地博客根目录下的_config.yml文件,修改deploy下的配置如下:

修改repository值为上面拷贝的仓库地址

```
    deploy:
      type: git
      repository: git@github.com:%username%/%username%.github.io.git
      branch: master
```

Git安装后,右键有 `Git Base Here` 在本地博客文件夹打开

将Hexo与Github page联系起来,设置Git的username和email

```
    git config --global user.name "Github用户名"
    git config --global user.email "Github绑定的邮箱"
```

输入 `cd ~/.ssh` 检查是否由.ssh的文件夹

输入 `ls` 列出该文件下的内容

输入 `ssh-keygen -t rsa -C “Github绑定的邮箱”` 连续三个回车,生成密钥,最后得到了两个文件:id_rsa和id_rsa.pub(默认存储路径是:`C:\Users\Administrator\.ssh`)

输入 `eval "$(ssh-agent -s)"` 添加密钥到ssh-agent

输入 `ssh-add ~/.ssh/id_rsa` 添加生成的SSH key到ssh-agent

登录Github,点击头像下的Settings进入SSH and GPG keys选项,添加SSH keys

新建一个New SSH key,将id_rsa.pub文件里的内容复制上去

输入 `ssh -T git@github.com` 测试添加ssh是否成功。如果看到Hi后面是你的用户名,就说明成功了

新建一篇博客,用控制台定位到本地博客文件夹执行命令 `hexo new "My New Post"`

这时候在文件夹_posts目录下将会看到已经创建的文件

在生成以及部署文章之前,需要安装一个扩展:`npm install hexo-deployer-git --save`

使用编辑器编好文章,那么就可以使用命令: `hexo d -g` 生成以及部署了

部署成功后访问你的地址将看到生成的文章

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
你想了解如何使用 Hexo 搭建个人博客,是吗?我可以为你提供一些基本的指导。首先,你需要按照以下步骤进行操作: 1. 安装Node.js:Hexo 是基于 Node.js 的静态网站生成器,所以你需要先安装 Node.js。你可以在 Node.js 官方网站上下载适合你操作系统的安装包,并按照指示进行安装。 2. 安装Hexo:打开命令行终端,运行以下命令来安装 Hexo: ``` npm install -g hexo-cli ``` 这将全局安装 Hexo 命令行工具。 3. 初始化博客:选择一个合适的目录作为你的博客根目录,并在终端中进入该目录。然后运行以下命令来初始化博客: ``` hexo init myblog cd myblog npm install ``` 这将创建一个名为 "myblog" 的新目录,并在其中初始化 Hexo。 4. 配置博客:在博客根目录中,找到名为 `_config.yml` 的文件,并使用文本编辑器打开它。在这个文件中,你可以配置博客的各种设置,比如标题、描述、作者等。根据你的需求进行相应的修改。 5. 创建新文章:使用以下命令来创建一个新的文章: ``` hexo new "My First Post" ``` 这将在 `source/_posts` 目录中创建一个名为 "my-first-post.md" 的 Markdown 文件。你可以使用 Markdown 语法来撰写文章内容。 6. 预览博客:运行以下命令来启动本地服务器,并预览你的博客: ``` hexo server ``` 然后在浏览器中访问 `http://localhost:4000`,你将看到你的博客的预览页面。 7. 部署博客:当你完成了博客的撰写和调试,可以使用以下命令来生成静态文件并部署到你的博客托管平台: ``` hexo generate hexo deploy ``` 这将生成一个名为 "public" 的目录,其中包含了你的博客的静态文件。你可以将这些文件上传到你选择的托管平台上,如 GitHub Pages、Netlify 等。 这些是使用 Hexo 搭建个人博客的基本步骤。当然,在实际使用过程中,你还可以根据需要安装主题、插件等来增强博客的功能和外观。希望这些信息对你有所帮助!如果你有任何进一步的问题,请随时提问。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值