Hosting a blog without a server

tl;dr

I’ve migrated my blog from WordPress to a static web site hosted on Azure storage. It was way easier than I thought it would be and I don’t regret it for a second! Now I’m hosting this blog on an Azure storage account using static pages generated from MarkDown-files by Hugo. I still have a few things to figure out in regards to web-page optimization, SEO and CI/CD pipeline to make blogging as effortless as possible, but so far my only regret is that I didn’t go down this path sooner.

Background

I’ve been blogging on WordPress for almost five years now. First I rented space from a web-hoster, later on I migreated to Project Nami running on an Azure web-app with a SQL PaaS database. Running a web-app on Azure was way more inside of my confort zone than some wierd hosting plan where I didn’t really know what was going on and when in need of restoring a backup I was left to the mercy of some unknown support. Speaking of backup, backing up my site on Azure worked great! I just scheduled a backup of both web-app and database to a storage account once a week. I even tried doing a restore in a sharp scenario where my blog got hacked (due to WordPress a vulnerability). I was back up in just a few minutes, I could hardly believe it at the time.

Speaking of vulnerabilites… I’m not a PHP-developer, I don’t even know that much about web development at all to be honest. Customizing WordPress to look the way I wanted, getting syntax-highlighting on my code snippets and trying to keep the page fast, responsive and readable took waaaay to much effort. On top of that there were new version of Wordpress and different plugins I used all the time. I spent way more time and effort on trying to keep WordPress and all the plugins I needed up to date than I spent actually publishing stuff. I have dussins of unfinished drafts from every time I sat down with the intention of writing a post and ended up “just updating some plugins”, broke something and spent the evening fixing it again instead of writing my post. Now don’t get me wrong here, I don’t think WordPress is a bad platform, it just felt like I was running with a full trailer-truck when all I needed was a weelbarrow. I’ve been gazing at Github Pages for a long time, but never took the leap.

Azure storage - The catalyst

The other day I saw a blog post on the Azure blog that made me change my mind: Static website hosting for Azure Storage now in public preview.

WOOT?! So now I can host my blog on just a storage account? That sounded too good to be true, I just had to try it out! Following the instructions in the blog post above I signed in to my Azure subscription, created a new storage account and enabled the static website feature direcly, took my just a few minutes. Could it really be that simple?

Building a static webpage

OK, so I knew wouldn’t be able to host my WordPess site as-is, I would have to convert it to static HTML pages somehow. I did a quick poke-around the internet, asked a few friends of their experiences and quickly settled on Hugo. With Hugo I can write my posts using MarkDown and from that generate HTML-pages that gets uploaded to my storage account.

Installing Hugo, reading the Quick-Start document and getting up and running from literally nothing took under an hour. Now to be fully honest, I’m a bit of a nitpick and I’ve since then spent at least a few hours really trying to wrap my head around how Hugo actually works and doing some small customizations and getting syntax-highlighting working, but more on that some other time, back to the story of migrating. I now had a fully working blog locally on my laptop.

As the announcement recommended I installed the Azure Storage extension to my favorite code editor VS Code (seriously, if you haven’t tried it yet, try it out, it is full on amazing!). When I had my new blog repository open in Code I issued the command “>Azure Storage: Deploy to Static Website…”, got to log in to Azure, choose my storage account and wich folder I wanted to upload, a minute after that my blog was live on the internet.

Migrating from WordPress to Hugo static webpage

I now had a new blog, but what about all the posts I had on my old blog? I didn’t want to loose all that content!

A search of the internet revealed this guide on how to Migrate from WordPress to Jekyll. It was a few years old but I thought “what can go wrong, after all I have a working backup…”. Setting up Disqus worked just as described and I was really impressed how easy it was to migrate all comments. I was fully expecting to lose all comments in the migration so that was a happy supprise!

Now for the part on exporting WP content. I tried installing the jekyll-exporter plugin on my site but I got some wierd error message. Maybe because I’m running this special version of WordPress (Project Nami) or maybe because of something else, bummer. But wait, on the GitHub page of the project it says that I can use the plugin directly from the console, AHA! So I fired up a PowerShell console in the Kudo portal of my web app, browsed to my plugin folder and ran:

php jekyll-export-cli.php > jekyll-export.zip

This showed an error message but I still got a zip-file containing a bunch of images and all my posts as markdown files! Woohoo! Some quick search-and-replace in the markdown and I had an OK stating point. I copied my newly migrated content to my new blog folder, compiled a new HTML-version by runnung hugo.exe and published it my storage account. And that was pritty much it. Since than I’ve been doing some minor tweeks like getting PowerShell syntax highlighting (kudos to Stuart Lang for the inspiration):

But that is another story… until then, happy blogging!

And if you haven’t set up your own blog yet, now there is no excuse this was really simple and everyone has something to share!