TechLifeWeb

TechLifeWeb rebuild


Published by 
Scott Kingery
 on 

I spent some free time over the last week or so rebuilding my site. I had moved to Pico CSS about a month ago because I wanted something more modern than I was using. I needed something simple enough that I could wrap my head around how it works and easily drop it in without too much fuss. I find CSS to be a bit of a mystery. If I hack on it long enough I can get things to a good spot but it doesn't come naturally and I'm no artist.

This week was all about the frontend. I've been using Obsidian as the editor of choice because it works with Markdown files natively. My site is made up of static HTML generated from markdown by Eleventy (11ty). I was using a Vault (Obsidian's word for where your files are stored) for my Personal notes and another Vault that housed all the markdown and asset files for my website. That has worked well but there is a lot of overlap. My brain had to keep track of what was in my personal notes and what was on the website. So, I decided I'd combine the two.

One huge advantage to using Obsidian as your frontend is the ability to use the Templater plugin. This lets me create a temple for a blog post and another for a garden page. It will even auto name and move the file to the correct folder.

I keep a Digital Garden on my site so my idea is that I will continue to flesh that out and merge some of the notes that were hidden in my personal notes over into the Digital Garden. One nice thing is that in my Obsidian vault, everything is indexed so if I do move a note from one folder to the other, it is easily found in my local repository.
What about private notes? The default folder in my Obsidian vault is NOT one of the public folders. This means I can edit a post or keep a private note and it won't get published until I move it to the right folder. Also, I have 11ty ignore certain folders at build time so nothing from there gets published. Additionally, it's not like I keep info that is that private in my Vault.

On the 11ty side, I took the opportunity to completely rewrite my .eleventy.js file. This is the core of 11ty that tells it what to include, which plugins and filters to use and what to simply pass through. It was a mess after a bunch of experimentation with different things. I also implemented photogabble's awesome plugin that adds wikilink and wikilink embed support with tracking of backlinks.. This makes using Obsidian as the front end even easier because making a link to another note is as simple as typing [[noteName]] and 11ty will render it correctly as a web link when the site is published. They wrote more about the plugin here: Adding Wiki Links to 11ty.

It will be interesting to see how this plays out. I've either over-complicated things for myself or made it easier to do my "digital gardening". Either way, it was fun to figure out.

Posted on: