🌱Aadam's Garden


Search IconIcon to open search

Obsidian Publishing Workflow

Last updated Aug 22, 2022

By utilizing all the great and publicly available open-source tools, meticulously designing, and persevering despite the hardships, technical limitations, and lack of expertise, I’ve been able to automate my Obsidian publishing workflow. After 3 whole days of constant (and quite frankly back-breaking) development, I’m now able to update my site from within Obsidian with a single Hotkey. I’ll now break down how I’ve achieved this and how it’s all connected.

# Tools

# How it’s all connected

Obsidian Publishing Workflow 2022-08-22 22.08.30.excalidraw.svg

# Obsidian

My obsidian vault is backed up in a private GitHub repository. This has been the case from the start. This allows me to have a reliable, free, and private backup of all my notes. I can also revert to a previous time, if need be.

Obsidian Git Plugin allows me to either set an interval to automatically back up my vault or do it manually using a Hotkey. On each backup, it first performs pull (download from repo if any changes have been made there) and then push (upload all the changes to the GitHub repo).

# GitHub Action

Here’s the link to the actual configuration file, GH Action configuration file to automatically publish my Obsidian Vault using Quartz (github.com). On each successful push to the repository, a GitHub Action gets triggered. It has all the steps listed one after another to build and deploy the website.

# obsidian-export

Here’s a detailed overview of what obsidian-export does. It is a rust CLI written by Nick Groenen to process notes from obsidian.

It has several helpful features by default, such as:

To make it work for my particular workflow, I modified it to include the following features:

# hugo-obsidian

It scrapes all the links from vault and generates link and content indexes. These indexes are later used by Quartz to generate graph and to enable full-text search.

I’ve modified it to my liking as well:

# Cloudflare Pages

Whenever gh-pages branch is updated, a Cloudflare Pages deployment action gets triggered. It looks at the content in the gh-pages branch and deploys it to the web. I have to use this because GitHub Pages doesn’t work with Private Repo.

# Failed Experiments

# Netlify

First, I used Netlify to publish my site in the end, instead of Cloudflare Pages. But soon, I discovered a problem with that.

# Problem

Whenever I refreshed my page, the URL would instantly become lowercase. For example, if the URL was https://notes.aadam.dev/SBYNtPHqsTW9Ck1Kuoxsu, then after page reload, it would automatically turn into https://notes.aadam.dev/sbyntphqstw9ck1kuoxsu/.

This is a major issue, as this doesn’t guarantee that all the IDs will be unique now. Before, AbC and aBC would’ve been treated as two different entities, but with this bug, they would resort to a single entity, resulting in a naming collision.

Also, even though my page was being loaded, the graph at the end of the page wasn’t working. This is because it also expects the IDs to be case-sensitive. So, when the URL turns to lowercase, it isn’t able to find that ID.

# Solution

I spent a couple of hours trying to fix this problem. I wasn’t even sure where to look. There wasn’t much information about this on Hugo Forum, Stackoverflow, Google, etc.

At first, I thought that there’s some issue with Hugo and how I deploy it. I changed my GitHub Action workflow and tried different things. I tried moving the building process to Netlify instead of GitHub, but that had its own issues. I also tried moving to Vercel, but that didn’t work out either. I tried changing Hugo configuration files but still, no luck.

In the end, I came across an article which pinpointed the issue for me: Gotcha: Netlify Makes All Your Filenames Case-Insensitive · Jamie Tanna | Software Engineer (jvt.me). Lo and behold, it was Netlify all along. I was surprised because the website was working fine locally on my PC, but it was acting up when published.

Because of this, I moved my deployment workflow to Cloudflare Pages. Everything else is just the same, only the last part of the website deployment is shifted.