De Obsidian a la web
Este blog es una prueba viviente de que todavía programo por placer, cuando encuentro el tiempo.
Cuando decidí por enésima vez que debía escribir un blog, como parte de mis propósitos de año nuevo, pensé que no debería complicarme mucho la vida y, esta vez, solo escribir. Sin preocuparme por plataformas, por hosting, por tecnologías, etc. Al final, resultó todo lo contrario, pero más entretenido. Como llevo tiempo usando Obsidian para llevar mis notas y otras memorias, quise que mi blog también "viviera" en Obsidian, para poder escribir en cualquier momento con solo abrir la app desde la Mac o desde mi teléfono. Revisando soluciones existentes para publicar un subconjunto de notas como sitio web estático, ninguna me convenció. Entonces pensé que era el caso de uso perfecto para poner a prueba las capacidades de PicoJSX.
Este blog tiene su primera entrada fechada en enero de 2026, pero el blog en sí, el código, llevaba meses cocinándose en mis ratos libres, y de hecho, la mayoría de los cambios que he hecho en PicoJSX ha sido por bugs encontrados mientras hacia este blog.
El código de este blog es muy a la medida, nunca lo hice pensando en que fuera genérico, por lo que no estoy seguro de que este sea una de las cosas que voy a compartir próximamente, pero al menos si puedo presumirles algunas de las cosillas que le puse:
- Generación estática: Solo tengo que ejecutar
bun run buildy el script toma mis notas de Obsidian y genera todas las páginas estáticas, las traducciones, los índices, etc. En unos segundos, el sitio completo queda generado. - Soporte bilingüe: Tengo la libertad de escribir en español o en inglés, establecer el idioma como parte del frontmatter de la nota en Obsidian, y el script se encarga de generar la versión en el otro idioma utilizando OpenRouter y un LLM barato.
- Diseño sin esfuerzo: Incluyendo tema oscuro, gracias a picocss. (elegido por su filosofía pero también porque el nombre se parece al que yo uso en mis proyectos).
- SPA: El sitio entero es una SPA gracias a PicoJSX. Cada URL es generada de manera estática, pero al cargarse, PicoJSX es "hidratado" y la navegación entonces ocurre via AJAX.
Por qué Obsidian?
Ya uso Obsidian para mis notas. Es Markdown de toda la vida, la aplicación genera los enlaces entre mis páginas automáticamente y gracias a iCloud puedo escribir desde donde sea ya que tengo mi Bóveda abierta en mi telefono, iPad y Macbook.
Cómo funciona
La estructura del blog es bastante simple.
Todas las entradas y páginas viven como notas dentro de mi vault de Obsidian. Cada nota tiene un pequeño bloque de frontmatter donde indico cosas como el idioma, el título y la fecha. El script de build recorre la carpeta del sitio dentro del vault, convierte el Markdown a HTML y utiliza PicoJSX para renderizar cada página completa (layout, header, sidebar, contenido) a HTML estático.
Durante ese proceso también se generan automáticamente varias cosas:
- las páginas índice, de archivo y de categorías
- la resolución de wiki-links de Obsidian a URLs del sitio
- las traducciones, generadas por un LLM
- el sitemap y feeds RSS
El resultado final es simplemente un conjunto de archivos HTML estáticos que puedo subir a cualquier hosting.
¿Por qué no usar algo existente?
La respuesta honesta es que probablemente habría sido más rápido aprender alguna de las herramientas que ya existen para publicar desde Obsidian. Pero este blog también terminó siendo un buen pretexto para probar ideas en PicoJSX y para construir exactamente la experiencia que quería para escribir. En lugar de adaptar mi forma de escribir a una herramienta existente, decidí adaptar la herramienta a mi forma de escribir.
Al final terminé construyendo un pequeño CMS para evitar tener que aprender a usar otro. Otro de mis sinsentidos, sin duda. Pero también fue divertido, y ahora escribir aquí es tan simple como abrir Obsidian y empezar a escribir. Y ese era el objetivo desde el principio.
Y así fue cómo estuve entretenido, esforzándome durante varios meses para construir un blog "sin esfuerzo".