This content originally appeared on phpied.com and was authored by Stoyan
Who amongst us has not created a blogging software of some fashion or another? I know I have, many times. My latest (joke-y) attempt was Lizzy.js. The desire to go into a writing mode and don't worry about anything else is always strong. Even a dead simple self-hosted WordPress is often too much. Just give me a markdown and leave me alone. However almost all of these attempts are eventually abandoned after a few hours of hacking.
Not anymore, thanks to AI.
Part 5
This post is another installment of the series dedicated to building sightread.org. Parts 1, 2, 3, 4.
In part 2 I showed my minimal build.js. I liked the idea so much that I used it again to build a simple blog for the app.
I think for my needs this is the simplest blog system, yet not lacking any feature I need. So far.
Files
blog/
--- bbuild.js # Build script (bb for blog-build)
--- src/
|--- _template.html # HTML template with inline CSS
|--- *.md # Blog posts (markdown with YAML for meta stuff)
--- img/ # Images referenced in posts
--- index.html # Generated index page
--- rss.xml # Generated RSS feed
--- {slug}/index.html # Generated post pages
Usage
node blog/bbuild.js # Build all posts node blog/bbuild.js new # Create new post interactively
Features
- Zero dependencies: custom markdown-to-HTML converter (supports headers, bold, italic, links, images, code blocks, lists, blockquotes). About 70 lines of code out of the total 300 for the
bbuild.js - YAML support for the meta stuff:
title,date,description, optionalimage - Minification: CSS via
lightningcss-cli, HTML viahtml-minifier-terser - RSS feed: auto-generated
rss.xml - Social sharing: Open Graph meta tags with automatic
og:image(uses the first image in a post or falls back to a default) - Native share button: conditionally rendered if the browser supports Web Share API, copy-pasta from Perfplanet Calendar
- SEO: canonical URLs, proper meta descriptions
- Dark mode: CSS respects
prefers-color-scheme - Speculation rules: prerendering for instant page loads. Which pairs naturally with...
- View transitions: use
@view-transitionto "swap" pages on navigation
Evolution
I didn't build everything in one sitting. First I added just one post. Then I remembered "oh, what about SEO and what about RSS?". But overall I think the whole thing took less time than just trying to figure out a template in any other off-the-shelf blogging system
- Initial release: a build script with a template, a markdown parser and the first post
- RSS generation
- Minification: added CSS and HTML minification via external tools. Using npx, same as the app
- More blog posts
- Social meta tags for SEO. Used my old blog post as guidance. It auto-extracts the first image from posts and uses that as the og:image.
- Image thumbnails: index page shows post thumbnails, a little too sparse otherwise
Brave new world
Isn't it? AI is amazing for silly little projects like this. I've always had more ideas than energy or motivation to finish them. Things, they are a-changing.
Let me leave you with a quote from a recent post that I read and that I really liked:
When hard parts become easy, the differentiator becomes love.
This content originally appeared on phpied.com and was authored by Stoyan
Stoyan | Sciencx (2026-01-24T22:20:22+00:00) Oops, I build.js’d it again. Retrieved from https://www.scien.cx/2026/01/24/oops-i-build-jsd-it-again/
Please log in to upload a file.
There are no updates yet.
Click the Upload button above to add an update.