Hello World: Blogging with Hexo

I decided to write about things I code and circled back to Hexo.

I wanted a static site generator in order to host on github. I admantly wanted to avoid managing plain text in databases. I wanted something built with javascript because I was comfortable with the npm ecosystem.

There weren’t a lot of static site generators built with javascript. Many projects were abandoned or required too much work setting up. The two that worked well out of the box was 11ty and Hexo. I did not really like the starter themes for 11ty. With Hexo, I found Cactus which was pretty close to what I had in mind.

I did come across Zola which seemed good, but by then I had gotten Hexo running and written this post and had come to like this theme.

Setting up hexo

Assuming you have npm and git installed, Setting up Hexo to a state similar to how this blog is, is fairly easy.

Hexo can be installed by running

npm install hexo-cli -g

Once Hexo is installed, a blog can quickly be initialized by running

hexo init blog
cd blog
npm install
hexo server

At this point, if you go to http://localhost:4000 in your browser, you should see Hexo running with the default theme.

The details of the blog, like the site name, can be changed by editing _config.yml. The posts go into the ./source/~posts dir as markdown files. Themes are installed into the ./themes dir. This blog is using the Cactus theme. To install this theme, clone the github repo into the ./themes/ dir.

cd ./themes/
git clone https://github.com/probberechts/hexo-theme-cactus.git

Change the value for theme in _config.yml (should be around line no 99 towards the end) and restart hexo from the terminal, you should be able to see hexo running with the Cactus theme.

Deploying from Hexo

Hexo suggests a one command deployment to git where you give the repo name in the config file and Hexo deploys to it automatically.

Enter the repo details in _config.yml as follows

deploy:
type: git
repo: https://github.com/ramu-r/ramu-r.github.io
branch: master
message: "Site updated: {{ now('YYYY-MM-DD HH:mm:ss') }}"

The blog can now be deployed by running

hexo deploy  

If you have correctly setup your github pages settings your blog should be online at this point.