5 分钟快速搭建好你的我的站点

Hexo 是一个快速、简洁且高效的博客框架,它使用 Markdown(或其余渲染引擎)解析文章,在几秒内,便可利用其众多的靓丽主题生成静态网页。正是这种简单、免费和可扩展的特性,Hexo 愈来愈受到程序员的喜好。这里咱们经过一个详细的教程,给你们演示一下如何在 5 分钟内搭建并部署好一个我的站点(博客)。html

咱们使用 Hexo 框架来搭建博客站点,同时将站点托管到 LeanCloud 平台的「云引擎」之上,以完成最终的部署上线。闲言少叙,书归正文,咱们看看具体的步骤是什么样子的。node

1. 安装依赖

Hexo 依赖于 Node.js 和 Git,若是你的电脑中已经安装了这两个必备程序,那么能够直接前往下一步。若是你的电脑中还没有安装所须要的程序,请参考官方指南完成安装。git

2. 安装 Hexo

依赖安装完成以后,可使用 npm 安装 Hexo。程序员

$ npm install -g hexo-cli

3. 下载博客项目模版

Hexo 命令行工具能够建立一个典型的博客项目,在该项目内 Hexo 经过使用特定的主题(theme)来对 Markdown 格式的文章内容进行渲染,从而生成静态文件。通常状况下,咱们只须要把这些静态文件部署到远程服务器上,便可得到一个可用站点。github

LeanCloud 的云引擎提供了很是好用的网站托管功能,此外还提供完善的日志收集、监控等运维服务,这就要求一个站点在基本的静态内容以外还能支持少数动态的管理接口(在云引擎的项目框架中已经实现)。web

为此咱们在 Hexo 项目框架的基础上加入了少许 LeanCloud 云引擎须要的动态响应文件,作成了 hexo-engine 这样一个开源的项目模版。开发者能够直接将这个项目下载到本地,以此为基础开始搭建本身的博客站点。npm

$ git clone git@github.com:leancloud/hexo-engine.git

下载好模板以后,咱们须要先安装好 Node.js 的项目依赖,以便于后续的操做:浏览器

$ cd hexo-engine
$ npm install

4. 添加内容

Hexo 框架将全部的博客文章统一放置在 source/_posts 目录下。咱们进入 hexo-engine 目录,执行 hexo new 命令便可增长一篇新的博客文章。服务器

例如咱们想增长一篇「5 分钟快速搭建好你的我的站点」的博客,那么能够运行以下命令:hexo

$ cd hexo-engine
$ hexo new "build your own website in 5 minutes"

执行完以后咱们可看到以下的结果信息:

INFO  Validating config
INFO  Created: ./hexo-engine/source/_posts/build-your-own-website-in-5-minutes.md

直接去编辑这个新增的 Markdown 文件(build-your-own-website-in-5-minutes.md)就能够了。

5. 本地运行

文章编辑好了以后,咱们能够运行 hexo generate 命令来生成静态文件,hexo server 来启动本地服务器,查看实际效果。咱们在命令行下输入以下命令:

$ hexo g
$ hexo s

注意这里的 g 和 s 分别是 generate 和 server 的缩写。执行完以后应该能够看到以下结果信息:

INFO  Validating config
INFO  Start processing
INFO  Hexo is running at <http://localhost:4000> . Press Ctrl+C to stop.

这时候在浏览器内打开 (http://localhost:4000,就能够看到咱们本身的博客站点已经跑起来了。)

6. 部署到 LeanCloud

到目前为止,咱们的我的站点已经能够跑起来了,惟一的遗憾是尚未实际部署到互联网上,还不能让其余小伙伴自由访问。

这里咱们使用 LeanCloud 云引擎服务来免费完成这最后的一步——部署上线。首先咱们申请一个 LeanCloud 帐号,并建立一个应用,这部分操做比较简单,你们自行登陆 LeanCloud 官网 操做便可。

6.1 准备:安装云引擎命令行工具

咱们首先须要安装云引擎的命令行工具(能够参考官网文档):

  • macOS 用户能够执行 brew install lean-cli ;
  • Windows 用户能够在 GitHub releases 页面 根据操做系统版本下载最新的 32 位 或 64 位 msi 安装包进行安装;
  • Linux 用户能够从 GitHub releases 页面 下载 deb 包或者预编译好的二进制文件进行安装;

接下来咱们须要登陆 LeanCloud 帐户(按照提示选择区域并输入 LeanCloud 用户名和密码便可):

$ cd hexo-engine
$ lean login --region US

而后是将当前的项目与 LeanCloud 应用创建关联,输入以下命令:

$ cd hexo-engine
$ lean switch

按照提示选择区域和目标应用便可。

有关云引擎命令行工具的更多使用内容,能够参考文档:命令行工具 CLI 使用指南

6.2 本地运行

在项目目录下运行以下命令:

$ cd hexo-engine
$ lean up

在浏览器中打开 http://localhost:3000,咱们能够看到博客站点的首页内容。

6.3 部署到云端

若是前面的步骤都没有问题,咱们就能够将当前项目部署到 LeanCloud 云端了。在命令行下输入以下命令:

$ cd hexo-engine
$ lean deploy

注意在 deploy 以前,咱们能够删除本地的 public 目录,以免没必要要的文件上传。deploy 的执行结果应该以下所示:

[REMOTE] [Node.js] 使用 Node.js v12.19.0, Node SDK 3.7.0, JavaScript SDK 3.15.0
[REMOTE] 版本 20201118-064943 构建完成
[REMOTE] 开始部署 20201118-064943 到 web1
[REMOTE] 正在建立新实例 ...
[REMOTE] 正在启动新实例 ...
[REMOTE] 实例启动成功:{"runtime":"nodejs-v12.19.0","version":"3.7.0"}
[REMOTE] 正在更新云函数信息 ...
[REMOTE] 部署完成:1 个实例部署成功
[INFO] Deleting temporary files

这时候咱们能够进入 LeanCloud 云引擎的控制台,为当前部署的云引擎实例设置一个访问域名,其操做路径以下图所示:

img

咱们在浏览器中打开 http://hexo-engine.avosapps.us 就能够看到发布以后的首页内容了。

大功告成,咱们的我的博客已经顺利上线了!测算一下,不计建立帐号和下载工具的时间,整个过程耗时应该不超过 5 分钟。

7. 其余

7.1 定制化修改

咱们能够经过修改项目根目录下的 _config.yml 文件,来对如今的博客站点进行一些定制,例如修改网站标题、描述、关键字,等等。具体细节能够参考这里的官方指南

7.2 给博客加上评论功能

咱们推荐你们使用 Valine 这一个评论插件,具体的接入能够参考这篇博客

7.3 使用更多主题

有不少开发者为 Hexo 贡献了很是多精美的主题,要替换一个新的主题,操做上也是很是简单的,有兴趣的读者能够阅读这里的文档。

相关文章
相关标签/搜索