Running Hexo blog on Azure

Hexo is a fast, simple & powerful blog framework powered by Node.js. It is developer-friendly:

  • built-in Git support
  • Syntax highlightinx works out of the box
  • Markdown support
  • Command line interface
  • Easy configuration & deployment
  • No need to have DB or any other external service, it all compiled to html/js/css files.

I am using it to run this blog. It is hosted in Azure. In this port I would like to describe how to deploy & run Hexo blog in Azure.

Install Hexo

Hexo’s home page has a good Getting started guide. To create your blog powered by Hexo do the following in command line:

1
2
3
4
npm install hexo-cli -g
hexo init blog
cd blog
npm install

To write first blog post do:

1
2
C:\Users\vitalii\Hexo\blog>hexo new post "This is my first post"
INFO Created: ~\Hexo\blog\source\_posts\This-is-my-first-post.md

It created markdown source file for the post. Edit it with with any text redactor you’d like. Personally I use haroopad.
After you finished writing your post, do:

1
2
hexo generate
hexo server

You should be able to see your new post on http://localhost:4000/.

Deploy to Azure

Create Azure website

Go to https://portal.azure.com/, create new Web App from “Web+Mobile” section, give it some name, select rest of parameters that depend on your subscription and click Create
Create website in Azure portal

Deployment

Open your new web application, find Deployment section & click to create new deployment configuration.
Deployment section
It supports deployments from multiple sources. In my example I use Local Git Repository that will be hosted on the website that I’ve just created.
Logal Git Repository
Go to settings of the website to create deployment credentials
Deployment credentials
Copy Git URL, in your folder with blog, open file _config.yml and add deployment information (If you want, you may not store password in repo property, you will enter it before deployment if you’d like)
Git URL

1
2
3
4
5
deploy:
type: git
repo: https://<user>:<password>@<appname>.scm.azurewebsites.net:443/<appname>.git
branch: master
message: Site updated {{ now("YYYY-MM-DD HH:mm:ss") }}

Install git deployer:

1
npm install hexo-deployer-git --save

Deploy:

1
2
hexo generate
hexo deploy

Done! Now, when you browse your website, you will see your blog. Every time you add new post, you need to run hexo generateand hexo deploy. Since generated blog is jsut set of static js/html/css files, you need to save source code of your articles (md files) on some other place. Push it to your git repository.

Adding search, rss, comments and Google analytics

Add these lines to config to get commenting, rss and search working (for commenting hexo is using Disqus)

1
2
3
4
5
6
7
8
9
10
feed:
type: atom
path: atom.xml
limit: 20
search:
path: search.xml
field: post
disqus_shortname: <disqus_shortname>

To enable Google analytics, in /themes/_config.yml add your analytics identifier to google_analytics property:

1
google_analytics: <identifier>