The development of fmr.blog stemmed from the need for a personal digital space that would serve not only as a portfolio, but also as a hub for knowledge sharing, infrastructure experimentation and IT documentation. The site was designed from the outset to be an extremely lightweight, super-fast and easy-to-manage platform without relying on a traditional database.

🏗️ Architecture & Key Technologies

Rather than using a monolithic platform such as WordPress, this blog is built using a modern architectural approach (Jamstack):

Astro 5 (Static Site Generator): Chosen for its ability to generate pure static HTML without loading any built-in JavaScript (Zero-JS by default). This ensures near-instant page load times and is highly search engine optimised (SEO-friendly).
Node.js & NPM: Used as the local development runtime environment, a dependency package manager, and for the build process of static pages.
TypeScript: Provides strict typing (type-safety) for configurations, content schemas, and UI component properties.
Sveltia CMS: A modern alternative to Decap/Netlify CMS. Sveltia enables content management (Markdown) via a visual interface directly connected to a GitHub repository (Git-based CMS).
Cloudflare Pages & Functions: The entire site is deployed on Cloudflare’s edge network. Serverless functions (functions/oauth) handle GitHub OAuth authentication for the CMS without requiring an external backend server.
Vanilla CSS, Design Tokens & Google Fonts: Features pure CSS styling using the Forest Green colour variable (#4A7856), transparent effects (glassmorphism), the Inter and Outfit web fonts, and a light/dark mode toggle (Dark/Light Mode).
Zod Content Collections: Ensures the integrity of article and project data through strict schema validation during the build process.
Shiki & Giscus: Code syntax highlighting using Shiki github-dark, as well as an interactive commenting system based on GitHub Discussions via Giscus.
Astro Sitemap & RSS Integration: Automated generation of an XML Sitemap (sitemap-index.xml) for Google Search Console and an RSS Feed (/rss.xml) for news aggregators.

✨ Key Features

Some of the technical features implemented in this project include:

Glassmorphism Design & Dark Theme: The user interface (User Interface) is built using pure CSS with modern transparency effects (glassmorphism). The site also fully supports switching between light and dark modes (Dark/Light Mode).
GitHub-Based Comment System (Giscus): Utilises the GitHub Discussions feature as the comment engine. This choice was made because the blog’s readership consists largely of IT professionals, developers and infrastructure engineers who are already familiar with the GitHub ecosystem.
Integrated RSS Feed: Allows loyal readers and third-party aggregator applications to subscribe to articles without having to visit the site manually.
SEO & Performance: Achieves a maximum Lighthouse score thanks to the absence of bloat, dynamic metadata, and an automatic sitemap for Google Search Console.

🚀 Aims and Aspirations

As well as serving as a personal lab notebook, fmr.blog is aimed at anyone interested in exploring the world of IT. Through this blog, everything from troubleshooting and server documentation to experiments with Large Language Models (LLMs) will be shared openly so that it may benefit as many people as possible.