hexo助小白打造个人博客之入门篇

hexo助小白打造个人博客之入门篇

我一直想拥有一个个人的技术博客,苦恼不知如何开始。作为一个小白,还是从最简单的入手为好,在多方查找资料后,决定基于github+hexo打造一个简单的个人博客。下面我简单记录下过程。

为什么选择github+hexo?

github为每个注册用户都提供了免费的二级域名与空间,给博客小白提供了初期建立博客的实验环境,非常人性化。而hexo作为当前一个非常流行的博客框架,快速、简洁且高效。hexo 基于nodejs,非常适合前端开发者,很快可以入手。而且支持时下流行的 markdown(或其他渲染引擎)解析文章生成静态网页,文章编写会非常简单快速。

如何建立github blog的雏形?

在github上建立一个blog仓库,仓库信息简单填写即可。

建仓库

进入仓库设置页面,填写一些必要的信息。

进入仓库设置页

这里把仓库名称先填一下

填写仓库名称

接下来翻到下面,选择master分支,选择一个主题来发布博客页面。然后就可以通过提供的网址来访问到自己的博客了。

pages服务

页面效果

如何修改我的博客页面呢?

初始生成的页面是基于README.md内容的。所以你可以修改这个文件的内容来观察页面改动的效果。

修改README

想要做更复杂的页面就可以用到博客框架hexo或者官方推荐的jekyll。这里我自己选用的是hexo。

利用hexo打造更生动的博客程序

下载安装hexo cli工具

1
npm install -g hexo-cli

安装 Hexo 完成后,执行下列命令,Hexo 会在指定文件夹中新建所需要的文件。

1
2
3
hexo init myblog
cd myblog
npm install

Hexo 3.0 把服务器独立成了个别模块,必须先安装 hexo-server 才能使用。

1
npm install hexo-server --save

安装好服务器模块后,运行这个命令来生成静态文件。

1
2
hexo generate
//或者 hexo g

运行启动服务器的命令,浏览器打开localhost:4000查看hexo博客页面效果

1
hexo server

hexo效果图

好了,第一步算是大功告成了。想要做更深入的了解,请关注我的后续文章。


扫一扫下方小程序码或搜索Tusi博客,即刻阅读最新文章!

Tusi博客

You forgot to set the qrcode for Alipay. Please set it in _config.yml.
You forgot to set the qrcode for Wechat. Please set it in _config.yml.
You forgot to set the business and currency_code for Paypal. Please set it in _config.yml.
You forgot to set the url Patreon. Please set it in _config.yml.
Your browser is out-of-date!

Update your browser to view this website correctly. Update my browser now

×