☰ Menu

This article is an automatic translation of an article originally written in Spanish. View original article

From Obsidian to the Web

This blog is living proof that I still code for pleasure, when I find the time.

When I decided for the umpteenth time that I should write a blog, as part of my New Year's resolutions, I thought I shouldn't complicate my life too much and, this time, just write. Without worrying about platforms, hosting, technologies, etc. In the end, it turned out the opposite, but more fun. Since I've been using Obsidian for a while to manage my notes and other memories, I wanted my blog to also "live" in Obsidian, so I could write anytime by just opening the app on my Mac or phone. Reviewing existing solutions to publish a subset of notes as a static website, none convinced me. So I thought it was the perfect use case to test PicoJSX's capabilities.

This blog has its first entry dated January 2026, but the blog itself, the code, had been simmering for months in my free time, and in fact, most of the changes I've made to PicoJSX have been for bugs found while making this blog.

The code for this blog is very custom-made; I never intended it to be generic, so I'm not sure this is something I'll share soon, but at least I can boast about some of the features I added:

  1. Static generation: I just have to run bun run build and the script takes my Obsidian notes and generates all the static pages, translations, indexes, etc. In a few seconds, the entire site is generated.
  2. Bilingual support: I have the freedom to write in Spanish or English, set the language as part of the frontmatter in the Obsidian note, and the script handles generating the version in the other language using OpenRouter and a cheap LLM.
  3. Effortless design: Including dark theme, thanks to picocss. (chosen for its philosophy but also because the name resembles the one I use in my projects).
  4. SPA: The entire site is a SPA thanks to PicoJSX. Each URL is generated statically, but when loaded, PicoJSX is "hydrated" and navigation then happens via AJAX.

Why Obsidian?

I already use Obsidian for my notes. It's good old Markdown, the app automatically generates links between my pages, and thanks to iCloud, I can write from anywhere since I have my Vault open on my phone, iPad, and MacBook.

How it works

The blog structure is quite simple.

All entries and pages live as notes inside my Obsidian vault. Each note has a small frontmatter block where I indicate things like the language, title, and date. The build script goes through the site folder inside the vault, converts Markdown to HTML, and uses PicoJSX to render each complete page (layout, header, sidebar, content) to static HTML.

During that process, several things are also generated automatically:

  • index pages, archive, and categories
  • resolution of Obsidian wiki-links to site URLs
  • translations, generated by an LLM
  • sitemap and RSS feeds

The final result is simply a set of static HTML files that I can upload to any hosting.

Why not use something existing?

The honest answer is that it probably would have been faster to learn one of the tools that already exist for publishing from Obsidian. But this blog also ended up being a good excuse to test ideas in PicoJSX and to build exactly the writing experience I wanted. Instead of adapting my writing style to an existing tool, I decided to adapt the tool to my writing style.

In the end, I built a small CMS to avoid having to learn another one. Another of my nonsense, no doubt. But it was also fun, and now writing here is as simple as opening Obsidian and starting to write. And that was the goal from the beginning.

And that's how I stayed entertained, working hard for several months to build an "effortless" blog.