Tech stack for this blog
So, the blog is started. To decide on the tech stack, I had the following points to match:
- I am familiar with hosting on GitHub Pages, therefore the site should be static, not using any server-side language nor database.
- For writing text, I'd like something simple and easy to use. Markdown with code snippet highlight should be fine.
- Overall solution should be simple to understand, easy to configure and preferably lightweight.
After some research, I decided to use Eleventy as a static site generator. It seems to match all my points. One huge pro for the 11ty is that had a base blog repository which I could fork and start using right away. It is pretty straightforward to use. Filing here and there, adjusting CSS, removing things I don't need, and voilà, the blog is ready. You are reading it right now.
Set-up quirks
Base-blog is a great starting point, still there were some quirks setting it up.
11ty path prefix
First, when GitHub workflow bundled into the base blog builds the site,
it uses /eleventy-base-blog/ directory by default and I wanted to serve it just from the root /.
To fix this, I had to adjust the pathprefix in the package.json:
-"build-ghpages": "npx @11ty/eleventy --pathprefix=/eleventy-base-blog/",
+"build-ghpages": "npx @11ty/eleventy --pathprefix=/",
Custom domain
Second, and it is not 11ty related, is how to set up custom subdomain in GitHub Pages.
The GitHub part is straightforward, just specify the branch to serve from (gh-pages if you use bundled workflow)
and the name of your custom domain (blog.srakvasa.com in my case).
What was not so straightforward is how to set up the DNS records in the domain provider.
Luckily, it is pretty easy in fact. So, I have 2 repositories one for main site and one for this blog.
The main site is called nut-neek.github.io and the blog is called xblog.
The DNS records should look the following:
| Type | Host | Value |
|---|---|---|
| A Record | @ | 185.199.108.153 |
| A Record | @ | 185.199.109.153 |
| A Record | @ | 185.199.110.153 |
| A Record | @ | 185.199.111.153 |
| CNAME | www | nut-neek.github.io. |
| CNAME | blog | nut-neek.github.io. |
First 5 records I already had for the main site. What was confusing to me is that the only thing I had to add on top was the last record.
No more A records, just one more CNAME record pointing to the SAME domain as www. Further routing seems to be done by GitHub itself based on the Pages setup.
GitHub Pages CNAME file
Now, the site is successfully setup on the GitHub Pages, and I am able to access it via browser.
However, I have noticed that after every push to the repository, the GitHub Pages built-in action pages build and deployment is resetting my domain from
blog.sarakvasa.com to sarakvasa.com/xblog which destroys the setup.
There are two ways to fix it described here.
I decided to go direct and just added CNAME file to the blog's public folder. The CNAME file should contain the domain name you want to use, in my case just blog.sarakvasa.com.
That`s how the last quirk was fixed.