Merge pull request #9 from andwati/fix/ga-measurement-id

Restore GA measurement ID

.cspell/words.txt

@@ -0,0 +1,100 @@
+# Project dictionary for content/**/*.md (names, tools, jargon)
+Andwati
+angr
+archlinux
+Ashish
+bashfu
+binarysith
+binwalk
+bmod
+bruteforcing
+chall
+ciphertexts
+cmark
+comming
+disassemblers
+diskchal
+distros
+dlresolve
+dnsmasq
+dokploy
+Einherjar
+exiftool
+expecially
+Fastbin
+Garuda
+Geospatial
+Ghidra
+Gitaly
+Gitea
+Hashnode
+Heartbleed
+Heredocs
+homoglyphs
+honggfuzz
+hotspot
+Hotspots
+IDOR
+jadx
+Kernighan
+keyserver
+Kleppmann
+libc
+malloc
+MINECRAFTISFUN
+mmuctf
+mockingspectre
+MVCC
+Namecheap
+Niki
+Noam
+openpgp
+Parmar
+Pgadget
+Pipx
+Pwntools
+RDBMS
+RDBMSs
+Revealme
+Riccomini
+Ritchie
+Sandboxing
+seccomp
+Shazeer
+shellcode
+Shellshock
+Sidekiq
+Sigreturn
+SIGSEGV
+SNMP
+SROP
+staticnoise
+stego
+strikethrough
+subresource
+Sussman
+syscalls
+Tcache
+tera
+tshark
+unbootable
+Userland
+Vaswani
+vuejs
+Wireshark
+
+# Review: possible typos or intentional wordplay in existing posts (kept so checks pass)
+Ledilect
+Metawork
+iddleness
+thatsss
+trol
+whyyy
+
+# Intentional homoglyph text in the mmuctf2025 writeup
+cοｍfoｒt
+doоrs
+tｈis
+соrｎｅr
+ｇｉrl
+Ｊobleｓs

.dockerignore

@@ -0,0 +1,12 @@
+node_modules
+.next
+.git
+.gitignore
+.env*
+!.env.example
+Dockerfile
+.dockerignore
+README.md
+npm-debug.log*
+*.md
+!content/**/*.md

.gitignore

@@ -1 +1,41 @@
-/public
+# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
+
+# dependencies
+/node_modules
+/.pnp
+.pnp.*
+.yarn/*
+!.yarn/patches
+!.yarn/plugins
+!.yarn/releases
+!.yarn/versions
+
+# testing
+/coverage
+
+# next.js
+/.next/
+/out/
+
+# production
+/build
+
+# misc
+.DS_Store
+*.pem
+
+# debug
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+.pnpm-debug.log*
+
+# env files (can opt-in for committing if needed)
+.env*
+
+# vercel
+.vercel
+
+# typescript
+*.tsbuildinfo
+next-env.d.ts

.husky/pre-commit

@@ -0,0 +1 @@
+pnpm exec lint-staged

.prettierignore

@@ -0,0 +1,4 @@
+# Prettier only formats writing/pages. Biome owns code, CSS and JSON.
+*
+!content/
+!content/**

.prettierrc.json

@@ -0,0 +1,5 @@
+{
+  "proseWrap": "preserve",
+  "embeddedLanguageFormatting": "off",
+  "overrides": [{ "files": "*.md", "options": { "printWidth": 100 } }]
+}

.vscode/extensions.json

@@ -0,0 +1,7 @@
+{
+  "recommendations": [
+    "biomejs.biome",
+    "esbenp.prettier-vscode",
+    "streetsidesoftware.code-spell-checker"
+  ]
+}

.vscode/settings.json

@@ -0,0 +1,12 @@
+{
+  "editor.formatOnSave": true,
+  "editor.defaultFormatter": "biomejs.biome",
+  "[markdown]": {
+    "editor.defaultFormatter": "esbenp.prettier-vscode",
+    "editor.wordWrap": "on"
+  },
+  "prettier.enable": true,
+  "cSpell.language": "en",
+  "cSpell.enabledFileTypes": { "markdown": true },
+  "editor.codeActionsOnSave": { "source.fixAll.biome": "explicit" }
+}

AGENTS.md

@@ -0,0 +1,9 @@
+<!-- BEGIN:nextjs-agent-rules -->
+
+# This is NOT the Next.js you know
+
+This version has breaking changes — APIs, conventions, and file structure may all differ from your training data. Read the relevant guide in `node_modules/next/dist/docs/` (resolved from this file's directory; in monorepos the `next` package may not be visible from the repo root) before writing any code. Heed deprecation notices.
+
+This block is written and re-added by `next dev` — verify at `node_modules/next/dist/server/lib/generate-agent-files.js`. Removing it from a diff only re-creates the uncommitted change; committing it with your work keeps the tree clean.
+
+<!-- END:nextjs-agent-rules -->

CLAUDE.md

@@ -0,0 +1 @@
+@AGENTS.md

Dockerfile

@@ -0,0 +1,30 @@
+# syntax=docker/dockerfile:1
+# Static site: build with Next (output: export), serve with static-web-server.
+#   docker build -t andwati-site \
+#     --build-arg PUBLIC_UMAMI_SCRIPT_URL=... --build-arg PUBLIC_UMAMI_WEBSITE_ID=... .
+
+FROM node:24-alpine AS deps
+ENV PNPM_HOME=/pnpm PATH=/pnpm:$PATH
+RUN corepack enable
+WORKDIR /app
+COPY package.json pnpm-lock.yaml pnpm-workspace.yaml ./
+RUN --mount=type=cache,id=pnpm,target=/pnpm/store \
+    pnpm install --frozen-lockfile
+
+FROM node:24-alpine AS build
+ENV PNPM_HOME=/pnpm PATH=/pnpm:$PATH NEXT_TELEMETRY_DISABLED=1
+RUN corepack enable
+WORKDIR /app
+COPY --from=deps /app/node_modules ./node_modules
+COPY . .
+# Umami is read at build time (pages are prerendered), so pass these as build args.
+ARG PUBLIC_UMAMI_SCRIPT_URL
+ARG PUBLIC_UMAMI_WEBSITE_ID
+ENV PUBLIC_UMAMI_SCRIPT_URL=$PUBLIC_UMAMI_SCRIPT_URL \
+    PUBLIC_UMAMI_WEBSITE_ID=$PUBLIC_UMAMI_WEBSITE_ID
+RUN pnpm build
+
+FROM ghcr.io/static-web-server/static-web-server:2
+COPY --from=build /app/out /public
+COPY sws.toml /sws.toml
+EXPOSE 80

Makefile

@@ -1,19 +0,0 @@
-#!/usr/bin/make -f
-
-.PHONY: all build
-
-BUILD_DIR := public
-
-all: clean build
-
-clean:
-	rm -rfd ./$(BUILD_DIR)
-
-build:
-	zola build
-
-serve:
-	zola serve
-
-update-zola:
-	@./bin/update-zola

README.md

@@ -1,8 +1,49 @@
-# TODO
+# andwati.com
 
-- [ ] create new post script
-- [ ] add google analytics
-- [ ] move goatcounter config to config.toml
-- [ ] modularize open graph(og) tags
-- [ ] add favicon to config
-- [ ] add latex support
+Personal site: about, writing, reading and portfolio. Next.js (App Router) with Tailwind CSS v4, exported as static files and served by [static-web-server](https://static-web-server.net/).
+
+## Develop
+
+```sh
+pnpm install
+pnpm dev
+```
+
+## Content
+
+Everything lives in `content/` as markdown with YAML frontmatter:
+
+- `content/about.md` is the home page
+- `content/writing/*.md` are posts (`title`, `description`, `date`, `tags`)
+- `content/reading/*.md` are books and papers
+- `content/portfolio/*.md` are projects
+
+Covers go in `public/covers/<slug>.jpg`. Math (`$...$`), code fences, callouts and YouTube embeds are supported.
+
+## Checks
+
+```sh
+pnpm check           # Biome (code) + Prettier and cspell (content)
+pnpm format:content  # format markdown
+```
+
+A pre-commit hook runs these on staged files. Add project words to `.cspell/words.txt`.
+
+## Analytics
+
+Umami is loaded when both variables are set **at build time**:
+
+```
+PUBLIC_UMAMI_SCRIPT_URL=https://analytics.andwati.com/script.js
+PUBLIC_UMAMI_WEBSITE_ID=...
+```
+
+## Deploy
+
+```sh
+docker build -t andwati-site \
+  --build-arg PUBLIC_UMAMI_SCRIPT_URL=... \
+  --build-arg PUBLIC_UMAMI_WEBSITE_ID=... .
+```
+
+The image builds the static export (`out/`) and serves it with `sws.toml` (security headers, clean URLs, `.well-known`). In Dokploy, pass the two Umami variables as build args.

bin/update-zola

@@ -1,62 +0,0 @@
-#!/usr/bin/env sh
-
-set -e
-
-: ${ZOLA_REPO='https://github.com/getzola/zola'}
-: ${ZOLA_INSTALL_DIR="${HOME}/.cargo/bin"}
-
-# Helpers for ANSI color and logging.
-name="$(basename $0)"; esc=''; reset="${esc}[0m"
-red() { local string="${1}"; echo "${esc}[31m${string}${reset}"; }
-yellow() { local string="${1}"; echo "${esc}[33m${string}${reset}"; }
-green() { local string="${1}"; echo "${esc}[32m${string}${reset}"; }
-blue() { local string="${1}"; echo "${esc}[34m${string}${reset}"; }
-magenta() { local string="${1}"; echo "${esc}[35m${string}${reset}"; }
-log() { local string="${1}"; echo "[$(blue $name)] ${string}"; }
-
-prompt_for_update() {
-    local current="${1}"
-    local latest="${2}"
-
-    [ -n "${current}" ] \
-        && installed="You're using Zola $(yellow $current)" \
-        || installed="Zola is $(red 'not installed')"
-
-    log "${installed}, but $(magenta $latest) is available."
-
-    # Prompt for an update. Exit the entire script if declined.
-    read -p "$(log "Would you like to install Zola $(magenta $latest)? [y/N]: ")" answer
-    case $answer in
-        [Yy]*) log "Downloading Zola $(magenta $latest) from GitHub." ;;
-        [Nn]*|*) log $(red "Aborted!"); exit ;;
-    esac
-}
-
-install_zola() {
-    local version="${1}"
-    local download_url="${ZOLA_REPO}/releases/download/${version}/zola-${version}-x86_64-unknown-linux-gnu.tar.gz"
-
-    curl --progress-bar --location $download_url | tar --gunzip --extract --directory=$ZOLA_INSTALL_DIR --file -
-}
-
-update_zola() {
-    # Find the current Zola version (if any).
-    [ -n "$(which zola 2> /dev/null)" ] && current_version=$(zola --version | awk '{print "v"$2}')
-
-    # Find the latest available Zola version. Use --refs to avoid listing
-    # annotated commit objects that include the dereference syntax '^{}'.
-    # Find more background at https://stackoverflow.com/a/15472310.
-    local latest_version=$(git ls-remote --tags --refs $ZOLA_REPO | # Fetch remote tags.
-                           sort -t '/' -k 3 -V |                    # Sort them by version.
-                           tail -n 1 |                              # Take the latest one.
-                           awk -F / '{print $3}')                   # Return only the tag.
-
-    if [ "${current_version}" != "${latest_version}" ]; then
-        prompt_for_update "${current_version}" "${latest_version}"
-        install_zola "${latest_version}"
-    fi
-
-    log "You're using Zola $(magenta $latest_version). $(green "Everything is up-to-date!")"
-}
-
-update_zola

biome.json

@@ -0,0 +1,39 @@
+{
+  "$schema": "https://biomejs.dev/schemas/2.4.2/schema.json",
+  "vcs": {
+    "enabled": true,
+    "clientKind": "git",
+    "useIgnoreFile": true
+  },
+  "files": {
+    "ignoreUnknown": true,
+    "includes": ["**", "!node_modules", "!.next", "!dist", "!build"]
+  },
+  "formatter": {
+    "enabled": true,
+    "indentStyle": "space",
+    "indentWidth": 2
+  },
+  "css": {
+    "parser": {
+      "tailwindDirectives": true
+    }
+  },
+  "linter": {
+    "enabled": true,
+    "rules": {
+      "recommended": true
+    },
+    "domains": {
+      "next": "recommended",
+      "react": "recommended"
+    }
+  },
+  "assist": {
+    "actions": {
+      "source": {
+        "organizeImports": "on"
+      }
+    }
+  }
+}

config.toml

@@ -1,23 +0,0 @@
-title = "mockingspectre"
-description = "mockingspectre"
-base_url = "https://andwati.xyz"
-minify_html = true
-compile_sass = true
-generate_feeds = true
-feed_filenames = ["rss.xml"]
-taxonomies = [{ name = "tags", feed = false }]
-
-[markdown]
-highlight_code = true
-highlight_theme = "gruvbox-dark"
-
-[link_checker]
-skip_prefixes = [""]
-skip_anchor_prefixes = ["https://github.com/"]
-
-[extra]
-author = "Ian Andwati"
-meta = [
-    { property = "og:title", content = "the og title" },
-    { property = "og:description", content = "the og description" },
-]

content/_index.md

@@ -1,6 +0,0 @@
-+++
-title = "0xmockinspectre"
-description = "offending binaries"
-+++
-
- spend my free time working on hobby projects and sometimes I write about my experiences. In particular, I enjoy learning about offensive security and reverse engineering.

content/about.md

@@ -0,0 +1,33 @@
+---
+title: "About"
+---
+
+# Ian Andwati
+
+## Some things about me:
+
+- I'm a software engineer by day. Cyber Security is my hobby and my side work.
+- I have a degree in computer science, and most of what I do for fun still centres on it.
+- I'm the captain of the [**binarysith**](https://ctftime.org/team/379200) CTF team. I play CTFs on the weekends under the alias **mockingspectre**.
+- I like infrastructure-level software: the code that other code runs on.
+- I write essays on software development, from personal experience to opinion pieces (with varying degrees of "success"). The blog has been going since 2021 and has moved around a lot: different domains, Medium, dev.to, Hashnode. This site is where I keep the originals.
+
+## Some things I'm interested in:
+
+- The intersection of software engineering and cyber security.
+- Low-level programming, because it's where performance and security meet.
+- Distributed systems and performance at scale.
+- Compiler design.
+- Database internals.
+- Reading, fiction and non-fiction alike, especially the classics.
+- Art, history and science.
+
+Check out my [reading](/reading), [writing](/writing) and [portfolio](/portfolio).
+
+### PGP
+
+For anything sensitive, you can reach me encrypted.
+
+- Fingerprint: `AD58 AAB7 A20D 8523 CBF5  9A79 1F20 FED0 AA05 B0DA`
+- Public key: [/.well-known/pgp-key.txt](/.well-known/pgp-key.txt)
+- Also on: [keys.openpgp.org](https://keys.openpgp.org/search?q=AD58AAB7A20D8523CBF59A791F20FED0AA05B0DA) and [keyserver.ubuntu.com](https://keyserver.ubuntu.com/pks/lookup?op=vindex&search=0xAD58AAB7A20D8523CBF59A791F20FED0AA05B0DA)

content/archive/_index.md

@@ -1,4 +0,0 @@
-+++
-sort_by = "date"
-template= "archive.html"
-+++

content/contact.md

@@ -1,6 +0,0 @@
-+++
-title = "Contact"
-description = "Let's get in touch."
-+++
-
- spend my free time working on hobby projects and sometimes I write about my experiences. In particular, I enjoy learning about offensive security and reverse engineering.

content/portfolio/example-project.md

@@ -0,0 +1,11 @@
+---
+title: "Example Project"
+description: "Placeholder portfolio entry establishing the schema."
+role: "Author"
+dateStart: "2026-01-01"
+outcome: "Established the portfolio content schema."
+links:
+  - label: "Source"
+    url: "https://github.com/andwati"
+tags: ["placeholder"]
+---

content/posts/_index.md

@@ -1,7 +0,0 @@
-+++
-title = "Posts"
-template = "posts.html"
-page_template = "post.html"
-sort_by = "date"
-insert_anchor_links = "left"
-+++

content/posts/file-over-app.md

@@ -1,15 +0,0 @@
-+++
-title = "File over app"
-description = "Take control of your artifacts"
-author = "mockingspectre"
-draft = true
-date = 2023-12-18
-[taxonomies]
-tags = ["obsidian", "entropy", "notes"]
-+++
-
-Take control of your artifacts
-
-In my endless endevours to find the perfect note taking app led me to obsidian,  a note taking software that uses markdown files as the file format. All software is ephemereal in nature and yoour artifacts need to survive the decline of your favorite app. The files you create should be available to you and shouldt rrequire specialized software to access.
-
-Your data shouldt be locked behind a paywall or an authentication system that is not under your control.

content/posts/inertia.md

@@ -1,20 +0,0 @@
-+++
-title = "cognitive inertia"
-description = "inertia"
-author = "mockingspectre"
-date = 2025-02-26
-[taxonomies]
-tags = ["cognition"]
-+++
-
-Staring at the void
-
-Cognitive inertia is the reason changing our habits can be difficult. If you want to overcome inertia you have to apply a force. I consider myself an eternal student, who is ready to learn anything, or so I thought. It happened but I had not noticed, I had stopped moving forward.
-
-## Metawork
-
-I will define this as the things we do before getting the "real" work doe. Its  things like choosing the best IDE or text editor, setting up your coding environment, choosing the best note taking app, or even the 'best' operating system. They are the prerequisites of the actual work.
-
-I had been stuck on this loop, always trying to craft the perfect workflow. Setting up the best personalized linux distro, switching note taking apps, trying out multiple layouts, stylings and technologies for my blog, the list is endless.
-
-All of these metawork took more time thn the actual work; building, active learning and writing. Im going to stop all of these and start doing the important stuff.

content/reading/attention-is-all-you-need.md

@@ -0,0 +1,11 @@
+---
+title: "Attention Is All You Need"
+kind: "paper"
+authors: ["Ashish Vaswani", "Noam Shazeer", "Niki Parmar"]
+url: "https://arxiv.org/abs/1706.03762"
+coverImage: "/covers/attention-is-all-you-need.jpg"
+rating: 5
+status: "read"
+dateFinished: "2026-02-03"
+tags: ["machine-learning", "papers"]
+---

content/reading/designing-data-intensive-applications-2nd-edition.md

@@ -0,0 +1,10 @@
+---
+title: "Designing Data-Intensive Applications, 2nd Edition"
+kind: "book"
+authors: ["Martin Kleppmann", "Chris Riccomini"]
+url: "https://www.oreilly.com/library/view/designing-data-intensive-applications/9781098119058/"
+coverImage: "/covers/designing-data-intensive-applications-2nd-edition.webp"
+rating: 5
+status: "reading"
+tags: ["distributed-systems"]
+---

content/reading/structure-and-interpretation-of-computer-programs.md

@@ -0,0 +1,10 @@
+---
+title: "Structure and Interpretation of Computer Programs"
+kind: "book"
+authors: ["Harold Abelson", "Gerald Jay Sussman"]
+coverImage: "/covers/structure-and-interpretation-of-computer-programs.jpg"
+rating: 5
+status: "read"
+dateFinished: "2026-01-20"
+tags: ["computer-science", "programming"]
+---

content/writing/a-fresh-coat-of-paint.md

@@ -1,11 +1,9 @@
-+++
-title = "A Fresh Coat Of Paint"
-description = "Migrating to Zola"
-author = "mockigspectre"
-date = 2023-08-24
-[taxonomies]
-tags = ["zola", "blog", "tera", "rust"]
-+++
+---
+title: "A Fresh Coat Of Paint"
+description: "Migrating to Zola"
+date: "2023-08-24"
+tags: ["zola", "blog", "tera", "rust"]
+---
 
 Using Zola as my preferred static site generator
 
@@ -54,4 +52,4 @@ I improved on it by adding an archive page, pagination, a comment system, and Go
 
 The site is a work in progress and is far from polished. I plan on implementing a newsletter to notify readers of new posts. The site is primarily a dark theme, in the future I'll also add theme toggling and maybe different palettes.
 
-You can subscribe to the site's RSS feed at [https://andwati.xyz/rss.xml](https://andwati.xyz/rss.xml).
+You can subscribe to the site's RSS feed at [https://andwati.com/rss.xml](https://andwati.com/rss.xml).

content/writing/from-c-to-machine-code.md

@@ -0,0 +1,322 @@
+---
+title: "From C to Machine Code: What Actually Runs"
+description: "Before diving into how to break a program, we need to understand what the computer is actually executing"
+date: "2026-04-08"
+tags: ["assembly", "rev", "pwn"]
+---
+
+<div class="youtube"><iframe src="https://www.youtube-nocookie.com/embed/KbH239zvDtM" title="YouTube video" loading="lazy" allowfullscreen></iframe></div>
+
+Before diving into how to break a program, we need to understand what the computer is actually executing. When you write a C program, the processor doesn't understand a single line of it. The C language exists for _our_ benefit, allowing us to write logic without having to manually shuffle bits around in the processor.
+
+To bridge this gap, we use a compiler (like `GCC`), which translates our human-readable C code into machine code—raw binary instructions. Assembly language is simply the human-readable representation of that machine code.
+
+Because we usually don't have the original C source code when analyzing malware or playing a CTF, we are forced to read the assembly. (Though tools like Ghidra can try to decompile assembly back into C-like pseudocode to save us from staring at assembly instructions all day).
+
+Let's look at what a basic `printf("Hello World!");` program actually turns into.
+
+```c
+#include <stdio.h>
+
+int main(){
+ printf("hello world\n");
+ return 0;
+}
+```
+
+We will compile the hello world C program, then dump the assembly in Intel syntax(it defaults to AT&T syntax, a cancer).
+
+```sh
+gcc -o hello hello.c && objdump -d -M intel hello | grep -A 15 "**<main>:**"
+```
+
+<br>
+
+```asm
+0000000000001139 <main>:
+    1139:       55                      push   rbp
+    113a:       48 89 e5                mov    rbp,rsp
+    113d:       48 8d 05 c0 0e 00 00    lea    rax,[rip+0xec0]        # 2004 <_IO_stdin_used+0x4>
+    1144:       48 89 c7                mov    rdi,rax
+    1147:       e8 e4 fe ff ff          call   1030 <puts@plt>
+    114c:       b8 00 00 00 00          mov    eax,0x0
+    1151:       5d                      pop    rbp
+    1152:       c3                      ret
+
+Disassembly of section .fini:
+
+0000000000001154 <_fini>:
+    1154:       48 83 ec 08             sub    rsp,0x8
+    1158:       48 83 c4 08             add    rsp,0x8
+    115c:       c3                      ret
+
+```
+
+Notice how different this looks from C. The processor executes different instruction sets depending on its architecture. The two most common architectures you will encounter are 32-bit (x86) and 64-bit (x86_64 or just x64/AMD64/Intel 64).
+
+## **The Processor's Workbench: Registers**
+
+To process data rapidly, the CPU doesn't want to constantly reach all the way out to your system's RAM. Instead, it uses registers—extremely fast, temporary storage buckets located directly on the processor.
+
+Here are the critical x64 registers you need to know:
+
+- **`rip` (Instruction Pointer):** The most important register for exploitation. It points to the exact memory address of the _next_ instruction the CPU is supposed to execute.
+- **`rsp` (Stack Pointer):** Points to the very top of your current stack frame.
+- **`rbp` (Base Pointer):** Points to the bottom of your current stack frame.
+
+### **General Purpose Registers & Calling Conventions**
+
+There are also general-purpose registers (`rax`, `rbx`, `rcx`, `rdx`, `rsi`, `rdi`, and `r8` through `r15`). While they can be used for general math and data storage, they have strict roles when functions are called.
+
+In x64 Linux, when a function is called, the arguments are passed directly into registers in this specific order:
+
+1. `rdi` (First argument)
+2. `rsi` (Second argument)
+3. `rdx` (Third argument)
+4. `rcx` (Fourth argument)
+5. `r8` (Fifth argument)
+6. `r9` (Sixth argument)
+
+<aside class="callout callout-note">
+
+In older x86 32-bit binaries, arguments aren't passed in registers at all; they are pushed onto the stack. When a function finishes and returns a value, that return value is almost always placed in the **`rax`** register (or `eax` in 32-bit).
+
+</aside>
+
+### **Register Sizes and "Words"**
+
+Registers have different sizes depending on the architecture, and you can reference smaller chunks of a larger register. In binary exploitation, you'll frequently see data referred to by size:
+
+**Word:** 2 bytes
+
+**Dword (Double Word):** 4 bytes
+
+**Qword (Quad Word):** 8 bytes
+
+Here is how x64 registers break down into smaller accessible chunks:
+
+| 8-Byte (Qword)[64 bit] | Lower 4-Bytes (Dword)[lower 32 bits] | Lower 2-Bytes (Word)[lower 16 bits] | Lower 1-Byte[lower 8 bits] |
+| :--------------------- | :----------------------------------- | :---------------------------------- | :------------------------- |
+| rax                    | eax                                  | ax                                  | al                         |
+| rbx                    | ebx                                  | bx                                  | bl                         |
+| rcx                    | ecx                                  | cx                                  | cl                         |
+| rdx                    | edx                                  | dx                                  | dl                         |
+| rdi                    | edi                                  | di                                  | dil                        |
+| rsi                    | edi                                  | si                                  | sil                        |
+| rsp                    | esp                                  | sp                                  | spl                        |
+| rbp                    | ebp                                  | bp                                  | bpl                        |
+| rip                    | eip                                  | -                                   | -                          |
+| r8                     | r8d                                  | r8w                                 | r8b                        |
+| r9                     | r9d                                  | r9w                                 | r9b                        |
+| r10                    | r10d                                 | r10w                                | r10b                       |
+| r11                    | r11d                                 | r11w                                | r11b                       |
+| r12                    | r12d                                 | r12w                                | r12b                       |
+| r13                    | r13d                                 | r13w                                | r13b                       |
+| r14                    | r14d                                 | r14w                                | r14b                       |
+| r15                    | r15d                                 | r15w                                | r15b                       |
+
+<br>
+<p>If you are dealing with a 32-bit (x86) binary, the 8-byte 'R' registers don't exist. The largest buckets you have are the 4-byte 'E' registers (`eax`, `ebp`, etc.).</p>
+
+## **The Stack**
+
+The stack is a segment of memory heavily used during execution. It's primarily used to store local variables, keep track of function calls, and manage control flow. It operates as a LIFO (Last-In, First-Out) structure—meaning you can only add (push) to the top of it, and remove (pop) from the top of it.
+
+The boundaries of the current stack space are tracked by `rbp` (the base) and `rsp` (the top). When you declare a local variable in C, like `int x = 5;`, the program allocates space for it on the stack.
+
+Consider stack.c
+
+```c
+
+#include<stdio.h>
+
+int main() {
+
+  int x = 5;
+
+  puts("hi");
+
+}
+
+```
+
+Compile this with the command:
+
+```sh
+gcc -o stack stack.c && objdump -d -M intel stack | grep -A 15 "<main>:"
+```
+
+```asm
+0000000000001139 <main>:
+
+    1139:       55                      push   rbp
+
+    113a:       48 89 e5                mov    rbp,rsp
+
+    113d:       48 83 ec 10             sub    rsp,0x10
+
+    1141:       c7 45 fc 05 00 00 00    mov    DWORD PTR [rbp-0x4],0x5
+
+    1148:       48 8d 05 b5 0e 00 00    lea    rax,[rip+0xeb5]        # 2004 <_IO_stdin_used+0x4>
+
+    114f:       48 89 c7                mov    rdi,rax
+
+    1152:       e8 d9 fe ff ff          call   1030 <puts@plt>
+
+    1157:       b8 00 00 00 00          mov    eax,0x0
+
+    115c:       c9                      leave
+
+    115d:       c3                      ret
+
+Disassembly of section .fini:
+
+0000000000001160 <_fini>:
+
+    1160:       48 83 ec 08             sub    rsp,0x8
+
+```
+
+<br>
+
+In your output, you'll see an instruction moving the value `0x5` into a memory location relative to the base pointer, usually something like `[rbp-0x4]`. That is your local variable resting on the stack.
+
+## **The Heap**
+
+We will just do an overview of this section. It can get quite complex very fast. We will eventually cover them in future articles.
+
+If the stack is the CPU’s fast, tightly organized workbench, the heap is the massive, slightly chaotic warehouse out back.
+
+The stack is great for small, temporary variables, but it has severe limitations: it is relatively small, and you must know exactly how much space you need at compile time. What if you want to load a 10MB image file? Or what if you are accepting user input and you don't know if the user will type 10 characters or 10,000?
+
+For dynamic, large, or unpredictable data, we use the **Heap**.
+
+Unlike the stack, which the CPU manages automatically by just moving the `rsp` register up and down, the heap is entirely manual. The programmer must explicitly ask the operating system for a chunk of memory, and more importantly, they must explicitly give it back when they are done.
+
+In C, this is done using the `malloc()` (memory allocate) and `free()` functions.
+
+Consider heap.c
+
+```c
+#include <stdlib.h>
+#include <string.h>
+
+int main() {
+    // Ask the warehouse for 64 bytes of space
+    char *buffer = (char *)malloc(64);
+
+    // Put some data into that space
+    strcpy(buffer, "hello heap");
+
+    // Give the space back to the warehouse
+    free(buffer);
+
+    return 0;
+}
+
+```
+
+Now we do the necessary:
+
+```sh
+gcc -o heap heap.c && objdump -d -M intel heap | grep -A 20 "<main>:"
+
+```
+
+<br>
+
+```asm
+0000000000001149 **<main>:**
+   1149:       55                      push   rbp
+   114a:       48 89 e5                mov    rbp,rsp
+   114d:       48 83 ec 10             sub    rsp,0x10
+   1151:       bf 40 00 00 00          mov    edi,0x40
+   1156:       e8 e5 fe ff ff          call   1040 <malloc@plt>
+   115b:       48 89 45 f8             mov    QWORD PTR [rbp-0x8],rax
+   115f:       48 8b 45 f8             mov    rax,QWORD PTR [rbp-0x8]
+   1163:       48 ba 68 65 6c 6c 6f    movabs rdx,0x6568206f6c6c6568
+   116a:       20 68 65
+   116d:       48 89 10                mov    QWORD PTR [rax],rdx
+   1170:       c7 40 07 65 61 70 00    mov    DWORD PTR [rax+0x7],0x706165
+   1177:       48 8b 45 f8             mov    rax,QWORD PTR [rbp-0x8]
+   117b:       48 89 c7                mov    rdi,rax
+   117e:       e8 ad fe ff ff          call   1030 <free@plt>
+   1183:       b8 00 00 00 00          mov    eax,0x0
+   1188:       c9                      leave
+   1189:       c3                      ret
+
+Disassembly of section .fini:
+```
+
+When you look at this assembly, you won't see data simply being pushed onto the stack. Instead, you will see instructions setting up arguments (like putting `0x40`—which is 64 in hex—into the `edi` register) followed by a `call` to `malloc@plt`.
+
+`malloc` acts as the warehouse manager. It goes out, finds 64 bytes of free space in the heap memory region, and returns a pointer (a memory address) to that space in the `tax` register.
+
+This manual management is exactly why the heap is such a prime target for exploitation. If a programmer calls `malloc` but forgets to call `free`, the program leaks memory. If they call `free` but keep using the pointer anyway, you get a "Use-After-Free" vulnerability. If they ask for 64 bytes but copy 100 bytes into it, you get a Heap Overflow. Breaking the heap means tricking the warehouse manager (`glibc`'s allocator) into giving you access to things you shouldn't have.
+
+## **The CPU's Instruction Set**
+
+Assembly might look like gibberish at first, but it essentially boils down to moving data, doing basic math, and jumping around memory. Here are the most common instructions you will encounter:
+
+### **Moving Data**
+
+- **`mov dest, src`**: Copies data from the source to the destination. (`mov rax, rdx` copies the value in `rdx` into `rax`).
+- **Dereferencing `[]`**: Brackets act like pointers in C. `mov rax, [rdx]` doesn't move `rdx` itself; it goes to the memory address stored in `rdx` and grabs the value sitting there. Conversely, `mov [rax], rdx` takes the value in `rdx` and writes it into the memory address pointed to by `rax`.
+- **`lea dest, src`**: Load Effective Address. It calculates a memory address and stores the _address itself_ in the destination, rather than the data at that address. (`lea rdi, [rbx+0x10]`).
+
+### **Math and Logic**
+
+- **`add dest, src` / `sub dest, src`**: Adds or subtracts the source from the destination, storing the result in the destination.
+- **`xor dest, src`**: Performs a bitwise exclusive OR. (You will frequently see `xor rax, rax`—this is simply an optimized way to set `rax` to 0).
+
+### **Stack Operations**
+
+- **`push reg`**: Subtracts from `rsp` to grow the stack, then places the register's value onto the new top of the stack.
+- **`pop reg`**: Takes the value from the top of the stack, puts it into the register, and adds to `rsp` to shrink the stack.
+
+### **Control Flow**
+
+- **`jmp address`**: Unconditionally redirects code execution to a new memory address.
+- **`call address`**: Used to invoke functions. It pushes the current `rip` onto the stack (so the program remembers where it was) and then jumps to the new address.
+- **`ret`**: Pops the saved address off the stack and places it back into `rip`, seamlessly resuming execution where it left off before the `call`.
+
+### **Conditionals and Flags**
+
+The CPU has a special register dedicated to **Flags**—individual bits that indicate the state of the processor (e.g., the Zero Flag, Carry Flag, Sign Flag).
+
+- **`cmp arg1, arg2`**: Compares two values by silently subtracting them. It doesn't save the mathematical result; instead, it updates the CPU Flags (like setting the Zero Flag if the two values were equal).
+- **`jz` / `jnz`**: Jump if Zero / Jump if Not Zero. These look at the CPU flags set by a previous `cmp` instruction. If the Zero Flag is set, `jz` will take the jump. If not, the program just continues to the next instruction.
+
+There is one register that contains flags. A flag is a particular bit of this register. If it is set or not, will typically mean something. Here is the list of flags.
+
+```txt
+00:     Carry Flag
+01:     always 1
+02:     Parity Flag
+03:     always 0
+04:     Adjust Flag
+05:     always 0
+06:     Zero Flag
+07:     Sign Flag
+08:     Trap Flag
+09:     Interruption Flag
+10:     Direction Flag
+11:     Overflow Flag
+12:     I/O Privilege Field lower bit
+13:     I/O Privilege Field higher bit
+14:     Nested Task Flag
+15:     Resume Flag
+```
+
+<br>
+
+There are other flags then the one listed, however we really don't deal with them too much (and out of these, there are only a few we actively deal with).
+
+This has been a lot to unpack but it will get simpler with time. Now that we understand how C code becomes assembly, how the CPU juggles data in registers, and how the stack manages memory, we need to look at how all of this is packaged together by the operating system. Next, we will dive deeper into the structure of the ELF binary itself.
+
+You can support my work at [https://buymeacoffee.com/mockingspectre](https://buymeacoffee.com/mockingspectre)
+
+## Further Reading
+
+[https://en.wikibooks.org/wiki/X86_Assembly/X86_Architecture](https://en.wikibooks.org/wiki/X86_Assembly/X86_Architecture)  
+[https://en.wikipedia.org/wiki/Assembly_language](https://en.wikipedia.org/wiki/Assembly_language)

content/writing/generate-django-secret-key.md

@@ -1,11 +1,9 @@
-+++
-title = "Django Secret Key Tutorial"
-description = "Managing secrets"
-author = "mockingspectre"
-date = 2022-11-11T15:34:14.160Z
-[taxonomies]
-tags = ["tutorial", "django", "python", ".env"]
-+++
+---
+title: "Django Secret Key Tutorial"
+description: "Managing secrets"
+date: "2022-11-11"
+tags: ["tutorial", "django", "python", ".env"]
+---
 
 Managing the Django SECRET_KEY variable.
 

content/writing/hello-world.md

@@ -1,11 +1,9 @@
-+++
-title = "Hello World"
-description = "Hello world"
-date = 2022-11-04
-author = "mockingspectre"
-[taxonomies]
-tags = ["hugo", "blog", "go"]
-+++
+---
+title: "Hello World"
+description: "Hello world"
+date: "2022-11-04"
+tags: ["hugo", "blog", "go"]
+---
 
 How it begins
 

content/writing/inertia.md

@@ -1,11 +1,9 @@
-+++
-title = "cognitive inertia"
-description = "inertia"
-author = "mockingspectre"
-date = 2025-02-26
-[taxonomies]
-tags = ["cognition"]
-+++
+---
+title: "cognitive inertia"
+description: "inertia"
+date: "2025-02-26"
+tags: ["cognition"]
+---
 
 Staring at the void
 
@@ -13,7 +11,7 @@ Cognitive inertia is the reason changing our habits can be difficult. If you wan
 
 ## Metawork
 
-I will define this as the things we do before getting the "real" work doe. Its  things like choosing the best IDE or text editor, setting up your coding environment, choosing the best note taking app, or even the 'best' operating system. They are the prerequisites of the actual work.
+I will define this as the things we do before getting the "real" work doe. Its things like choosing the best IDE or text editor, setting up your coding environment, choosing the best note taking app, or even the 'best' operating system. They are the prerequisites of the actual work.
 
 I had been stuck on this loop, always trying to craft the perfect workflow. Setting up the best personalized linux distro, switching note taking apps, trying out multiple layouts, stylings and technologies for my blog, the list is endless.
 

content/writing/install-postgresql-15-on-arch-manjaro-garuda-linux.md

@@ -1,11 +1,9 @@
-+++
-title ="Install PostgreSQL  on Arch | Manjaro | Garuda Linux"
-description = "Getting PostgreSQL up and running on Arch Linux-based distros"
-date = 2023-02-16T15:34:14.160Z
-author = "mockingspectre"
-[taxonomies]
-tags = ["postgresql", "archlinux", "manjaro", "garuda", "linux"]
-+++
+---
+title: "Install PostgreSQL  on Arch | Manjaro | Garuda Linux"
+description: "Getting PostgreSQL up and running on Arch Linux-based distros"
+date: "2023-02-16"
+tags: ["postgresql", "archlinux", "manjaro", "garuda", "linux"]
+---
 
 # Overview
 
@@ -43,7 +41,7 @@ Postgres offers a lot of advantages that make it an excellent choice for highly
 
 Now with all that fluff out of the way, let's get to business. The steps have been tested on Arch Linux with the KDE desktop.
 
-> **Note:** Commands that should be run as the *postgres* user are prefixed by `[postgres]$` in this article.
+> **Note:** Commands that should be run as the _postgres_ user are prefixed by `[postgres]$` in this article.
 
 ## Step 1: Installing the PostgreSQL Package
 
@@ -51,7 +49,7 @@ Now with all that fluff out of the way, let's get to business. The steps have be
 sudo pacman -Syu postgresql
 ```
 
-This command will update the package database and update all packages on the system then install the PostgreSQL package from your distribution mirrors. Never install a package without updating the system first. On a rolling release, this can lead to an unbootable system. Installing the package will also create a system user called *postgres*. You can now switch to the *postgres* user using a privilege elevation program.
+This command will update the package database and update all packages on the system then install the PostgreSQL package from your distribution mirrors. Never install a package without updating the system first. On a rolling release, this can lead to an unbootable system. Installing the package will also create a system user called _postgres_. You can now switch to the _postgres_ user using a privilege elevation program.
 
 You can switch to the PostgreSQL user by executing the following command:
 

content/writing/integrating-netlify.md

@@ -1,11 +1,9 @@
-+++
-title = "Integrating Netlify CMS"
-description = "Integrating netlify cms"
-date = 2022-11-24T15:34:14.160Z
-author = "mockingspectre"
-[taxonomies]
-tags =  ["blog", "hugo", "netlify","netlify-cms","github"]
-+++
+---
+title: "Integrating Netlify CMS"
+description: "Integrating netlify cms"
+date: "2022-11-24"
+tags: ["blog", "hugo", "netlify", "netlify-cms", "github"]
+---
 
 Migrating to a better content management system through Netlify CMS
 
@@ -83,32 +81,27 @@ backend:
 # This line should *not* be indented
 publish_mode: editorial_workflow
 
-media_folder: "static/images/uploads" # Media files will be stored in the repo under static/images/uploads
-public_folder: "/images/uploads" # The src attribute for uploaded media will begin with /images/uploads
+media_folder: 'static/images/uploads' # Media files will be stored in the repo under static/images/uploads
+public_folder: '/images/uploads' # The src attribute for uploaded media will begin with /images/uploads
 
 collections:
-  - name: "post" # Used in routes, e.g., /admin/collections/blog
-    label: "posts" # Used in the UI
-    folder: "content/post" # The path to the folder where the documents are stored
+  - name: 'post' # Used in routes, e.g., /admin/collections/blog
+    label: 'posts' # Used in the UI
+    folder: 'content/post' # The path to the folder where the documents are stored
     create: true # Allow users to create new documents in this collection
-    slug: "{{year}}-{{month}}-{{day}}-{{slug}}" # Filename template, e.g., YYYY-MM-DD-title.md
+    slug: '{{year}}-{{month}}-{{day}}-{{slug}}' # Filename template, e.g., YYYY-MM-DD-title.md
     fields: # The fields for each document, usually in front matter
-      - { label: "Layout", name: "layout", widget: "hidden", default: "blog" }
-      - { label: "Title", name: "title", widget: "string" }
-      - { label: "Draft", name: "draft", widget: "boolean", default: true }
-      - { label: "Publish Date", name: "date", widget: "datetime" }
-      - { label: "Last Modified", name: "lastmod", widget: "datetime" }
-      - { label: "Body", name: "body", widget: "markdown" }
-      - { label: "Keywords", name: "keywords", widget: "list" }
-      - { label: "Tags", name: "tags", widget: "list" }
-      - { label: "Categories", name: "categories", widget: "list" }
-      - { label: "Comments", name: "comment", widget: "boolean", default: true }
-      - {
-          label: "Table of Contents",
-          name: "toc",
-          widget: "boolean",
-          default: true,
-        }
+      - { label: 'Layout', name: 'layout', widget: 'hidden', default: 'blog' }
+      - { label: 'Title', name: 'title', widget: 'string' }
+      - { label: 'Draft', name: 'draft', widget: 'boolean', default: true }
+      - { label: 'Publish Date', name: 'date', widget: 'datetime' }
+      - { label: 'Last Modified', name: 'lastmod', widget: 'datetime' }
+      - { label: 'Body', name: 'body', widget: 'markdown' }
+      - { label: 'Keywords', name: 'keywords', widget: 'list' }
+      - { label: 'Tags', name: 'tags', widget: 'list' }
+      - { label: 'Categories', name: 'categories', widget: 'list' }
+      - { label: 'Comments', name: 'comment', widget: 'boolean', default: true }
+      - { label: 'Table of Contents', name: 'toc', widget: 'boolean', default: true }
 ```
 
 **Step 5**
@@ -137,10 +130,10 @@ Lastly, we will add the following script before the closing `<body>` tag of our
 ```html
 <script>
   if (window.netlifyIdentity) {
-    window.netlifyIdentity.on("init", (user) => {
+    window.netlifyIdentity.on('init', (user) => {
       if (!user) {
-        window.netlifyIdentity.on("login", () => {
-          document.location.href = "/admin/";
+        window.netlifyIdentity.on('login', () => {
+          document.location.href = '/admin/';
         });
       }
     });

content/writing/javascript-exporting-modules.md

@@ -1,11 +1,9 @@
-+++
-title = "Export default and module.exports in Javascript"
-description = "Modules are the building blocks of modern JavaScript applications, allowing for the encapsulation of code into reusable components. Two primary systems govern the exportation of these modules: export default in ES6 and module.exports in CommonJS. "
-author = "mockingspectre"
-date = 2024-01-17
-[taxonomies]
-tags = ["javascript", "node"]
-+++
+---
+title: "Export default and module.exports in Javascript"
+description: "Modules are the building blocks of modern JavaScript applications, allowing for the encapsulation of code into reusable components. Two primary systems govern the exportation of these modules: export default in ES6 and module.exports in CommonJS. "
+date: "2024-01-17"
+tags: ["javascript", "node"]
+---
 
 Modules are the building blocks of modern JavaScript applications, allowing for the encapsulation of code into reusable components. Two primary systems govern the exportation of these modules: export default in ES6 and module.exports in CommonJS.
 
@@ -30,7 +28,7 @@ module.exports = function add(a, b) {
 
 // export an object
 module.exports = {
-  name: "Alice",
+  name: 'Alice',
   age: 25,
 };
 ```
@@ -40,11 +38,11 @@ To import a module in Node.js, you can use the require function and pass the pat
 ```javascript
 // main.js
 // import a function
-const add = require("./my-module.js");
+const add = require('./my-module.js');
 console.log(add(2, 3)); // 5
 
 // import an object
-const person = require("./my-module.js");
+const person = require('./my-module.js');
 console.log(person.name); // Alice
 console.log(person.age); // 25
 ```
@@ -53,7 +51,7 @@ Note that Node.js will cache the modules that are imported with require, so if y
 
 ## How to export modules in ES6?
 
-ES6 is the  version of Javascript that introduced many new features, including a native module system. ES6 modules use the `import` and `export` syntax.
+ES6 is the version of Javascript that introduced many new features, including a native module system. ES6 modules use the `import` and `export` syntax.
 
 To export a module in ES6, you can use the `export` keyword followed by the declaration of the value that you want to export. You can also use the export keyword with curly braces to export a list of named values. For example:
 
@@ -74,7 +72,7 @@ export class Person {
 
 // export an object
 export const person = {
-  name: "Alice",
+  name: 'Alice',
   age: 25,
 };
 ```
@@ -84,17 +82,17 @@ To import a module in ES6, you can use the `import` keyword followed by the name
 ```javascript
 // main.js
 // import a function
-import { add } from "./my-module.js";
+import { add } from './my-module.js';
 console.log(add(2, 3)); // 5
 
 // import a class
-import { Person } from "./my-module.js";
-const person = new Person("Bob", 30);
+import { Person } from './my-module.js';
+const person = new Person('Bob', 30);
 console.log(person.name); // Bob
 console.log(person.age); // 30
 
 // import an object
-import { person as Alice } from "./my-module.js";
+import { person as Alice } from './my-module.js';
 console.log(Alice.name); // Alice
 console.log(Alice.age); // 25
 ```
@@ -138,7 +136,7 @@ module.exports = function add(a, b) {
 
 // export an object
 module.exports = {
-  name: "Alice",
+  name: 'Alice',
   age: 25,
 };
 
@@ -158,17 +156,17 @@ To import a default export, you can use the import keyword without curly braces
 ```javascript
 // main.js
 // import a default export
-import add from "./my-module.js";
+import add from './my-module.js';
 console.log(add(2, 3)); // 5
 
 // import another default export
-import person from "./my-module.js";
+import person from './my-module.js';
 console.log(person.name); // Alice
 console.log(person.age); // 25
 
 // import another default export
-import Person from "./my-module.js";
-const person = new Person("Bob", 30);
+import Person from './my-module.js';
+const person = new Person('Bob', 30);
 console.log(person.name); // Bob
 console.log(person.age); // 30
 ```
@@ -178,17 +176,17 @@ To import a module.exports value, you can use the require function and assign an
 ```javascript
 // main.js
 // import a module.exports value
-const add = require("./my-module.js");
+const add = require('./my-module.js');
 console.log(add(2, 3)); // 5
 
 // import another module.exports value
-const person = require("./my-module.js");
+const person = require('./my-module.js');
 console.log(person.name); // Alice
 console.log(person.age); // 25
 
 // import another module.exports value
-const Person = require("./my-module.js");
-const person = new Person("Bob", 30);
+const Person = require('./my-module.js');
+const person = new Person('Bob', 30);
 console.log(person.name); // Bob
 console.log(person.age); // 30
 ```

content/writing/mmuctf2025.md

@@ -1,19 +1,17 @@
-+++
-title = "mmuctf 2025 writeup"
-description = "mmuctf 2025 challenges writeup"
-date = 2025-08-03
-[taxonomies]
-tags = ["ctf", "rev", "web", "forensics"]
-+++
+---
+title: "mmuctf 2025 writeup"
+description: "mmuctf 2025 challenges writeup"
+date: "2025-08-03"
+tags: ["ctf", "rev", "web", "forensics"]
+---
 
-
-Over the weekend, I  had the opportunity to participate in the mmuctf 2025. It was an individual jeopardy style CTF targeted towards beginners and intermediate people in cybersecurity. This is a write-up to explore some challenges I did, or at least almost did.
+Over the weekend, I had the opportunity to participate in the mmuctf 2025. It was an individual jeopardy style CTF targeted towards beginners and intermediate people in cybersecurity. This is a write-up to explore some challenges I did, or at least almost did.
 
 ## Welcome
 
->Through the shadows of the cave, at the door I had a zeal to get a welcome flag, but I couldn't see it though
-I could hear it calling for me to get it. Happy hacking
-{: .prompt-info }
+> Through the shadows of the cave, at the door I had a zeal to get a welcome flag, but I couldn't see it though
+> I could hear it calling for me to get it. Happy hacking
+> {: .prompt-info }
 
 This was a sanity check flag. I believe competitions pose such challenges that you can't get zero points. It's the same as flags in Discord servers, a flag after completing the feedback form, or just other free points.
 
@@ -22,12 +20,12 @@ The challenge description talked about the `door`, my first instinct was to view
 ```zsh
 ┌──(mockingspectre㉿blackout)-[~/ctf/mmuctf2025]
 └─$ echo -n "bW11Y3Rme3dlbGNvbWVfZmxhZ19hZGlvc19NdWNoQGNob30=" | base64 -d
-mmuctf{welcome_flag_adios_Much@cho}   
+mmuctf{welcome_flag_adios_Much@cho}
 ```
 
 ## My First App
 
->Our intern dev swears this app’s secure...
+> Our intern dev swears this app’s secure...
 
 This was a web challenge with an account creation form. Let's fire up Burp. The account creation request didn't seem suspicious for now, so I sent it to the repeater to abuse it some more. The response seemed interesting, the user id was in the query parameter: `GET /profile.php?id=5 HTTP/1.1`. This was a nice candidate for an Insecure Direct Object Reference(IDOR). I tried repeating the request with values from 0-4. The flag was at 1, the admin user's account.
 
@@ -37,7 +35,7 @@ mmuctf{1d0r_4dm1n_4cc3ss_1s_c0mpr0m1s3d}
 
 ## Ledilect
 
->Sometimes the path you take is just a jump away.
+> Sometimes the path you take is just a jump away.
 
 This was a simple one, I knew what the challenge wanted, but I couldn't get myself to exploit it, definitely a skill issue. The webapp had a landing page that had a button that made this request:
 
@@ -59,9 +57,9 @@ Looking at that, I suspected an open redirect vulnerability, but I don't know an
 
 ## Meet my X
 
->Iｎ tｈｅ�days оｆ cοｍfoｒt ｉ ｍeｔ tｈis ｇｉrl ａｔ thｅ Ｊobleｓs соrｎｅr. Аt ｔｈe�doоrs ａnd windows of iddleness i approached, oops she smiled and thats how i knew she was the one. I guess thatsss whyyy i learned on getting Flags because be warned she later left me at first it feels like a green flag i guess no life was there on blood(heart_break)
+> Iｎ tｈｅ�days оｆ cοｍfoｒt ｉ ｍeｔ tｈis ｇｉrl ａｔ thｅ Ｊobleｓs соrｎｅr. Аt ｔｈe�doоrs ａnd windows of iddleness i approached, oops she smiled and thats how i knew she was the one. I guess thatsss whyyy i learned on getting Flags because be warned she later left me at first it feels like a green flag i guess no life was there on blood(heart_break)
 
-This challenge involved homoglyphs,  a character or a sequence of characters that looks very similar or identical to another character or sequence of characters, but has a different meaning, encoding, or origin.
+This challenge involved homoglyphs, a character or a sequence of characters that looks very similar or identical to another character or sequence of characters, but has a different meaning, encoding, or origin.
 
 A sentence might look normal, but if you copy it into a text editor that shows Unicode details or a specialized homoglyph detector, you'll see different underlying character codes.
 
@@ -73,8 +71,8 @@ mmuctf{oops_twitter_steg_1s_fun}
 
 ## Shadow
 
->Look beyond the appearance, perhaps their numerical essence will guide you to the flag.
-Can you reveal what lurks in the shadow?
+> Look beyond the appearance, perhaps their numerical essence will guide you to the flag.
+> Can you reveal what lurks in the shadow?
 
 This was another stego challenge; there is an image with what looks like a color palette. The description hints at 'numerical essence', so it might be something to deal with the hex values of the colors. I used this site <https://imagecolorpicker.com/> to extract the hex values.
 
@@ -99,7 +97,7 @@ mmuctf{4lw4y5_h1dd3n_1n5d3_m3}
 
 ## Revealme
 
->We found this mysterious executable on an old USB stick... Can you figure out how to get it to reveal the flag?
+> We found this mysterious executable on an old USB stick... Can you figure out how to get it to reveal the flag?
 
 The provided file is an ELF executable binary.
 
@@ -173,7 +171,7 @@ mmuctf{r3v3rs1ng_st4rt3r}
 
 ## Flicker
 
->An ordinary looking Android app... or is it?
+> An ordinary looking Android app... or is it?
 
 The provided app is an Android APK. Let's fire up jadx-gui. The package name is `com.example.blink`. There is an interesting class `r2d2`. In the onCreate method, there is an image string variable that seems to contain base64 image data.
 
@@ -190,8 +188,8 @@ CTF{PUCKMAN}
 
 ## Open_Secrets
 
->Someone trusted the wrong site and network didn’t forget. Can you piece together what was left behind?
-Some people still think locks are optional on digital doors.*
+> Someone trusted the wrong site and network didn’t forget. Can you piece together what was left behind?
+> Some people still think locks are optional on digital doors.\*
 
 The provided file was a network capture pcap file. For people who don't know, pcap (a packet capture) consists of an application programming interface (API) for capturing network traffic.The challenge title and filename hint at unencrypted traffic. Open up Wireshark and apply an HTTP filter. There is an HTTP stream that leaks the flag:
 
@@ -229,7 +227,7 @@ usb.transfer_type == 0x01
 usb.transfer_type == 0x01 && usb.dst == "host" && !(usb.capdata == 00:00:00:00:00:00:00:00)
 ```
 
-Crafting a tshark command to get the leftover capture data for the above filters and redirect it into a  file
+Crafting a tshark command to get the leftover capture data for the above filters and redirect it into a file
 
 ```zsh
 tshark -r log.pcap -Tfields -Eseparator=, -e thekey.pcapng -Y 'usb.transfer_type == 0x01 && usb.dst == "host" && !(usb.capdata == 00:00:00:00:00:00:00:00)' | sed 's/://g' > usb.capdata
@@ -238,9 +236,9 @@ tshark -r log.pcap -Tfields -Eseparator=, -e thekey.pcapng -Y 'usb.transfer_type
 ```zsh
 ┌──(mockingspectre㉿blackout)-[~/ctf/mmuctf2025]
 └─$ tshark -r thekey.pcapng -Tfields -Eseparator=, -e usb.capdata -Y 'usb.transfer_type == 0x01 && usb.dst == "host" && !(usb.capdata == 00:00:00:00:00:00:00:00)' | sed 's/://g' > usb.capdata
-                                                                                                             
+
 ┌──(mockingspectre㉿blackout)-[~/ctf/mmuctf2025]
-└─$ cat usb.capdata                                                                                                                                      
+└─$ cat usb.capdata
 0000190000000000
 00000c0000000000
 00000c1000000000

content/writing/obsidian-sync.md

@@ -1,11 +1,9 @@
-+++
-title = "Setting up Obsidian sync in Windows"
-description = "Syncing Obsidian in Windows with Windows Task Scheduler with git"
-author = "mockingspectre"
-date = 2023-10-01
-[taxonomies]
-tags = ["obsidian", "git","sync", "windows", "cron", "task scheduler", "powershell"]
-+++
+---
+title: "Setting up Obsidian sync in Windows"
+description: "Syncing Obsidian in Windows with Windows Task Scheduler with git"
+date: "2023-10-01"
+tags: ["obsidian", "git", "sync", "windows", "cron", "task-scheduler", "powershell"]
+---
 
 Syncing Obsidian in Windows with Windows Task Scheduler and git
 

content/writing/self-hosting-gitea-and-mirroring-github.md

@@ -0,0 +1,237 @@
+---
+title: "Self-Hosting Gitea and Automating GitHub Mirrors"
+description: "Self-Hosting Gitea and Automating GitHub Mirrors (and Everything Cloudflare Broke Along the Way)"
+date: "2026-08-19"
+tags: ["self-hosting", "gitea", "dokploy", "cloudflare", "github-actions", "bash"]
+---
+
+I run a Hetzner box with [Dokploy](https://docs.dokploy.com) for most of my personal infrastructure. I'd been meaning to get a self-hosted git server on it for a while, mainly so I have a durable mirror of my GitHub repos that doesn't depend on GitHub staying up, staying free, or staying interested in hosting my code. This is the log of actually doing it: what I picked, what broke, and the debugging trail for the parts that took longer than they should have.
+
+Full script and workflow are on [github.com/andwati/gitea-mirror-sync](https://github.com/andwati/gitea-mirror-sync) if you want to skip straight to the code.
+
+## Why not GitLab
+
+GitLab CE was my first instinct. It's the "serious" self-hosted option, and Dokploy ships a template for it out of the box. But the omnibus image bundles Postgres, Redis, Sidekiq, Puma, Gitaly, Workhorse, and a Prometheus stack into a single container, with an official minimum of 4GB RAM. My box has 8GB total, already shared with a handful of other services. Giving GitLab half the machine just to get merge requests and a UI I mostly wouldn't use felt like the wrong trade.
+
+Gitea is a single Go binary. Idle footprint is a few hundred MB against GitLab's multiple gigabytes, boot time is seconds instead of minutes, and there's no `trusted_proxies` CIDR guessing or five-minute health check grace periods to plan around. For a personal git server, it's the right-sized tool. The trade-off is CI maturity (Gitea Actions is newer than GitLab CI) and no built-in SAST/DAST scanning, neither of which I actually needed here.
+
+## The stack
+
+Gitea and Postgres, both in one Dokploy compose file, with everything pushed out to environment variables so the compose itself never needs touching again:
+
+```yaml
+services:
+  gitea:
+    image: docker.gitea.com/gitea:${GITEA_IMAGE_TAG}
+    restart: unless-stopped
+    depends_on:
+      postgres:
+        condition: service_healthy
+    environment:
+      - USER_UID=${GITEA_USER_UID:-1000}
+      - USER_GID=${GITEA_USER_GID:-1000}
+
+      - GITEA__database__DB_TYPE=${GITEA_DB_TYPE}
+      - GITEA__database__HOST=${GITEA_DB_HOST}:${POSTGRES_PORT}
+      - GITEA__database__NAME=${POSTGRES_DB}
+      - GITEA__database__USER=${POSTGRES_USER}
+      - GITEA__database__PASSWD=${GITEA_DB_PASSWORD}
+
+      - GITEA__server__DOMAIN=${GITEA_HOST}
+      - GITEA__server__ROOT_URL=${GITEA_PROTOCOL:-https}://${GITEA_HOST}/
+      - GITEA__server__HTTP_PORT=${GITEA_HTTP_PORT:-3000}
+      - GITEA__server__PROTOCOL=${GITEA_INTERNAL_PROTOCOL:-http}
+      - GITEA__server__DISABLE_SSH=true
+      - GITEA__server__SSH_PORT=${GITEA_SSH_EXTERNAL_PORT:-2222}
+      - GITEA__server__SSH_LISTEN_PORT=${GITEA_SSH_LISTEN_PORT:-22}
+      - GITEA__server__REVERSE_PROXY_TRUSTED_PROXIES=${GITEA_TRUSTED_PROXIES:-172.16.0.0/12,10.0.0.0/8}
+
+      - GITEA__mailer__ENABLED=${GITEA_MAILER_ENABLED:-true}
+      - GITEA__mailer__PROTOCOL=${GITEA_MAILER_PROTOCOL:-smtp+starttls}
+      - GITEA__mailer__SMTP_ADDR=${GITEA_MAILER_SMTP_ADDR:-smtp.gmail.com}
+      - GITEA__mailer__SMTP_PORT=${GITEA_MAILER_SMTP_PORT:-587}
+      - GITEA__mailer__USER=${GMAIL_ADDRESS}
+      - GITEA__mailer__PASSWD=${GMAIL_APP_PASSWORD}
+      - GITEA__mailer__FROM=${GITEA_MAILER_FROM:-${GMAIL_ADDRESS}}
+
+      - GITEA__mirror__ENABLED=${GITEA_MIRROR_ENABLED:-true}
+      - GITEA__mirror__DEFAULT_INTERVAL=${GITEA_MIRROR_DEFAULT_INTERVAL:-8h}
+      - GITEA__mirror__MIN_INTERVAL=${GITEA_MIRROR_MIN_INTERVAL:-10m}
+
+      - GITEA__packages__ENABLED=${GITEA_PACKAGES_ENABLED:-true}
+
+      - GITEA__service__DISABLE_REGISTRATION=${GITEA_DISABLE_REGISTRATION:-true}
+      - GITEA__service__REQUIRE_SIGNIN_VIEW=${GITEA_REQUIRE_SIGNIN_VIEW:-false}
+      - GITEA__other__SHOW_FOOTER_VERSION=false
+    volumes:
+      - gitea-data:/data
+    ports:
+      - "${GITEA_SSH_EXTERNAL_PORT:-2222}:${GITEA_SSH_LISTEN_PORT:-22}"
+    expose:
+      - "${GITEA_HTTP_PORT:-3000}"
+    healthcheck:
+      test: ["CMD", "wget", "-q", "--spider", "http://localhost:${GITEA_HTTP_PORT:-3000}/api/healthz"]
+      interval: ${GITEA_HEALTHCHECK_INTERVAL:-15s}
+      timeout: ${GITEA_HEALTHCHECK_TIMEOUT:-5s}
+      retries: ${GITEA_HEALTHCHECK_RETRIES:-10}
+      start_period: ${GITEA_HEALTHCHECK_START_PERIOD:-30s}
+
+  postgres:
+    image: docker.io/library/postgres:${POSTGRES_IMAGE_TAG:-17-alpine}
+    restart: unless-stopped
+    environment:
+      - POSTGRES_USER=${POSTGRES_USER}
+      - POSTGRES_PASSWORD=${GITEA_DB_PASSWORD}
+      - POSTGRES_DB=${POSTGRES_DB}
+    volumes:
+      - pg-data:/var/lib/postgresql/data
+    expose:
+      - "${POSTGRES_PORT}"
+    healthcheck:
+      test: ["CMD-SHELL", "pg_isready -U ${POSTGRES_USER}"]
+      interval: ${POSTGRES_HEALTHCHECK_INTERVAL:-10s}
+      timeout: ${POSTGRES_HEALTHCHECK_TIMEOUT:-5s}
+      retries: ${POSTGRES_HEALTHCHECK_RETRIES:-5}
+
+volumes:
+  gitea-data: {}
+  pg-data: {}
+```
+
+The GitHub Actions workflow that runs the mirror script:
+
+```yaml
+name: Mirror GitHub repos to Gitea
+
+on:
+  schedule:
+    # Runs at 00:00 UTC daily. Midnight EAT (UTC+3) would be "0 21 * * *" the day before.
+    - cron: "0 0 * * *"
+  workflow_dispatch:
+    inputs:
+      debug_http:
+        description: "Print request/response headers for every Gitea write call"
+        type: boolean
+        default: false
+
+jobs:
+  mirror:
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout (for the script)
+        uses: actions/checkout@v5
+
+      - name: Install jq
+        run: sudo apt-get update && sudo apt-get install -y jq
+
+      # The mirror runs from a GitHub-hosted runner, not the network I usually test from,
+      # so it can hit Gitea through a different proxy path than my laptop does. This POSTs
+      # a harmless JSON body and reports whether Content-Type survived the trip. A 422
+      # "Empty Content-Type" here means something between the runner and Gitea is dropping
+      # the header, not that the mirror payload itself is wrong.
+      - name: Preflight - can this runner POST JSON to Gitea?
+        env:
+          GITEA_URL: ${{ secrets.GITEA_URL }}
+          GITEA_TOKEN: ${{ secrets.GITEA_TOKEN }}
+        run: |
+          url="${GITEA_URL%/}"
+          echo "GET /api/v1/version -> $(curl -s -o /dev/null -w '%{http_code}' \
+            -H "Authorization: token ${GITEA_TOKEN}" "${url}/api/v1/version")"
+          for proto in --http2 --http1.1; do
+            code=$(curl -s $proto -o /tmp/pre.json -w '%{http_code}' \
+              -X POST "${url}/api/v1/markdown" \
+              -H "Authorization: token ${GITEA_TOKEN}" \
+              -H "Content-Type: application/json" \
+              -H "Expect:" \
+              --data-binary '{"text":"preflight","mode":"markdown"}')
+            echo "POST /api/v1/markdown ${proto} -> ${code}"
+            [ "$code" = "200" ] || head -c 300 /tmp/pre.json; echo
+          done
+
+      - name: Mirror all repos to Gitea
+        env:
+          GITHUB_TOKEN: ${{ secrets.GH_PAT }}
+          GITEA_URL: ${{ secrets.GITEA_URL }}
+          GITEA_TOKEN: ${{ secrets.GITEA_TOKEN }}
+          GITEA_OWNER: ${{ secrets.GITEA_OWNER }}
+          DEBUG_HTTP: ${{ inputs.debug_http && '1' || '' }}
+        run: ./mirror-github-to-gitea.sh
+```
+
+A few decisions worth explaining.
+
+**SSH on 2222, not 22.** The host's own sshd already owns port 22, so Gitea's internal SSH got mapped to 2222, with [`SSH_PORT`](https://docs.gitea.com/administration/config-cheat-sheet/) set to match so Gitea generates correct clone URLs.
+
+<aside class="callout callout-note">
+
+I later set `GITEA__server__DISABLE_SSH=true` (see [`DISABLE_SSH`](https://docs.gitea.com/administration/config-cheat-sheet/) in Gitea's config cheat sheet) and dropped the port mapping entirely. Cloudflare's proxy only forwards HTTP and HTTPS traffic, not arbitrary TCP, so SSH on 2222 was simply unreachable once `gitea.andwati.com` sat behind the orange cloud. The two ways around that were a DNS-only subdomain, which leaks the origin IP to anyone who runs `dig`, or a Cloudflare Tunnel, which is more moving parts than a personal git server's SSH clone was worth. HTTPS clone already worked fine through the proxy, so disabling SSH was the simpler trade.
+
+</aside>
+
+**Traefik/Dokploy terminates TLS, Gitea speaks plain HTTP internally.** [Dokploy's domain manager](https://docs.dokploy.com/docs/core/domains) handles the Let's Encrypt cert and routes to the container on port 3000. `REVERSE_PROXY_TRUSTED_PROXIES` is set so Gitea trusts the forwarded headers instead of thinking every request comes from the internal Docker network.
+
+**Mail via Gmail SMTP**, gated behind an App Password since Google dropped plain password auth for SMTP a while back.
+
+**Everything as env vars with sane defaults**, so the only things I actually type into Dokploy per deploy are the domain, the DB password, and the mail credentials.
+
+## Token scopes
+
+Two tokens drive the mirror script, and both need to be scoped correctly or the migrate call fails in ways that look unrelated to permissions.
+
+### **GitHub token (`GH_PAT`).**
+
+A classic Personal Access Token with the `repo` scope, generated at [github.com/settings/tokens](https://github.com/settings/tokens). This is the scope GitHub's own docs point to for reading private repositories, and it's also what Gitea's own migration guide recommends when the source is GitHub. A fine-grained token works too, provided it has read access to Contents and Metadata across all the repos you want mirrored, but classic `repo` is simpler to reason about for a personal account with dozens of repos rather than picking them one by one.
+
+### **Gitea token (`GITEA_TOKEN`).**
+
+Needs the `write:repository` scope, generated from your Gitea instance at Settings → Applications → Generate New Token (`https://<your-gitea-domain>/user/settings/applications`). `write:repository` covers both the `/repos/migrate` call that creates new mirrors and the `PATCH` call the script uses to sync visibility on existing ones. `read:repository` alone isn't enough since both of those are write operations.
+
+### **Where they get set.**
+
+Both live as encrypted secrets on the `gitea-mirror-sync` repo, not in the script or the workflow file: Settings → Secrets and variables → Actions → New repository secret, alongside `GITEA_URL` and `GITEA_OWNER`. The workflow references them only as `${{ secrets.GH_PAT }}` and `${{ secrets.GITEA_TOKEN }}`, so neither value is ever visible in a log or checked into the repo itself.
+
+## Bot Fight Mode: the wall you can't route around
+
+The bot-challenge problem looked like a quick fix at first. Add a WAF custom rule that matches the hostname and skips security checks: Bot Fight Mode, managed rules, browser integrity check, all of it. That got a plain `curl` from my own machine through cleanly. It did nothing for the GitHub Actions runner, which kept getting served a JS challenge page on every write request.
+
+The reason turned out to be a real platform limit, not a rule I'd written wrong. Cloudflare's free-tier [Bot Fight Mode](https://developers.cloudflare.com/bots/get-started/bot-fight-mode/) doesn't run on the Ruleset Engine at all. It's a separate evaluation pipeline where `Skip`, `Bypass`, and `Allow` actions have no effect. Only Super Bot Fight Mode, which needs a Pro plan, runs on the Ruleset Engine and actually respects skip rules. On Free there's no way to carve out an exception for a specific host or path. It's off or it's on for the whole zone.
+
+For a git server whose traffic is almost entirely programmatic (API calls, `git clone`, CI runs, registry pushes), Bot Fight Mode was fighting the exact use case the server exists for. I turned it off zone-wide (Security → Settings → Bot traffic) rather than pay for Pro just to get a skip rule that would only ever have applied to this one subdomain anyway.
+
+## The 422 that took a while to track down
+
+With Cloudflare out of the way, the mirror script started reaching Gitea and immediately failed every single repo with:
+
+```
+{"message":"[]: Empty Content-Type","url":".../api/swagger"}
+```
+
+`Content-Type: application/json` was set explicitly on every `curl` call, so the error made no sense at first glance. The actual cause was structural. The migrate request was built with `curl -d @- <<EOF ... EOF` inside a `while read` loop that was itself fed by a pipe: `jq ... | while read -r entry; do ... done`. The loop's own `read` and curl's `-d @-` were both drawing from the same stdin, and the heredoc body wasn't landing in the request the way it should have on paper.
+
+The fix was to stop routing anything through stdin inside the loop:
+
+- Build the JSON payload with `jq -n` into a file instead of a heredoc, so there's no ambiguity about where the body comes from.
+- Switch the loop from a pipe into process substitution, `done < <(...)`, so the loop body never shares stdin with anything running inside it.
+- Send the body with `--data-binary "@file"` instead of `-d @-`.
+
+That fixed it, but chasing it down surfaced a second, sneakier failure mode worth guarding against for good: a secret pasted into a GitHub Actions secret with a trailing newline. If a token has a trailing `\n`, curl writes `Authorization: token <value>\n`, and that bare newline terminates the header block early. Every header written after it, `Content-Type` included, lands in the request body instead of staying a header. GETs survive this because nothing they need comes after `Authorization`. Writes don't. The final version of the script trims all four credentials on load, warns if any of them needed trimming, and falls back to retrying over HTTP/1.1 if a write still comes back with "Empty Content-Type," since some reverse proxies handle HTTP/2 header framing differently than HTTP/1.1.
+
+## What the script does now
+
+It pages through `/user/repos` on GitHub, not the public-only `/users/{user}/repos`, so private repos are included. For each one:
+
+- **Doesn't exist in Gitea yet** → migrates it as a pull mirror, matching GitHub's visibility (`private` flows straight through).
+- **Already mirrored, visibility has drifted** → `PATCH`es the Gitea repo to match GitHub's current visibility. Covers the case where a repo gets made private on GitHub after the mirror was first created.
+- **Already mirrored, visibility matches** → no-op.
+
+It also picked up an `ONLY=<repo-name>` escape hatch for smoke-testing one repo before running the whole account through it, and a `DEBUG_HTTP=1` flag that dumps redacted request and response headers when something's misbehaving.
+
+The [workflow](https://github.com/andwati/gitea-mirror-sync/blob/main/.github/workflows/mirror-to-gitea.yml) runs it daily on a [cron schedule](https://docs.github.com/en/actions/using-workflows/events-that-trigger-workflows#schedule), with a `workflow_dispatch` trigger for manual runs, plus a preflight step that POSTs a harmless request to Gitea's markdown-render endpoint first and reports whether `Content-Type` survived the trip. If Cloudflare or the proxy chain ever regresses again, the workflow fails fast on the preflight instead of quietly mangling every repo migration.
+
+## Takeaways
+
+- **Resource-match the tool to the box.** GitLab is the obvious choice and the wrong one for an 8GB personal server running other things too. Gitea's footprint fits reality.
+- **Cloudflare's proxy has real, non-obvious interactions with anything that isn't a browser.** TLS issuance and bot protection both assume the traffic model is "human on a webpage." A git server's actual traffic model is closer to machine talking to machine, on a schedule, indefinitely.
+- **Free-tier Bot Fight Mode is not configurable, full stop.** If your infrastructure sees more API and CI traffic than browser traffic, know going in that the free bot protection can't be scoped down. It's off or it's Pro.
+- **Heredocs and piped `while read` loops don't mix well when something inside the loop also wants stdin.** Process substitution sidesteps the whole category of bug.
+- **Trim your secrets.** A trailing newline in a pasted token is invisible in every UI that shows it back to you, and it will produce an error message that points nowhere near the actual cause.

content/writing/semantic-version-and-conventional-commits.md

@@ -1,17 +1,15 @@
-+++
-title= "Semantic Versioning(SemVer) and Conventional  Commits"
-description = "Adopting best practices in your git and build workflows."
-date= 2023-01-24T15:34:14.160Z
-author = "mockingspectre"
-[taxonomies]
-tags= ["git", "semver","workflow", "conventional commits"]
-+++
+---
+title: "Semantic Versioning(SemVer) and Conventional  Commits"
+description: "Adopting best practices in your git and build workflows."
+date: "2023-01-24"
+tags: ["git", "semver", "workflow", "conventional-commits"]
+---
 
 Adopting best practices in your git and build workflows.
 
 # What is Semver?
 
-Semantic versioning or just SemVer is a dependency naming guidline that aims to bring some sanity into naming libraries and packages in software development. It is a standard versioning system created by **Tom Preston Werner** (co-founder of Github) that’s used to communicate what changes are in a release.
+Semantic versioning or just SemVer is a dependency naming guideline that aims to bring some sanity into naming libraries and packages in software development. It is a standard versioning system created by **Tom Preston Werner** (co-founder of Github) that’s used to communicate what changes are in a release.
 
 An efficient and smooth versioning becomes crucial for efficient software delivery expecially for projects that expose a public API. This saves the developers the chaos that is **dependency hell**.Dependency hell is a colloquial term for the frustration of some software users who have installed software packages which have dependencies on specific versions of other software packages.
 
@@ -31,8 +29,6 @@ Semantic versioning is based on three numbers that indicate the versions of the
 
 #### React(v18.2.0)
 
-![react](/images/uploads/react.png "React versioning")
-
 - **Major -> 18**
 - **Minor -> 2**
 - **Patch -> 0**
@@ -41,8 +37,6 @@ Semantic versioning is based on three numbers that indicate the versions of the
 
 #### Pipx(v1.1.0)
 
-![](/images/uploads/pipx.png)
-
 - **Major -> 1**
 - **Minor -> 1**
 - **Patch -> 0**

content/writing/subresource-integrity.md

@@ -1,11 +1,9 @@
-+++
-title= "Subresource Integrity"
-description = "Understanding Subresource Integrity"
-date= 2023-04-29
-author = "mockingspectre"
-[taxonomies]
-tags= ["subresource integrity", "csp", "cors"]
-+++
+---
+title: "Subresource Integrity"
+description: "Understanding Subresource Integrity"
+date: "2023-04-29"
+tags: ["subresource-integrity", "csp", "cors"]
+---
 
 Understanding Subresource Integrity
 
@@ -43,10 +41,7 @@ Using Subresource Integrity (SRI) involves a few steps, but it is relatively str
 - Add the hash as an attribute to the tag that loads the external resource. For example, for a JavaScript file, you would add the integrity attribute to the `<script>` tag like this:
 
 ```html
-<script
-  src="https://example.com/example.js"
-  integrity="sha256-ABC123XYZ456"
-></script>
+<script src="https://example.com/example.js" integrity="sha256-ABC123XYZ456"></script>
 ```
 
 > An integrity value may contain multiple hashes separated by whitespace. A resource will be loaded if it matches one of those hashes.

content/writing/the-single-byte-that-kills-your-exploit-understanding-endianness.md

@@ -0,0 +1,77 @@
+---
+title: "The Single Byte That Kills Your Exploit: Understanding Endianness"
+description: "Problem: Computers speak different languages, like people"
+date: "2025-11-09"
+tags: ["blog"]
+---
+
+If you’ve ever crafted a perfect shellcode and ROP chain only to have your exploit immediately crash with a SIGSEGV(a signal sent by the operating system to a program when it attempts to access a protected or invalid memory location) or EIP(a 32-bit CPU register in the x86 architecture that holds the memory address of the next machine instruction to be executed) pointing to garbage, you’ve likely met the silent killer of beginners: Endianness.
+
+Endianness is fundamental; it defines the order in which a multi-byte value (like a 4-byte integer or an 8-byte memory address) is stored in a machine’s memory. For us in the pwn game, this translates directly to whether the addresses we pack into our exploit payloads are interpreted correctly by the target program. A single misplaced byte means the difference between a shell and a stack smash(stack buffer overflow**)**.
+
+## Little vs. Big: The Two Orders
+
+There are two primary byte orders
+
+Little-Endian (LE): The Least Significant Byte (LSB) is stored first, at the lowest memory address. This is the byte order used by the vast majority of personal computers, including all modern Intel/AMD (x86/x64) architectures.
+
+Big-Endian (BE): The Most Significant Byte (MSB) is stored first, at the lowest memory address. This is often called Network Byte Order (NBO) and is common in network protocols, as well as some older or embedded architectures like PowerPC, MIPS, and SPARC.
+
+## Cross-architecture exploitation (LE <-> BE)
+
+If you’re attacking an embedded device, router, or IoT target, it might be Big-Endian. Always confirm the target architecture and ABI. Common mistakes when cross-compiling or reusing gadgets:
+
+Using x86/x86_64 gadgets and packers on a MIPS/PowerPC target (different endianness and instruction set) will not work.
+
+pwntools and other frameworks allow you to set `context.arch` and `context.endian` So packers and disassemblers behave correctly.
+
+## How to detect the target’s endianness quickly
+
+Run the small C program above on the target if you have code execution. Use `readelf`, `file`, or `objdump` On binaries from the target filesystem, some formats indicate endianness.
+
+In GDB, examine the memory representation of a known constant or pointer. Put a known value in a register or memory, and inspect the byte order with `x/4xb address`.
+
+```gdb
+(gdb) p/x 0x41424344
+$1 = 0x41424344
+(gdb) set {int}0x601000 = 0x41424344
+(gdb) x/4xb 0x601000
+0x601000: 0x44 0x43 0x42 0x41  # little-endian: ‘DCBA’
+```
+
+## Debugging tips when an exploit “looks right” but crashes
+
+Print the raw payload bytes you are sending, compare with what the target receives (packet capture or logging), and what the target’s memory shows in a debugger.
+
+Verify pointer size. Are you packing 32-bit or 64-bit addresses?
+
+Check alignment and padding. Are there extra bytes inserted by the protocol or `scanf`/`fgets` behavior?
+
+Confirm endianness on the target; don’t assume x86 for embedded devices.
+
+Use tool packing (`struct.pack`, `pwntools`) instead of hand-reversing where possible.
+
+If attacking over the network, confirm whether fields are consumed in network byte order.
+
+## Short checklist for exploit authors
+
+- Confirm target architecture (x86, x86_64, MIPS, ARM, PowerPC).
+- Confirm endianness (LE or BE).
+- Use correct pointer width (`p32` vs `p64`) and pack accordingly.
+- Use library packing (`struct`, `pwntools`) to avoid manual reversal mistakes.
+- For network services, encode multi-byte protocol fields in network (big-endian) byte order unless the protocol documentation says otherwise.
+- Check struct padding and alignment on the target.
+- Inspect the target’s memory with a debugger to verify the actual byte layout.
+
+## Final thoughts
+
+Endianness is simple in concept but vital in practice. For most modern exploit work, you’ll be on x86*64 (Little-Endian), so make it a habit to pack addresses in reverse byte order relative to how you read them in a disassembler. Use `pwntools`, `struct`, or equivalent to do the packing for you, but keep in mind \_why* bytes are reversed; that understanding is what will let you debug the next crash quickly and confidently.
+
+Recommended reading:
+
+- <https://betterexplained.com/articles/understanding-big-and-little-endian-byte-order/>
+- <https://medium.com/coderscorner/byte-ordering-e4737416d906>
+- <https://devopedia.org/byte-ordering>
+- <https://www.geeksforgeeks.org/dsa/little-and-big-endian-mystery/>
+
+Disclaimer: This article was written with AI assistance, for a bit of brainstorming and proofreading.

content/writing/utterances-comments.md

@@ -1,11 +1,9 @@
-+++
-title = "What say you?"
-description = "Adding a comment system by utterances"
-author = "mockingspectre"
-date = 2023-08-24T15:34:14.160Z
-[taxonomies]
-tags = ["blog", "utterances"]
-+++
+---
+title: "What say you?"
+description: "Adding a comment system by utterances"
+date: "2023-08-24"
+tags: ["blog", "utterances"]
+---
 
 Free speech enhanced
 

content/writing/vuejs-tailwind.md

@@ -1,15 +1,14 @@
-+++
-title = "Configure Vue.js app With Tailwind CSS"
-description = "Tailwindcss in vuejs "
-author = "mockingspectre"
-date = 2021-06-12
-[taxonomies]
-tags = ["javascript", "vuejs" , "tailwindcss"]
-+++
+---
+title: "Configure Vue.js app With Tailwind CSS"
+description: "Tailwindcss in vuejs "
+date: "2021-06-12"
+tags: ["javascript", "vuejs", "tailwindcss"]
+---
+
 A guide on how to use [Tailwind CSS](https://tailwindcss.com/) in your Vue project.
 
->**Note**  
-> This article was originaly published on my old  medium blog. I moved it here for archival purposes.
+> **Note**  
+> This article was originally published on my old medium blog. I moved it here for archival purposes.
 
 Tailwind is a utility-first CSS framework for rapidly building custom user interfaces. It is an un-opinionated framework which means that it doesn't come with custom configurations like Bootstrap or Bulma(Yeah, I know, no one should tell you how to live your life).
 
@@ -59,7 +58,7 @@ module.exports = {
     extend: {},
   },
   plugins: [],
-}
+};
 ```
 
 It will also create a `postcss.config.js` file that includes tailwindcss and autoprefixer already configured.Postcss is needed to process tailwind:
@@ -71,7 +70,7 @@ module.exports = {
     tailwindcss: {},
     autoprefixer: {},
   },
-}
+};
 ```
 
 ## Configure Tailwind to remove unused styles in production
@@ -80,17 +79,17 @@ In your tailwind.config.js file, configure the purge option with the paths to al
 
 ```js
 // tailwind.config.js
-  module.exports = {
-    purge: ['./index.html', './src/**/*.{vue,js,ts,jsx,tsx}'],
-    darkMode: false, // or 'media' or 'class'
-    theme: {
-      extend: {},
-    },
-    variants: {
-      extend: {},
-    },
-    plugins: [],
-  }
+module.exports = {
+  purge: ['./index.html', './src/**/*.{vue,js,ts,jsx,tsx}'],
+  darkMode: false, // or 'media' or 'class'
+  theme: {
+    extend: {},
+  },
+  variants: {
+    extend: {},
+  },
+  plugins: [],
+};
 ```
 
 ## Include Tailwind in your CSS
@@ -112,11 +111,11 @@ Finally, ensure your CSS file is being imported in your `./src/main.js` file:
 
 ```js
 // src/main.js
-import { createApp } from 'vue'
-import App from './App.vue'
-import './index.css'
+import { createApp } from 'vue';
+import App from './App.vue';
+import './index.css';
 
-createApp(App).mount('#app')
+createApp(App).mount('#app');
 ```
 
 You're finished! Now when you run npm run dev, Tailwind CSS will be ready to use in your Vue app! You can now proceed to create awesome stuff

content/writing/what-is-pwn.md

@@ -0,0 +1,148 @@
+---
+title: "What is pwn?"
+description: "No not that one"
+date: "2025-09-03"
+tags: ["blog"]
+---
+
+> Binary Exploitation is a broad topic within Cyber Security which really comes down to finding a vulnerability in the program and exploiting it to gain control of a shell or modifying the program's functions ~ctf101
+
+In most challenges, you’ll be given a Linux binary to exploit, and occasionally a Windows executable. The goal is to find a way to get the program to run in a way that was not intended.
+
+Over the course of this series, we will look at the basics of a binary from simple to advanced concepts. This will be a multipart post covering the concepts over a couple of months. I’ll also use it as a reference to track my own progress.
+
+> This assumes that the reader has some significant experience with programming, i will not be explaining how to write software. The tutorials will be in C, simple enough while being low level for some of the things well do. I recommend reading :
+>
+> _[The C Programming Language](https://www.amazon.com/Programming-Language-2nd-Brian-Kernighan/dp/0131103628)_[, 2nd Edition, by Brian W. Kernighan and Dennis M. Ritchie (Prentice Hall, 1988).](https://www.amazon.com/Programming-Language-2nd-Brian-Kernighan/dp/0131103628)
+
+---
+
+## Concepts to Cover
+
+This roadmap will take you from _“I don’t know how the stack works”_ to _“I can write exploits for CTFs and understand real-world CVEs.”_
+
+### **Episode 1: Getting Started**
+
+- Why binary exploitation matters (CTFs, real-world, research).
+- Computer architecture basics (x86/x64 registers, stack vs heap, memory layout).
+- Compiling and running simple C programs.
+- Intro to ELF binaries.
+
+---
+
+### **Episode 2: Assembly & Tools Crash Course**
+
+- Function calls in assembly (prologue/epilogue, stack frames).
+- Common instructions (`mov`, `call`, `jmp`, `ret`).
+- Debugging with `gdb`, `gef`/`pwndbg`.
+- Disassembly with `objdump`, `radare2`, and `Ghidra`.
+
+---
+
+### **Episode 3: Memory Corruption 101**
+
+- What is a segmentation fault?
+- Stack buffer overflows (first crashes).
+- Off-by-one errors.
+- Writing your first shellcode and executing it locally.
+
+---
+
+### **Episode 4: Exploiting Control Flow**
+
+- Overwriting return addresses.
+- NOP sleds and shellcode execution.
+- Return-to-libc attacks (ret2libc).
+- Environment variables and argument tricks.
+
+---
+
+### **Episode 5: Format String Vulnerabilities**
+
+- How `printf` becomes an exploit primitive.
+- Memory leaks via format strings.
+- Overwriting memory using `%n`.
+
+---
+
+### **Episode 6: Modern Protections & Bypasses (Part 1)**
+
+- NX (non-executable stack) and its bypass with ROP.
+- Intro to ROP gadgets and building small chains.
+- Automating with Pwntools and ROPgadget.
+
+---
+
+### **Episode 7: Modern Protections & Bypasses (Part 2)**
+
+- ASLR: how randomization works.
+- Leaking addresses to defeat ASLR.
+- Stack canaries and partial overwrites.
+
+---
+
+### **Episode 8: Heap Exploitation (Basics)**
+
+- Understanding malloc/free and heap metadata.
+- Classic heap overflows.
+- Use-after-free and double free.
+- Simple heap exploitation demos.
+
+---
+
+### **Episode 9: Heap Exploitation (Advanced)**
+
+- Unlink attacks and unsafe unlink.
+- Fastbin dup tricks.
+- The “House of” techniques:
+  - House of Force
+  - House of Spirit
+  - House of Lore
+  - House of Einherjar
+
+- Tcache poisoning in modern glibc.
+
+---
+
+### **Episode 10: Advanced Exploitation Techniques**
+
+- GOT/PLT overwrites.
+- Ret2dlresolve.
+- Sigreturn-oriented programming (SROP).
+- JOP (Jump-Oriented Programming).
+
+---
+
+### **Episode 11: Kernel & Windows Exploitation (Intro)**
+
+- Userland vs kernel space.
+- Exploiting syscalls for privilege escalation.
+- Windows basics: SEH overwrites, DEP/ASLR bypass.
+- Kernel driver exploitation.
+
+---
+
+### **Episode 12: Modern Defenses & Mitigations**
+
+- Control-Flow Integrity (CFI).
+- Shadow stacks & CET.
+- Hardened malloc and allocator security.
+- Sandboxing & seccomp-bpf.
+
+---
+
+### **Episode 13: Exploit Workflow in Practice**
+
+- Solving a CTF challenge step-by-step.
+- Remote exploitation (exploiting over sockets).
+- Exploit reliability (stability, bruteforcing).
+- Post-exploitation steps (getting a shell, escalating privileges).
+
+---
+
+### **Episode 14: Beyond the Basics**
+
+- Automating exploit discovery with fuzzing (AFL, honggfuzz).
+- Symbolic execution with angr.
+- Real-world case studies (Heartbleed, Dirty COW, Shellshock).
+- Writing weaponized exploits responsibly.

content/writing/wifi-hotspot-arch.md

@@ -0,0 +1,80 @@
+---
+title: "The One Thing Nobody Tells You About WiFi Hotspots on Arch Linux"
+description: "A minimal Arch install is great until NetworkManager silently fails to find a binary you didn't know you needed"
+date: "2026-04-16"
+tags: ["arch", "linux", "networking", "kde"]
+---
+
+I spent longer than I'd like to admit trying to get a simple WiFi hotspot running on Arch. Not because it's hard — it genuinely isn't — but because of one missing piece that the NetworkManager documentation buries so deep you'd think it was classified.
+
+For context: I'm running a minimal Arch Linux install with KDE Plasma. No bloat, no extras, just what I explicitly put there. Which, as it turns out, is exactly why this bit me.
+
+Here's the whole story, and more importantly, the fix.
+
+## It starts innocently enough
+
+You fire up `nmcli`, throw together what looks like a perfectly reasonable hotspot command, and get slapped with this:
+
+```
+Error: Connection activation failed: IP configuration could not be reserved (no available address, timeout, etc.)
+```
+
+Vague. Unhelpful. The kind of error message that was clearly written by someone who never had to debug it.
+
+Your first instinct is probably to check if your WiFi card even supports AP mode — reasonable. Mine does. Maybe NetworkManager picked the wrong interface — also reasonable, so you specify `ifname wlp61s0` explicitly. Still fails. You check for a conflicting `dnsmasq` service. It doesn't even exist on the system.
+
+At this point the error message has told you nothing useful, and you're running out of obvious things to blame.
+
+## The actual culprit
+
+Dig into the NetworkManager journal and you'll find the real error hiding two lines below the surface:
+
+```
+device (wlp61s0): ip:shared4: could not start dnsmasq: Could not find "dnsmasq" binary
+```
+
+There it is. NetworkManager's hotspot mode uses `dnsmasq` internally to hand out IP addresses to devices that connect to your hotspot. It doesn't use the system `dnsmasq` service — it manages its own instance entirely in the background. But it does need the binary to actually exist on your machine.
+
+On a minimal Arch install, it doesn't come pre-installed — and if you're not pulling in a full desktop environment with all its recommended packages, nothing drags it in for you either. So the whole thing silently falls apart at the IP configuration stage, and you get that useless generic error instead of "hey, install dnsmasq."
+
+The fix is one line:
+
+```bash
+sudo pacman -S dnsmasq
+```
+
+Don't enable it, don't start it. Just having it on the system is enough. NetworkManager will find it and handle the rest.
+
+## Getting internet to actually work
+
+Once the hotspot is up, you'll notice connected devices get an IP but no internet. The hotspot being active and internet being shared are two separate things — your machine needs to be explicitly told to forward traffic between its WiFi and ethernet interfaces.
+
+First, tell the kernel it's allowed to forward packets at all:
+
+```bash
+sudo sysctl -w net.ipv4.ip_forward=1
+```
+
+Then set up NAT so traffic from WiFi clients gets routed out through your ethernet connection and back:
+
+```bash
+sudo iptables -t nat -A POSTROUTING -o enp0s31f6 -j MASQUERADE
+sudo iptables -A FORWARD -i wlp61s0 -o enp0s31f6 -j ACCEPT
+sudo iptables -A FORWARD -i enp0s31f6 -o wlp61s0 -m state --state RELATED,ESTABLISHED -j ACCEPT
+```
+
+Swap out `enp0s31f6` and `wlp61s0` for whatever your ethernet and WiFi interfaces are actually named. After that, clients connecting to your hotspot will have full internet access.
+
+These settings don't survive a reboot, so if you want them permanent, save them:
+
+```bash
+echo "net.ipv4.ip_forward=1" | sudo tee /etc/sysctl.d/99-ipforward.conf
+sudo iptables-save | sudo tee /etc/iptables/iptables.rules
+sudo systemctl enable iptables
+```
+
+## The short version
+
+If your NetworkManager hotspot is failing on Arch, install `dnsmasq`. That's almost certainly it. The error message won't tell you that, the hotspot command won't tell you that, but the journal will — and now so does this article.
+
+Everything else is just routing.

cspell.json

@@ -0,0 +1,17 @@
+{
+  "version": "0.2",
+  "language": "en",
+  "files": ["content/**/*.md"],
+  "dictionaries": ["project-words"],
+  "dictionaryDefinitions": [
+    { "name": "project-words", "path": "./.cspell/words.txt", "addWords": true }
+  ],
+  "ignoreRegExpList": [
+    "/^\\s*```[\\s\\S]*?^\\s*```/gm",
+    "/`[^`\\n]+`/g",
+    "/\\$\\$[\\s\\S]*?\\$\\$/g",
+    "/\\$[^$\\n]+\\$/g",
+    "/\\b[0-9a-f]{16,}\\b/gi",
+    "/\\w+\\{[^}\\n]*\\}/g"
+  ]
+}

next.config.ts

@@ -0,0 +1,11 @@
+import type { NextConfig } from "next";
+
+const nextConfig: NextConfig = {
+  reactCompiler: true,
+  // Fully static site: `next build` writes plain files to ./out for static-web-server.
+  output: "export",
+  // The site uses plain <img>, not next/image.
+  images: { unoptimized: true },
+};
+
+export default nextConfig;

package.json

@@ -0,0 +1,58 @@
+{
+  "name": "andwati-nextgen",
+  "version": "0.1.0",
+  "private": true,
+  "scripts": {
+    "dev": "next dev",
+    "build": "next build",
+    "start": "next start",
+    "lint": "biome check",
+    "format": "biome format --write",
+    "lint:content": "prettier --check \"content/**/*.md\" && cspell --no-progress",
+    "format:content": "prettier --write \"content/**/*.md\"",
+    "spell": "cspell --no-progress",
+    "check": "biome check && pnpm lint:content",
+    "prepare": "husky"
+  },
+  "dependencies": {
+    "gray-matter": "^4.0.3",
+    "katex": "^0.18.9",
+    "next": "16.3.6",
+    "next-mdx-remote": "^6.0.0",
+    "react": "19.2.8",
+    "react-dom": "19.2.8",
+    "rehype-katex": "^7.0.1",
+    "rehype-pretty-code": "^0.14.5",
+    "rehype-raw": "^7.0.0",
+    "rehype-stringify": "^10.0.1",
+    "remark-gfm": "^4.0.1",
+    "remark-math": "^6.0.0",
+    "remark-parse": "^11.0.0",
+    "remark-rehype": "^11.1.2",
+    "shiki": "^4.4.3",
+    "unified": "^11.0.5"
+  },
+  "devDependencies": {
+    "@biomejs/biome": "2.4.2",
+    "@tailwindcss/postcss": "^4",
+    "@tailwindcss/typography": "^0.5.20",
+    "@types/node": "^20",
+    "@types/react": "^19",
+    "@types/react-dom": "^19",
+    "babel-plugin-react-compiler": "1.0.0",
+    "cspell": "^10.3.5",
+    "husky": "^9.1.7",
+    "lint-staged": "^17.6.0",
+    "prettier": "^3.9.9",
+    "tailwindcss": "^4",
+    "typescript": "^5"
+  },
+  "packageManager": "[email protected]",
+  "lint-staged": {
+    "content/**/*.md": [
+      "prettier --write",
+      "cspell --no-progress --no-must-find-files"
+    ],
+    "*.{ts,tsx,mjs,json,css}": "biome check --write --no-errors-on-unmatched"
+  }
+}

pnpm-workspace.yaml

@@ -0,0 +1,2 @@
+allowBuilds:
+  sharp: false

postcss.config.mjs

@@ -0,0 +1,7 @@
+const config = {
+  plugins: {
+    "@tailwindcss/postcss": {},
+  },
+};
+
+export default config;

public/.well-known/pgp-key.txt

@@ -0,0 +1,13 @@
+-----BEGIN PGP PUBLIC KEY BLOCK-----
+
+mDMEalcjtBYJKwYBBAHaRw8BAQdA55X1mRCKw9DA35kCAy+7Z30ye0rUHWBZsl7O
+Wmar+RS0IklhbiBBbmR3YXRpIDxhbmR3YXRpaWFuQGdtYWlsLmNvbT6IkwQTFgoA
+OxYhBK1YqreiDYUjy/WaeR8g/tCqBbDaBQJqVyO0AhsDBQsJCAcCAiICBhUKCQgL
+AgQWAgMBAh4HAheAAAoJEB8g/tCqBbDace8BAN1SpkEMSYll+XupKHiaIUwnhm4N
+eS79G1i+345Gl6CyAQDjgn+3rzG6sexjKh+10EKiy5omsQEGzUW03s7gS0T1Drg4
+BGpXI7QSCisGAQQBl1UBBQEBB0CXofBIYYXG2+dZqgllhsbkNPF4qlyfPgbRW+zb
+7Kw3IAMBCAeIeAQYFgoAIBYhBK1YqreiDYUjy/WaeR8g/tCqBbDaBQJqVyO0AhsM
+AAoJEB8g/tCqBbDauMkA/RG4iqtPZOI3DQzFJYu7SnxaD81vdP0LyTLKDQkynySu
+AQDrlWyF8LRlad4iX1yQPCuOV0aUpTNq5kPlWurtX99/BQ==
+=uKsS
+-----END PGP PUBLIC KEY BLOCK-----

public/.well-known/security.txt

@@ -0,0 +1,17 @@
+-----BEGIN PGP SIGNED MESSAGE-----
+Hash: SHA512
+
+Contact: mailto:[email protected]
+Expires: 2027-07-16T00:00:00.000Z
+Encryption: https://andwati.com/.well-known/pgp-key.txt
+Encryption: https://keys.openpgp.org/vks/v1/by-fingerprint/AD58AAB7A20D8523CBF59A791F20FED0AA05B0DA
+Encryption: https://keyserver.ubuntu.com/pks/lookup?op=get&search=0xAD58AAB7A20D8523CBF59A791F20FED0AA05B0DA
+Preferred-Languages: en
+Canonical: https://andwati.com/.well-known/security.txt
+-----BEGIN PGP SIGNATURE-----
+
+iHUEARYKAB0WIQStWKq3og2FI8v1mnkfIP7QqgWw2gUCaljXlQAKCRAfIP7QqgWw
+2qAoAP0Q7Cc0YsP2dvV7fqDlqcnjuJepQQSTZBz7ehkPyjGV5gEA3K9ZqQmuI2ea
+KKADWxuKTTY43PBmuV9rMqLm8ZOPlAY=
+=NUkY
+-----END PGP SIGNATURE-----

sass/site.scss

@@ -1,362 +0,0 @@
-/* TODO: Future considerations.
-   - Reset all margin and padding for * to 0.
-   - Use the <abbr> tag for abbreviations.
-   - Support footnotes or asides for notes sections.
-   - Serve fonts from the local server rather than Google's API.
-   - Support a "display title" in an [extra] section to allow for <br> elements
-     or other manual control over title display. */
-
-@charset "utf-8";
-@import url('https://fonts.googleapis.com/css?family=Noto+Sans|Noto+Serif|Noto+Sans+Mono');
-
-:root {
-  /* Fonts and Text Sizes */
-  --default-serif-font: "Noto Serif", serif;
-  --default-sans-font: "Noto Sans", sans-serif;
-  --default-mono-font: "Noto Sans Mono", monospace;
-  --default-font-size: 14px;
-  --header-font-size: 2.0em;
-  /* Not sure I like this as the default, but it keeps inline code blocks from
-          overlapping. */
-  --default-line-height: 1.5;
-
-  /* Gruvbox Dark Colors */
-  --background-color: #1d2021;
-  --foreground-color: #ebdbb2;
-  --link-color: #458588;
-  --muted-color: #928374;
-  --primary-accent-color: #b16286;
-  --secondary-accent-color: #689d6a;
-  --code-background-color: #282828;
-  --inline-code-background-color: #3c3836;
-}
-
-.accent {
-  color: var(--primary-accent-color);
-}
-
-/* Required for sticky footer. */
-html,
-body {
-  height: 100%;
-}
-
-body {
-  display: flex;
-  /* Required for sticky footer. */
-  flex-direction: column;
-  /* Required for sticky footer. */
-  margin: 0;
-  line-height: var(--default-line-height);
-  font-size: var(--default-font-size);
-  font-family: var(--default-serif-font);
-  background-color: var(--background-color);
-  color: var(--foreground-color);
-  border-top: 0.5em solid var(--primary-accent-color);
-}
-
-main {
-  flex: 1 0 auto;
-  /* Required for sticky footer. */
-}
-
-/* FIXME: For reasons that utterly bewilder me, an <article> with this id needs
-        to be inside a <main> with no id. I have a strong feeling I've done
-        something wrong here. */
-#content {
-  max-width: 48em;
-  margin-left: auto;
-  margin-right: auto;
-  padding-right: 1.4em;
-  padding-left: 1.4em;
-  padding-bottom: 1.4em;
-}
-
-header {
-  overflow: hidden;
-  /* FIXME: This WILL cut off titles that are too long! */
-  margin-top: 1.4em;
-  margin-bottom: 1.4em;
-  margin-left: 1em;
-  margin-right: 1em;
-}
-
-header>div.logo {
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  justify-content: center;
-}
-
-header>h1 {
-  text-align: center;
-  font-size: var(--header-font-size);
-  font-family: var(--default-sans-font);
-  padding-top: 2.8rem;
-  margin-top: 0;
-  margin-bottom: 0.7rem;
-}
-
-header .post-meta {
-  text-align: center;
-  padding-top: 0.5em;
-  padding-bottom: 0.9em;
-  margin-bottom: 0;
-}
-
-.post-meta time {
-  // TODO: This color doesn't look great in with a light color scheme...
-  color: var(--muted-color);
-}
-
-h2,
-h3,
-h4,
-h5,
-h6 {
-  padding-top: 1.2rem;
-  margin-bottom: 0.2rem;
-}
-
-
-p {
-  padding-top: 0.4em;
-  margin-bottom: 1em;
-}
-
-blockquote {
-  /* Default text uses serif, so use sans-serif to differentiate quoted text. */
-  font-family: var(--default-sans-font);
-  font-style: italic;
-  /* Indent blockquotes, but align the start with where text in code begins. */
-  margin: 0 1.25rem;
-  padding-left: 1.25rem;
-  padding-right: 1.25rem;
-  border-left: 3px solid var(--secondary-accent-color);
-}
-
-a {
-  color: var(--link-color);
-  text-decoration: none;
-}
-
-/* ---- Anchor links --------------------------------------------------------*/
-
-/* Add a # to the left of a subheading when it references an internal link... */
-:where(h2, h3, h4, h5, h6)>a[href^="#"]::before {
-  content: "#";
-  display: inline-block;
-  width: 1.2rem;
-  margin-left: -1.2rem;
-  opacity: 0;
-}
-
-/* ... but only display the internal anchor link when hovered over. */
-:where(h2, h3, h4, h5, h6):hover>a[href^="#"]::before {
-  opacity: 1;
-}
-
-/* When internal links are linked directly, display with the accent color. */
-:where(h2, h3, h4, h5, h6):target>a[href^="#"]::before {
-  opacity: 1;
-  color: var(--primary-accent-color);
-}
-
-/* ---- Media ---------------------------------------------------------------*/
-
-img.logo {
-  width: 64px;
-  height: 64px;
-}
-
-img,
-video {
-  /* Media should fill the width of its container if possible. */
-  width: 100%;
-  height: auto;
-}
-
-figure {
-  /* Don't add margins to figures. */
-  margin: 0;
-}
-
-figcaption {
-  /* De-emphasize figure captions. */
-  font-size: 0.85rem;
-  color: var(--muted-color);
-}
-
-/* ---- Code blocks ---------------------------------------------------------*/
-
-pre {
-  display: block;
-  padding: 0.25rem 1.25rem;
-  font-size: 85%;
-  border-left: 0.25rem solid var(--primary-accent-color);
-}
-
-code {
-  padding: 0 0.4rem;
-  // background-color: #3c3836;
-  background-color: var(--inline-code-background-color);
-  /* Inline code blocks look less aggresive with a little rounding. */
-  border-radius: 2px;
-}
-
-pre,
-code {
-  overflow: auto;
-  font-family: var(--default-mono-font);
-}
-
-/* Without this the <code> tag gains a little padding that offsets text by like
-        2 pixels. Let's *not* do that. */
-pre>code {
-  padding: 0;
-  background-color: var(--code-background-color);
-  // Code inside a pre block doesn't need rounded borders.
-  border-radius: unset;
-}
-
-/* ---- Tables --------------------------------------------------------------*/
-
-table {
-  /* FIXME: Use flexbox for centering? Frankly, this is still bad on mobile.
-       display: flex;
-       justify-content: center;
-       */
-  display: block;
-  overflow-x: auto;
-  margin-left: auto;
-  margin-right: auto;
-  text-align: left;
-  border-collapse: collapse;
-}
-
-/* Headers in a row (column scoped) get a colored bottom border. */
-th[scope="col"] {
-  padding-top: 0.4em;
-  border-bottom: 3px solid var(--secondary-accent-color);
-}
-
-/* Headers in a column (row scoped) get a colored right border. */
-th[scope="row"] {
-  border-right: 3px solid var(--secondary-accent-color);
-}
-
-td {
-  text-align: center;
-  border: 1px solid var(--muted-color);
-}
-
-th,
-td {
-  vertical-align: bottom;
-  padding-left: 0.4em;
-  padding-right: 0.4em;
-  border: 1px solid var(--muted-color);
-}
-
-/* ---- Footer, nav, and copyright ------------------------------------------*/
-
-footer {
-  border-top: 0.5em solid var(--primary-accent-color);
-  text-align: center;
-  /* FIXME: Using the code background color could look awkward if a post ends
-          in a code snippet. */
-  background-color: var(--code-background-color);
-  padding: 1.4em;
-  flex-shrink: 0;
-  /* Required for sticky footer. */
-}
-
-footer a {
-  color: var(--secondary-accent-color);
-}
-
-/* Give footer nav links some breathing room. */
-footer>nav>a {
-  // margin: 0 1.4em;
-  margin: 0 0.4em;
-}
-
-/* FIXME: This could probably go away with global margin/padding adjustments. */
-footer p {
-  padding-top: 0;
-}
-
-footer p,
-footer a {
-  font-family: var(--default-sans-font);
-  /* It doesn't seem as though Google fonts support direct usage of OpenType
-          features like 'c2sc' and 'smcp'.
-     
-          FIXME: It's not clear why numerals don't seem to obey this property. */
-  font-variant-caps: all-small-caps;
-}
-
-/* ---- Media Queries ------------------------------------------------------ */
-
-@media(min-width: 427px) {
-  :root {
-    --default-font-size: 16px
-  }
-}
-
-@media(min-width: 470px) {
-  :root {
-    --default-font-size: 17px;
-  }
-
-  /* Above this size, increase the header margins. Smaller sizes benefit from
-          extra breathing room in the title. */
-  header {
-    margin-left: 2.8em;
-    margin-right: 2.8em;
-  }
-
-  header>div.logo {
-    flex-direction: row;
-  }
-
-  img.logo {
-    margin-right: 0.8em;
-  }
-}
-
-@media(min-width: 625px) {
-  :root {
-    --default-font-size: 18px;
-  }
-}
-
-@media(min-width: 802px) {
-  :root {
-    --default-font-size: 19px;
-  }
-}
-
-@media(min-width: 1003px) {
-  :root {
-    --default-font-size: 20px;
-  }
-}
-
-@media(min-width: 1225px) {
-  :root {
-    --default-font-size: 21px;
-  }
-
-  /* On larger devices, give the anchor link some more space. */
-  :where(h2, h3, h4, h5, h6)>a[href^="#"]::before {
-    width: 1.8rem;
-    margin-left: -1.8rem;
-  }
-}
-
-@media(min-width: 1496px) {
-  :root {
-    --default-font-size: 22px;
-  }
-}

src/app/feed.json/route.ts

@@ -0,0 +1,29 @@
+import { getFeedItems } from "@/lib/feed";
+import { abs, site } from "@/lib/site";
+
+export const dynamic = "force-static";
+
+export async function GET() {
+  const items = await getFeedItems();
+  const feed = {
+    version: "https://jsonfeed.org/version/1.1",
+    title: site.name,
+    home_page_url: site.baseUrl,
+    feed_url: abs("/feed.json"),
+    description: site.description,
+    language: "en",
+    authors: [{ name: site.name, url: site.baseUrl }],
+    items: items.map((i) => ({
+      id: i.url,
+      url: i.url,
+      title: i.title,
+      summary: i.description,
+      content_html: i.html,
+      date_published: i.date.toISOString(),
+      tags: i.tags,
+    })),
+  };
+  return new Response(JSON.stringify(feed), {
+    headers: { "Content-Type": "application/feed+json; charset=utf-8" },
+  });
+}

src/app/globals.css

@@ -0,0 +1,111 @@
+@import "tailwindcss";
+@plugin "@tailwindcss/typography";
+
+@theme {
+  --breakpoint-sm: 30rem;
+  --breakpoint-lg: 62rem;
+
+  --font-sans: var(--font-lora), ui-serif, Georgia, serif;
+
+  --color-gray-100: #edf2f7;
+  --color-gray-200: #e2e8f0;
+  --color-gray-400: #a0aec0;
+  --color-gray-500: #718096;
+  --color-gray-600: #4a5568;
+  --color-gray-800: #1a202c;
+  --color-blue-500: #3182ce;
+  --color-blue-600: #2b6cb0;
+}
+
+body {
+  background: #fff;
+  color: var(--color-gray-800);
+  font-family: var(--font-sans);
+  line-height: 1.5;
+}
+
+/* Prose overrides mirroring adammaj.com's chakra-ui-prose config */
+hr {
+  width: 100%;
+  height: 0;
+  border: 0;
+  border-bottom: 1px solid var(--color-gray-200);
+  opacity: 0.6;
+}
+
+.prose {
+  line-height: 1.5;
+  --tw-prose-body: var(--color-gray-800);
+  --tw-prose-headings: var(--color-gray-800);
+  --tw-prose-links: var(--color-blue-500);
+  max-width: none;
+}
+.prose :where(h1, h2, h3, h4):not(:where(.not-prose *)) {
+  margin-top: 1rem;
+  margin-bottom: 1rem;
+}
+.prose :where(p):not(:where(.not-prose *)) {
+  margin-top: 0.75rem;
+  margin-bottom: 0.75rem;
+}
+.prose :where(a):not(:where(.not-prose *)) {
+  color: var(--color-blue-500);
+  font-weight: inherit;
+  text-decoration: underline;
+}
+.prose :where(pre):not(:where(.not-prose *)) {
+  background: #f6f8fa;
+  color: var(--color-gray-800);
+  border: 1px solid #e1e4e8;
+}
+.prose :where(code):not(:where(pre *)):not(:where(.not-prose *))::before,
+.prose :where(code):not(:where(pre *)):not(:where(.not-prose *))::after {
+  content: none;
+}
+
+.callout {
+  margin: 1rem 0;
+  padding: 0.25rem 1rem;
+  border-left: 4px solid var(--color-blue-500);
+  border-radius: 0 0.375rem 0.375rem 0;
+  background: rgb(49 130 206 / 0.05);
+}
+.callout-tip {
+  border-color: #10b981;
+  background: rgb(16 185 129 / 0.05);
+}
+.callout-warning {
+  border-color: #f59e0b;
+  background: rgb(245 158 11 / 0.05);
+}
+.callout-danger {
+  border-color: #ef4444;
+  background: rgb(239 68 68 / 0.05);
+}
+
+.youtube {
+  position: relative;
+  margin: 1rem 0;
+  aspect-ratio: 16 / 9;
+  overflow: hidden;
+  border-radius: 0.375rem;
+}
+.youtube iframe {
+  width: 100%;
+  height: 100%;
+  border: 0;
+}
+
+/* Shiki (rehype-pretty-code): theme colours are inline; keep block chrome from .prose pre */
+pre[data-language] {
+  overflow-x: auto;
+  padding: 1rem;
+  border-radius: 0.375rem;
+  font-size: 0.875rem;
+  line-height: 1.6;
+}
+pre[data-language] code {
+  background: none;
+  padding: 0;
+  font-size: inherit;
+}

src/app/layout.tsx

@@ -0,0 +1,107 @@
+import type { Metadata, Viewport } from "next";
+import { Lora } from "next/font/google";
+import Script from "next/script";
+import { JsonLd } from "@/components/JsonLd";
+import { Layout } from "@/components/Layout";
+import { site } from "@/lib/site";
+import "./globals.css";
+import "katex/dist/katex.min.css";
+
+const lora = Lora({
+  variable: "--font-lora",
+  subsets: ["latin"],
+  display: "swap",
+});
+
+export const viewport: Viewport = { themeColor: "#ffffff" };
+
+export const metadata: Metadata = {
+  metadataBase: new URL(site.baseUrl),
+  title: { default: site.title, template: `%s | ${site.name}` },
+  description: site.description,
+  keywords: site.keywords,
+  authors: [{ name: site.name, url: site.baseUrl }],
+  creator: site.name,
+  publisher: site.name,
+  openGraph: {
+    siteName: site.name,
+    type: "website",
+    locale: site.locale,
+    url: "/",
+    title: site.title,
+    description: site.description,
+  },
+  twitter: {
+    card: "summary_large_image",
+    site: site.twitter,
+    creator: site.twitter,
+  },
+  robots: {
+    index: true,
+    follow: true,
+    googleBot: {
+      index: true,
+      follow: true,
+      "max-image-preview": "large",
+      "max-snippet": -1,
+    },
+  },
+};
+
+const websiteLd = {
+  "@context": "https://schema.org",
+  "@type": "WebSite",
+  name: site.name,
+  alternateName: site.tagline,
+  url: site.baseUrl,
+  inLanguage: "en",
+  author: { "@type": "Person", name: site.name },
+};
+
+const isProd = process.env.NODE_ENV === "production";
+const gaId = "G-9XLTKZF07C";
+
+const umamiScript = process.env.PUBLIC_UMAMI_SCRIPT_URL;
+const umamiId = process.env.PUBLIC_UMAMI_WEBSITE_ID;
+
+export default function RootLayout({ children }: LayoutProps<"/">) {
+  return (
+    <html lang="en" className={lora.variable}>
+      <head>
+        <link
+          rel="alternate"
+          type="application/rss+xml"
+          title={`${site.name} RSS`}
+          href="/rss.xml"
+        />
+        <link
+          rel="alternate"
+          type="application/feed+json"
+          title={`${site.name} JSON Feed`}
+          href="/feed.json"
+        />
+      </head>
+      <body>
+        <JsonLd data={websiteLd} />
+        <Layout>{children}</Layout>
+        {isProd && (
+          <>
+            <Script
+              src={`https://www.googletagmanager.com/gtag/js?id=${gaId}`}
+              strategy="afterInteractive"
+            />
+            <Script id="google-analytics" strategy="afterInteractive">
+              {`window.dataLayer = window.dataLayer || [];
+function gtag(){dataLayer.push(arguments);}
+gtag('js', new Date());
+gtag('config', '${gaId}');`}
+            </Script>
+          </>
+        )}
+        {isProd && umamiScript && umamiId && (
+          <Script defer src={umamiScript} data-website-id={umamiId} />
+        )}
+      </body>
+    </html>
+  );
+}

src/app/llms.txt/route.ts

@@ -0,0 +1,38 @@
+import { getBooks, getWritings } from "@/lib/content";
+import { abs, site } from "@/lib/site";
+
+export const dynamic = "force-static";
+
+export function GET() {
+  const body = `# ${site.name}
+
+> ${site.description}
+
+${site.name} (also known as ${site.alias}) is a software engineer and the captain of the binarysith CTF team. This site collects his original essays, CTF writeups, reading list and projects.
+
+## Writing
+
+${getWritings()
+  .map(
+    (p) =>
+      `- [${p.data.title}](${abs(`/writing/${p.slug}`)})${p.data.description ? `: ${p.data.description}` : ""}`,
+  )
+  .join("\n")}
+
+## Reading
+
+${getBooks()
+  .map((b) => `- [${b.data.title}](${abs(`/reading/${b.slug}`)})`)
+  .join("\n")}
+
+## Other
+
+- [About](${abs("/")})
+- [Portfolio](${abs("/portfolio")})
+- [RSS](${abs("/rss.xml")})
+- [Sitemap](${abs("/sitemap.xml")})
+`;
+  return new Response(body, {
+    headers: { "Content-Type": "text/plain; charset=utf-8" },
+  });
+}

src/app/not-found.tsx

@@ -0,0 +1,5 @@
+import { redirect } from "next/navigation";
+
+export default function NotFound() {
+  redirect("/");
+}

src/app/opengraph-image.tsx

@@ -0,0 +1,11 @@
+import { ogContentType, ogImage, ogSize } from "@/lib/og";
+import { site } from "@/lib/site";
+
+export const alt = site.title;
+export const size = ogSize;
+export const dynamic = "force-static";
+export const contentType = ogContentType;
+
+export default function Image() {
+  return ogImage(site.name, "Software engineer · CTF player");
+}

src/app/page.tsx

@@ -0,0 +1,44 @@
+import type { Metadata } from "next";
+import { JsonLd } from "@/components/JsonLd";
+import { Mdx } from "@/components/Mdx";
+import { getAbout } from "@/lib/content";
+import { site } from "@/lib/site";
+
+export const metadata: Metadata = {
+  alternates: { canonical: "/" },
+};
+
+const personLd = {
+  "@context": "https://schema.org",
+  "@type": "Person",
+  name: site.name,
+  alternateName: site.alias,
+  url: site.baseUrl,
+  jobTitle: "Software Engineer",
+  description: site.description,
+  sameAs: site.sameAs,
+  knowsAbout: [
+    "Cyber security",
+    "Capture the flag",
+    "Binary exploitation",
+    "Reverse engineering",
+    "Low-level programming",
+    "Distributed systems",
+    "Compiler design",
+    "Database internals",
+  ],
+  memberOf: {
+    "@type": "Organization",
+    name: "binarysith",
+    url: "https://ctftime.org/team/379200",
+  },
+};
+
+export default function Home() {
+  return (
+    <div className="prose">
+      <JsonLd data={personLd} />
+      <Mdx source={getAbout()} />
+    </div>
+  );
+}

src/app/portfolio/page.tsx

@@ -0,0 +1,46 @@
+import type { Metadata } from "next";
+import { Mdx } from "@/components/Mdx";
+import { getPortfolio } from "@/lib/content";
+
+export const metadata: Metadata = {
+  title: "Portfolio",
+  description: "Projects and infrastructure-level software by Ian Andwati.",
+  alternates: { canonical: "/portfolio" },
+};
+
+export default function PortfolioPage() {
+  const items = getPortfolio();
+  return (
+    <div className="flex flex-col gap-4">
+      <h1 className="sr-only">Portfolio</h1>
+      <hr />
+      {items.map((item) => (
+        <div key={item.slug} className="flex flex-col gap-4">
+          <div className="flex flex-col gap-1">
+            <h2 className="font-bold">{item.data.title}</h2>
+            <p className="pb-4 text-sm text-gray-600">
+              {item.data.description}
+            </p>
+            <div className="prose text-sm text-gray-600">
+              <Mdx source={item.content} />
+            </div>
+            <div className="flex gap-6 pt-2">
+              {item.data.links?.map((l) => (
+                <a
+                  key={l.url}
+                  href={l.url}
+                  target="_blank"
+                  rel="noopener noreferrer"
+                  className="text-sm text-blue-600 hover:underline"
+                >
+                  {l.label}
+                </a>
+              ))}
+            </div>
+          </div>
+          <hr />
+        </div>
+      ))}
+    </div>
+  );
+}

src/app/reading/[slug]/opengraph-image.tsx

@@ -0,0 +1,20 @@
+import { getBooks } from "@/lib/content";
+import { ogContentType, ogImage, ogSize } from "@/lib/og";
+
+export const size = ogSize;
+export const dynamic = "force-static";
+export const contentType = ogContentType;
+
+export function generateStaticParams() {
+  return getBooks().map((b) => ({ slug: b.slug }));
+}
+
+export default async function Image({
+  params,
+}: {
+  params: Promise<{ slug: string }>;
+}) {
+  const { slug } = await params;
+  const book = getBooks().find((b) => b.slug === slug);
+  return ogImage(book?.data.title ?? "Reading", "Reading");
+}

src/app/reading/[slug]/page.tsx

@@ -0,0 +1,95 @@
+import type { Metadata } from "next";
+import { notFound } from "next/navigation";
+import { breadcrumbs, JsonLd } from "@/components/JsonLd";
+import { Mdx } from "@/components/Mdx";
+import { byline } from "@/lib/books";
+import { getBooks } from "@/lib/content";
+import { abs, site } from "@/lib/site";
+
+export function generateStaticParams() {
+  return getBooks().map((b) => ({ slug: b.slug }));
+}
+
+export async function generateMetadata({
+  params,
+}: PageProps<"/reading/[slug]">): Promise<Metadata> {
+  const { slug } = await params;
+  const book = getBooks().find((b) => b.slug === slug);
+  if (!book) return {};
+  const url = `/reading/${slug}`;
+  const description = byline(book.data) || site.description;
+  return {
+    title: book.data.title,
+    description,
+    keywords: book.data.tags,
+    alternates: { canonical: url },
+    openGraph: {
+      type: "article",
+      url,
+      title: book.data.title,
+      description,
+      siteName: site.name,
+      locale: site.locale,
+    },
+    twitter: {
+      card: "summary_large_image",
+      title: book.data.title,
+      description,
+    },
+  };
+}
+
+export default async function Book({ params }: PageProps<"/reading/[slug]">) {
+  const { slug } = await params;
+  const book = getBooks().find((b) => b.slug === slug);
+  if (!book) notFound();
+  const url = abs(`/reading/${slug}`);
+  const item = {
+    "@type": book.data.kind === "paper" ? "ScholarlyArticle" : "Book",
+    name: book.data.title,
+    url: book.data.url,
+    author: book.data.authors?.map((name) => ({ "@type": "Person", name })),
+  };
+  const reviewLd = book.data.rating
+    ? {
+        "@context": "https://schema.org",
+        "@type": "Review",
+        url,
+        name: `Review: ${book.data.title}`,
+        datePublished: book.data.dateFinished,
+        author: { "@type": "Person", name: site.name, url: site.baseUrl },
+        itemReviewed: item,
+        reviewRating: {
+          "@type": "Rating",
+          ratingValue: book.data.rating,
+          bestRating: 5,
+          worstRating: 1,
+        },
+      }
+    : null;
+  return (
+    <article className="flex flex-col gap-2">
+      <JsonLd
+        data={[
+          ...(reviewLd ? [reviewLd] : []),
+          breadcrumbs([
+            { name: "Home", url: site.baseUrl },
+            { name: "Reading", url: abs("/reading") },
+            { name: book.data.title, url },
+          ]),
+        ]}
+      />
+      <div className="flex flex-col">
+        <h1 className="text-[36px] leading-[1.2] font-bold">
+          {book.data.title}
+        </h1>
+        <p className="mt-2 text-[20px] leading-[30px] text-gray-400">
+          {byline(book.data)}
+        </p>
+      </div>
+      <div className="prose">
+        <Mdx source={book.content} />
+      </div>
+    </article>
+  );
+}

src/app/reading/layout.tsx

@@ -0,0 +1,12 @@
+import { Bookshelf } from "@/components/Bookshelf";
+import { getShelf } from "@/lib/books";
+
+export default function ReadingLayout({ children }: LayoutProps<"/reading">) {
+  return (
+    <div className="flex flex-col gap-8">
+      <Bookshelf books={getShelf()} />
+      <hr />
+      {children}
+    </div>
+  );
+}

src/app/reading/page.tsx

@@ -0,0 +1,70 @@
+import type { Metadata } from "next";
+import Link from "next/link";
+import { Mdx } from "@/components/Mdx";
+import { readLine } from "@/lib/books";
+import { coverExists, getBooks, spineFor, summarize } from "@/lib/content";
+
+export const metadata: Metadata = {
+  title: "Reading",
+  description: "Books and papers I have read, with ratings and notes.",
+  alternates: { canonical: "/reading" },
+};
+
+export default function ReadingIndex() {
+  return (
+    <div className="flex flex-col">
+      <h1 className="sr-only">Reading</h1>
+      {getBooks().map((b, i) => {
+        const cover = coverExists(b.data.coverImage)
+          ? b.data.coverImage
+          : undefined;
+        const { spineColor, textColor } = spineFor(b.data.title);
+        const summary = summarize(b.content);
+        return (
+          <div key={b.slug} className={i > 0 ? "mt-5" : undefined}>
+            {i > 0 && <hr className="mb-3" />}
+            <div className="flex gap-6">
+              {cover ? (
+                // biome-ignore lint/performance/noImgElement: small local cover
+                <img
+                  src={cover}
+                  alt={b.data.title}
+                  className="h-[100px] border border-gray-200 sm:h-[140px] md:h-[160px]"
+                  style={{ width: "auto" }}
+                />
+              ) : (
+                <div
+                  className="flex h-[100px] w-[68px] shrink-0 items-center border border-gray-200 p-2 text-xs font-bold sm:h-[140px] sm:w-24 md:h-[160px] md:w-28"
+                  style={{ backgroundColor: spineColor, color: textColor }}
+                >
+                  {b.data.title}
+                </div>
+              )}
+              <div className="flex min-w-0 flex-col">
+                <Link
+                  href={`/reading/${b.slug}`}
+                  className="block hover:underline"
+                >
+                  <h2 className="text-[20px] leading-6 font-bold">
+                    {b.data.title}
+                  </h2>
+                </Link>
+                {b.data.authors?.length ? (
+                  <p className="mt-2 text-[#999]">
+                    {b.data.authors.join(", ")}
+                  </p>
+                ) : null}
+                <p className="mt-2 text-[#666]">{readLine(b.data)}</p>
+                {summary && (
+                  <article className="prose mt-2">
+                    <Mdx source={summary} />
+                  </article>
+                )}
+              </div>
+            </div>
+          </div>
+        );
+      })}
+    </div>
+  );
+}

src/app/robots.ts

@@ -0,0 +1,12 @@
+import type { MetadataRoute } from "next";
+import { abs, site } from "@/lib/site";
+
+export const dynamic = "force-static";
+
+export default function robots(): MetadataRoute.Robots {
+  return {
+    rules: [{ userAgent: "*", allow: "/" }],
+    sitemap: abs("/sitemap.xml"),
+    host: site.baseUrl,
+  };
+}

src/app/rss.xml/route.ts

@@ -0,0 +1,36 @@
+import { getFeedItems, xml } from "@/lib/feed";
+import { abs, site } from "@/lib/site";
+
+export const dynamic = "force-static";
+
+export async function GET() {
+  const items = await getFeedItems();
+  const body = `<?xml version="1.0" encoding="UTF-8"?>
+<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom" xmlns:content="http://purl.org/rss/1.0/modules/content/">
+<channel>
+<title>${xml(site.name)}</title>
+<link>${site.baseUrl}</link>
+<description>${xml(site.description)}</description>
+<language>en</language>
+<lastBuildDate>${(items[0]?.date ?? new Date()).toUTCString()}</lastBuildDate>
+<atom:link href="${abs("/rss.xml")}" rel="self" type="application/rss+xml"/>
+${items
+  .map(
+    (i) => `<item>
+<title>${xml(i.title)}</title>
+<link>${i.url}</link>
+<guid isPermaLink="true">${i.url}</guid>
+<pubDate>${i.date.toUTCString()}</pubDate>
+<description>${xml(i.description)}</description>
+${i.tags.map((t) => `<category>${xml(t)}</category>`).join("\n")}
+<content:encoded><![CDATA[${i.html.replace(/]]>/g, "]]]]><![CDATA[>")}]]></content:encoded>
+</item>`,
+  )
+  .join("\n")}
+</channel>
+</rss>
+`;
+  return new Response(body, {
+    headers: { "Content-Type": "application/rss+xml; charset=utf-8" },
+  });
+}

src/app/sitemap.ts

@@ -0,0 +1,35 @@
+import type { MetadataRoute } from "next";
+import { getBooks, getWritings } from "@/lib/content";
+import { abs } from "@/lib/site";
+
+export const dynamic = "force-static";
+
+export default function sitemap(): MetadataRoute.Sitemap {
+  const posts = getWritings();
+  const latest = posts[0]?.data.date;
+  return [
+    { url: abs("/"), changeFrequency: "monthly", priority: 1 },
+    {
+      url: abs("/writing"),
+      lastModified: latest ? new Date(String(latest)) : undefined,
+      changeFrequency: "weekly",
+      priority: 0.9,
+    },
+    { url: abs("/reading"), changeFrequency: "monthly", priority: 0.6 },
+    { url: abs("/portfolio"), changeFrequency: "monthly", priority: 0.6 },
+    ...posts.map((p) => ({
+      url: abs(`/writing/${p.slug}`),
+      lastModified: new Date(String(p.data.date)),
+      changeFrequency: "yearly" as const,
+      priority: 0.8,
+    })),
+    ...getBooks().map((b) => ({
+      url: abs(`/reading/${b.slug}`),
+      lastModified: b.data.dateFinished
+        ? new Date(b.data.dateFinished)
+        : undefined,
+      changeFrequency: "yearly" as const,
+      priority: 0.4,
+    })),
+  ];
+}

src/app/writing/[slug]/opengraph-image.tsx

@@ -0,0 +1,20 @@
+import { getWritings } from "@/lib/content";
+import { ogContentType, ogImage, ogSize } from "@/lib/og";
+
+export const size = ogSize;
+export const dynamic = "force-static";
+export const contentType = ogContentType;
+
+export function generateStaticParams() {
+  return getWritings().map((p) => ({ slug: p.slug }));
+}
+
+export default async function Image({
+  params,
+}: {
+  params: Promise<{ slug: string }>;
+}) {
+  const { slug } = await params;
+  const post = getWritings().find((p) => p.slug === slug);
+  return ogImage(post?.data.title ?? "Writing", "Writing");
+}

src/app/writing/[slug]/page.tsx

@@ -0,0 +1,86 @@
+import type { Metadata } from "next";
+import { notFound } from "next/navigation";
+import { breadcrumbs, JsonLd } from "@/components/JsonLd";
+import { Mdx } from "@/components/Mdx";
+import { formatDate, getWritings } from "@/lib/content";
+import { abs, site } from "@/lib/site";
+
+export function generateStaticParams() {
+  return getWritings().map((p) => ({ slug: p.slug }));
+}
+
+export async function generateMetadata({
+  params,
+}: PageProps<"/writing/[slug]">): Promise<Metadata> {
+  const { slug } = await params;
+  const post = getWritings().find((p) => p.slug === slug);
+  if (!post) return {};
+  const url = `/writing/${slug}`;
+  const description = post.data.description || site.description;
+  return {
+    title: post.data.title,
+    description,
+    keywords: post.data.tags,
+    alternates: { canonical: url },
+    openGraph: {
+      type: "article",
+      url,
+      title: post.data.title,
+      description,
+      siteName: site.name,
+      locale: site.locale,
+      publishedTime: String(post.data.date),
+      modifiedTime: String(post.data.date),
+      authors: [site.name],
+      tags: post.data.tags,
+    },
+    twitter: {
+      card: "summary_large_image",
+      title: post.data.title,
+      description,
+    },
+  };
+}
+
+export default async function Post({ params }: PageProps<"/writing/[slug]">) {
+  const { slug } = await params;
+  const post = getWritings().find((p) => p.slug === slug);
+  if (!post) notFound();
+  const url = abs(`/writing/${slug}`);
+  const postLd = {
+    "@context": "https://schema.org",
+    "@type": "BlogPosting",
+    headline: post.data.title,
+    description: post.data.description || site.description,
+    datePublished: String(post.data.date),
+    dateModified: String(post.data.date),
+    inLanguage: "en",
+    keywords: post.data.tags?.join(", "),
+    url,
+    mainEntityOfPage: { "@type": "WebPage", "@id": url },
+    image: abs(`/writing/${slug}/opengraph-image`),
+    author: { "@type": "Person", name: site.name, url: site.baseUrl },
+    publisher: { "@type": "Person", name: site.name, url: site.baseUrl },
+  };
+  return (
+    <article className="flex flex-col gap-2">
+      <JsonLd
+        data={[
+          postLd,
+          breadcrumbs([
+            { name: "Home", url: site.baseUrl },
+            { name: "Writing", url: abs("/writing") },
+            { name: post.data.title, url },
+          ]),
+        ]}
+      />
+      <h1 className="text-3xl font-bold md:text-4xl">{post.data.title}</h1>
+      <time dateTime={String(post.data.date)} className="text-sm text-gray-500">
+        {formatDate(String(post.data.date))}
+      </time>
+      <div className="prose">
+        <Mdx source={post.content} />
+      </div>
+    </article>
+  );
+}

src/app/writing/page.tsx

@@ -0,0 +1,36 @@
+import type { Metadata } from "next";
+import Link from "next/link";
+import { formatDate, getWritings } from "@/lib/content";
+
+export const metadata: Metadata = {
+  title: "Writing",
+  description:
+    "Essays and CTF writeups on software development, security, binary exploitation and Linux.",
+  alternates: { canonical: "/writing" },
+};
+
+export default function WritingIndex() {
+  const posts = getWritings();
+  return (
+    <div className="flex flex-col gap-3">
+      <h1 className="sr-only">Writing</h1>
+      <hr />
+      {posts.map((post) => (
+        <div key={post.slug} className="flex flex-col gap-3">
+          <div className="flex flex-col gap-1">
+            <Link
+              href={`/writing/${post.slug}`}
+              className="text-blue-600 hover:underline"
+            >
+              {post.data.title}
+            </Link>
+            <span className="text-right text-sm text-gray-500">
+              {formatDate(String(post.data.date))}
+            </span>
+          </div>
+          <hr />
+        </div>
+      ))}
+    </div>
+  );
+}

src/components/Bookshelf.tsx

@@ -0,0 +1,248 @@
+"use client";
+
+import { usePathname, useRouter } from "next/navigation";
+import { useEffect, useRef, useState } from "react";
+import type { ShelfBook } from "@/lib/books";
+
+const W = 41.5;
+const H = 220;
+const SPINE = `${W}px`;
+const COVER = `${W * 4}px`;
+const BOOK = `${W * 5}px`;
+const FILTER = "brightness(0.8) contrast(2)";
+const PAPER = {
+  pointerEvents: "none",
+  opacity: 0.4,
+  filter: "url(#paper)",
+  zIndex: 50,
+} as const;
+
+export function Bookshelf({ books }: { books: ShelfBook[] }) {
+  const router = useRouter();
+  const pathname = usePathname();
+  const slug = pathname.split("/")[2];
+  const bookIndex = slug ? books.findIndex((b) => b.slug === slug) : -1;
+
+  const viewportRef = useRef<HTMLDivElement>(null);
+  const timer = useRef<ReturnType<typeof setInterval> | null>(null);
+  const [scroll, setScroll] = useState(0);
+  const [inView, setInView] = useState(0);
+  const [isScrolling, setIsScrolling] = useState(false);
+
+  const maxScroll =
+    (W + 12) * (books.length - inView) + (bookIndex > -1 ? W * 4 : 0) + 5;
+  const clamp = (x: number) => Math.max(0, Math.min(maxScroll, x));
+
+  useEffect(() => {
+    const el = viewportRef.current;
+    if (!el) return;
+    const measure = () => setInView(el.clientWidth / (W + 11));
+    measure();
+    const ro = new ResizeObserver(measure);
+    ro.observe(el);
+    return () => ro.disconnect();
+  }, []);
+
+  useEffect(() => {
+    if (bookIndex === -1) setScroll((s) => Math.max(0, s));
+    else setScroll(Math.max(0, (bookIndex - (inView - 4.5) / 2) * (W + 11)));
+  }, [bookIndex, inView]);
+
+  useEffect(
+    () => () => {
+      if (timer.current) clearInterval(timer.current);
+    },
+    [],
+  );
+
+  const start = (dir: 1 | -1) => {
+    if (timer.current) clearInterval(timer.current);
+    setIsScrolling(true);
+    timer.current = setInterval(() => setScroll((s) => clamp(s + dir * 3)), 10);
+  };
+  const stop = () => {
+    setIsScrolling(false);
+    if (timer.current) clearInterval(timer.current);
+    timer.current = null;
+  };
+
+  const arrow = (dir: 1 | -1) => ({
+    onMouseEnter: () => start(dir),
+    onMouseLeave: stop,
+    onTouchStart: () => start(dir),
+    onTouchEnd: stop,
+  });
+
+  return (
+    <>
+      <svg className="invisible absolute inset-0" aria-hidden="true">
+        <defs>
+          <filter id="paper" x="0%" y="0%" width="100%" height="100%">
+            <feTurbulence
+              type="fractalNoise"
+              baseFrequency="0.9"
+              numOctaves="8"
+              result="noise"
+            />
+            <feDiffuseLighting
+              in="noise"
+              lightingColor="white"
+              surfaceScale="1"
+              result="diffLight"
+            >
+              <feDistantLight azimuth="45" elevation="35" />
+            </feDiffuseLighting>
+          </filter>
+        </defs>
+      </svg>
+
+      <div className="relative">
+        <div
+          className={`absolute -left-7 h-full md:-left-9 ${scroll > 0 ? "block" : "hidden"}`}
+        >
+          <div
+            {...arrow(-1)}
+            className="flex h-full w-7 items-center justify-center rounded-md max-md:rounded-r-none hover:bg-gray-100"
+          >
+            <Chevron dir="left" />
+          </div>
+        </div>
+
+        <div
+          ref={viewportRef}
+          className="flex cursor-grab items-center gap-3 overflow-x-hidden"
+        >
+          {books.map((book, i) => {
+            const open = bookIndex === i;
+            return (
+              <button
+                type="button"
+                key={book.slug}
+                onClick={() => router.push(open ? "/reading" : book.href)}
+                style={{
+                  display: "flex",
+                  alignItems: "center",
+                  justifyContent: "flex-start",
+                  outline: "none",
+                  flexShrink: 0,
+                  transform: `translateX(-${scroll}px)`,
+                  width: open ? BOOK : SPINE,
+                  perspective: "1000px",
+                  transition: isScrolling
+                    ? "transform 100ms linear"
+                    : "all 500ms ease",
+                }}
+              >
+                <div
+                  className="flex shrink-0 items-start justify-center"
+                  style={{
+                    width: SPINE,
+                    height: H,
+                    transformOrigin: "right",
+                    backgroundColor: book.spineColor,
+                    color: book.textColor,
+                    transform: `rotateY(${open ? "-60deg" : "0deg"})`,
+                    transition: "all 500ms ease",
+                    filter: FILTER,
+                    transformStyle: "preserve-3d",
+                  }}
+                >
+                  <span
+                    className="fixed top-0 left-0"
+                    style={{ ...PAPER, height: H, width: SPINE }}
+                  />
+                  <span
+                    className="mt-3 block select-none overflow-hidden text-ellipsis whitespace-nowrap text-[12px] leading-[1.2] font-bold"
+                    style={{
+                      writingMode: "vertical-rl",
+                      maxHeight: H - 24,
+                      fontFamily: '"DM Sans", sans-serif',
+                    }}
+                  >
+                    {book.title}
+                  </span>
+                </div>
+                <div
+                  className="relative shrink-0 overflow-hidden"
+                  style={{
+                    transformOrigin: "left",
+                    transform: `rotateY(${open ? "30deg" : "88.8deg"})`,
+                    transition: "all 500ms ease",
+                    filter: FILTER,
+                    transformStyle: "preserve-3d",
+                  }}
+                >
+                  <span
+                    className="fixed top-0 right-0"
+                    style={{ ...PAPER, height: H, width: COVER }}
+                  />
+                  <span
+                    className="absolute top-0 left-0"
+                    style={{
+                      pointerEvents: "none",
+                      zIndex: 50,
+                      height: H,
+                      width: COVER,
+                      background:
+                        "linear-gradient(to right, rgba(255,255,255,0) 2px, rgba(255,255,255,0.5) 3px, rgba(255,255,255,0.25) 4px, rgba(255,255,255,0.25) 6px, transparent 7px, transparent 9px, rgba(255,255,255,0.25) 9px, transparent 12px)",
+                    }}
+                  />
+                  {book.coverImage ? (
+                    // biome-ignore lint/performance/noImgElement: fixed-size local cover inside a 3D transform
+                    <img
+                      src={book.coverImage}
+                      alt={book.title}
+                      width={W * 4}
+                      height={H}
+                      style={{ width: COVER, height: H }}
+                    />
+                  ) : (
+                    <div
+                      className="flex items-center p-4 text-left text-sm font-bold"
+                      style={{
+                        width: COVER,
+                        height: H,
+                        backgroundColor: book.spineColor,
+                        color: book.textColor,
+                      }}
+                    >
+                      {book.title}
+                    </div>
+                  )}
+                </div>
+              </button>
+            );
+          })}
+        </div>
+
+        <div
+          className={`absolute top-0 -right-7 h-full pl-2.5 md:-right-9 ${scroll < maxScroll ? "block" : "hidden"}`}
+        >
+          <div
+            {...arrow(1)}
+            className="flex h-full w-7 items-center justify-center rounded-md max-md:rounded-l-none hover:bg-gray-100"
+          >
+            <Chevron dir="right" />
+          </div>
+        </div>
+      </div>
+    </>
+  );
+}
+
+function Chevron({ dir }: { dir: "left" | "right" }) {
+  return (
+    <svg
+      viewBox="0 0 24 24"
+      className="size-3"
+      fill="none"
+      stroke="currentColor"
+      strokeWidth="3"
+      strokeLinecap="round"
+      strokeLinejoin="round"
+      aria-hidden="true"
+    >
+      <path d={dir === "left" ? "M15 4l-8 8 8 8" : "M9 4l8 8-8 8"} />
+    </svg>
+  );
+}

src/components/JsonLd.tsx

@@ -0,0 +1,29 @@
+/** Renders a JSON-LD block. `<` is escaped so content can't close the script tag. */
+export function JsonLd({
+  data,
+}: {
+  data: Record<string, unknown> | Record<string, unknown>[];
+}) {
+  return (
+    <script
+      type="application/ld+json"
+      // biome-ignore lint/security/noDangerouslySetInnerHtml: JSON-LD must be inlined; `<` is escaped
+      dangerouslySetInnerHTML={{
+        __html: JSON.stringify(data).replace(/</g, "\\u003c"),
+      }}
+    />
+  );
+}
+
+export function breadcrumbs(items: { name: string; url: string }[]) {
+  return {
+    "@context": "https://schema.org",
+    "@type": "BreadcrumbList",
+    itemListElement: items.map((item, i) => ({
+      "@type": "ListItem",
+      position: i + 1,
+      name: item.name,
+      item: item.url,
+    })),
+  };
+}

src/components/Layout.tsx

@@ -0,0 +1,15 @@
+import { MobileNav } from "@/components/MobileNav";
+import { Sidebar } from "@/components/Sidebar";
+
+// Mirrors adammaj.com: a 596px wrapper (Chakra container) centred on the page, with a
+// second, equally wide container inside it whose 16px padding offsets the text column.
+export function Layout({ children }: { children: React.ReactNode }) {
+  return (
+    <div className="relative mx-auto mt-16 w-full max-w-[596.161px] px-4 pb-8 md:pb-40">
+      <div className="fixed inset-x-0 top-0 z-100 hidden h-16 bg-white lg:block" />
+      <MobileNav />
+      <Sidebar />
+      <main className="relative px-4 md:w-[596.161px]">{children}</main>
+    </div>
+  );
+}

src/components/Mdx.tsx

@@ -0,0 +1,33 @@
+import { MDXRemote } from "next-mdx-remote/rsc";
+import rehypeKatex from "rehype-katex";
+import rehypePrettyCode from "rehype-pretty-code";
+import rehypeRaw from "rehype-raw";
+import remarkGfm from "remark-gfm";
+import remarkMath from "remark-math";
+
+/** Renders exported markdown: GFM, raw HTML (callouts, embeds), and KaTeX math. */
+export function Mdx({ source }: { source: string }) {
+  return (
+    <MDXRemote
+      source={source}
+      options={{
+        mdxOptions: {
+          format: "md",
+          remarkPlugins: [remarkGfm, remarkMath],
+          rehypePlugins: [
+            rehypeRaw,
+            rehypeKatex,
+            [
+              rehypePrettyCode,
+              {
+                theme: "github-light",
+                keepBackground: false,
+                defaultLanguage: "txt",
+              },
+            ],
+          ],
+        },
+      }}
+    />
+  );
+}

src/components/MobileNav.tsx

@@ -0,0 +1,85 @@
+"use client";
+
+import { usePathname } from "next/navigation";
+import { useEffect, useRef, useState } from "react";
+import { NavLink } from "@/components/NavLink";
+import { site } from "@/lib/site";
+
+export function MobileNav() {
+  const [open, setOpen] = useState(false);
+  const ref = useRef<HTMLDivElement>(null);
+  const pathname = usePathname();
+
+  // biome-ignore lint/correctness/useExhaustiveDependencies: close the menu when the route changes
+  useEffect(() => setOpen(false), [pathname]);
+
+  useEffect(() => {
+    if (!open) return;
+    const close = (e: MouseEvent) => {
+      if (!ref.current?.contains(e.target as Node)) setOpen(false);
+    };
+    document.addEventListener("mousedown", close);
+    return () => document.removeEventListener("mousedown", close);
+  }, [open]);
+
+  return (
+    <header className="fixed inset-x-0 top-0 z-50 h-12 border-b border-gray-200 bg-white lg:hidden">
+      <div className="mx-auto flex h-full max-w-5xl items-center justify-between px-8">
+        <div className="flex gap-8">
+          {site.nav.slice(0, 3).map((item) => (
+            <NavLink key={item.href} href={item.href}>
+              {item.name}
+            </NavLink>
+          ))}
+        </div>
+        <div ref={ref} className="relative">
+          <button
+            type="button"
+            aria-label="Menu"
+            aria-expanded={open}
+            onClick={() => setOpen(!open)}
+            className="flex h-8 w-8 items-center justify-center rounded-md border border-gray-200 hover:bg-gray-100"
+          >
+            <svg
+              viewBox="0 0 24 24"
+              className="size-4"
+              fill="none"
+              stroke="currentColor"
+              strokeWidth="2"
+              strokeLinecap="round"
+              aria-hidden="true"
+            >
+              <path d="M3 12h18M3 6h18M3 18h18" />
+            </svg>
+          </button>
+          {open && (
+            <div className="absolute right-0 top-10 flex w-44 flex-col gap-4 rounded-md border border-gray-200 bg-white py-4 shadow-lg">
+              <div className="flex flex-col gap-3 px-4">
+                <h2 className="text-xs font-bold">NAVIGATION</h2>
+                {site.nav.map((item) => (
+                  <NavLink key={item.href} href={item.href}>
+                    {item.name}
+                  </NavLink>
+                ))}
+              </div>
+              <div className="flex flex-col gap-3 px-4">
+                <h2 className="text-xs font-bold">FIND ME ON</h2>
+                {site.social.map((item) => (
+                  <a
+                    key={item.href}
+                    href={item.href}
+                    target="_blank"
+                    rel="noopener noreferrer"
+                    className="text-gray-500 hover:text-black"
+                  >
+                    {item.name}
+                  </a>
+                ))}
+              </div>
+            </div>
+          )}
+        </div>
+      </div>
+    </header>
+  );
+}

src/components/NavLink.tsx

@@ -0,0 +1,25 @@
+"use client";
+
+import Link from "next/link";
+import { usePathname } from "next/navigation";
+
+export function NavLink({
+  href,
+  className = "",
+  children,
+}: {
+  href: string;
+  className?: string;
+  children: React.ReactNode;
+}) {
+  const pathname = usePathname();
+  const active = href === "/" ? pathname === "/" : pathname.startsWith(href);
+  return (
+    <Link
+      href={href}
+      className={`${active ? "text-black" : "text-[#718096]"} hover:text-black ${className}`}
+    >
+      {children}
+    </Link>
+  );
+}

src/components/Sidebar.tsx

@@ -0,0 +1,35 @@
+import { NavLink } from "@/components/NavLink";
+import { site } from "@/lib/site";
+
+const link = "mt-2 block w-fit text-[18px] leading-[27px]";
+
+export function Sidebar() {
+  return (
+    <aside className="absolute right-full mr-40 hidden lg:flex">
+      <div className="fixed flex flex-col items-start whitespace-nowrap">
+        <nav>
+          <p className="text-[13.3333px] leading-5 font-bold">NAVIGATION</p>
+          {site.nav.map((item) => (
+            <NavLink key={item.href} href={item.href} className={link}>
+              {item.name}
+            </NavLink>
+          ))}
+        </nav>
+        <div className="mt-10">
+          <p className="text-[13.3333px] leading-5 font-bold">FIND ME ON</p>
+          {site.social.map((item) => (
+            <a
+              key={item.href}
+              href={item.href}
+              target="_blank"
+              rel="noopener noreferrer"
+              className={`${link} text-gray-500 hover:text-black`}
+            >
+              {item.name}
+            </a>
+          ))}
+        </div>
+      </div>
+    </aside>
+  );
+}

src/lib/books.ts

@@ -0,0 +1,44 @@
+import {
+  type Book,
+  coverExists,
+  formatDate,
+  getBooks,
+  spineFor,
+} from "@/lib/content";
+
+export type ShelfBook = {
+  slug: string;
+  href: string;
+  title: string;
+  coverImage?: string;
+  spineColor: string;
+  textColor: string;
+};
+
+export function getShelf(): ShelfBook[] {
+  return getBooks().map((b) => ({
+    slug: b.slug,
+    href: `/reading/${b.slug}`,
+    title: b.data.title,
+    coverImage: coverExists(b.data.coverImage) ? b.data.coverImage : undefined,
+    ...spineFor(b.data.title),
+  }));
+}
+
+export function readLine(b: Book) {
+  return [
+    b.dateFinished && `Read: ${formatDate(b.dateFinished)}`,
+    b.rating && `Rating: ${b.rating}/5`,
+  ]
+    .filter(Boolean)
+    .join(" • ");
+}
+
+export function byline(b: Book) {
+  const parts = [
+    b.authors?.length && `By: ${b.authors.join(", ")}`,
+    b.dateFinished && `Read: ${formatDate(b.dateFinished)}`,
+    b.rating && `Rating: ${b.rating}/5`,
+  ];
+  return parts.filter(Boolean).join(" - ");
+}

src/lib/content.ts

@@ -0,0 +1,118 @@
+import fs from "node:fs";
+import path from "node:path";
+import matter from "gray-matter";
+
+const ROOT = path.join(process.cwd(), "content");
+
+export type Entry<T> = { slug: string; data: T; content: string };
+
+export type Writing = {
+  title: string;
+  description?: string;
+  date: string;
+  tags?: string[];
+};
+
+export type Portfolio = {
+  title: string;
+  description?: string;
+  role?: string;
+  dateStart?: string;
+  dateEnd?: string;
+  outcome?: string;
+  links?: { label: string; url: string }[];
+};
+
+export type Book = {
+  title: string;
+  kind: "book" | "paper";
+  authors?: string[];
+  url?: string;
+  coverImage?: string;
+  rating?: number;
+  status?: string;
+  dateFinished?: string;
+  tags?: string[];
+};
+
+function readDir<T>(dir: string): Entry<T>[] {
+  const full = path.join(ROOT, dir);
+  if (!fs.existsSync(full)) return [];
+  return fs
+    .readdirSync(full)
+    .filter((f) => f.endsWith(".md"))
+    .map((f) => {
+      const { data, content } = matter(
+        fs.readFileSync(path.join(full, f), "utf8"),
+      );
+      return { slug: f.replace(/\.md$/, ""), data: data as T, content };
+    });
+}
+
+export function getWritings() {
+  return readDir<Writing>("writing").sort((a, b) =>
+    String(b.data.date).localeCompare(String(a.data.date)),
+  );
+}
+
+export function getPortfolio() {
+  return readDir<Portfolio>("portfolio").sort((a, b) =>
+    String(b.data.dateStart ?? "").localeCompare(
+      String(a.data.dateStart ?? ""),
+    ),
+  );
+}
+
+export function getBooks() {
+  return readDir<Book>("reading").sort(
+    (a, b) =>
+      (b.data.rating ?? 0) - (a.data.rating ?? 0) ||
+      a.data.title.localeCompare(b.data.title),
+  );
+}
+
+export function getAbout() {
+  const { content } = matter(
+    fs.readFileSync(path.join(ROOT, "about.md"), "utf8"),
+  );
+  return content;
+}
+
+/** The part of a review shown on the index: everything before "## My Notes". */
+export function summarize(content: string) {
+  return content.split(/^## My Notes/m)[0].trim();
+}
+
+export function formatDate(date: string) {
+  return new Date(`${date}T00:00:00Z`).toLocaleDateString("en-US", {
+    year: "numeric",
+    month: "long",
+    day: "numeric",
+    timeZone: "UTC",
+  });
+}
+
+const SPINES: [string, string][] = [
+  ["#7c3a2d", "#fbe9d0"],
+  ["#264653", "#e9f5f2"],
+  ["#2a4d3a", "#f1f7e8"],
+  ["#5b3a6b", "#f6ecfa"],
+  ["#c9a227", "#2b2110"],
+  ["#1d3557", "#f1faee"],
+  ["#8d5a3b", "#fff4e6"],
+  ["#3b3b3b", "#f0f0f0"],
+];
+
+export function spineFor(title: string) {
+  let h = 0;
+  for (const c of title) h = (h * 31 + c.charCodeAt(0)) >>> 0;
+  const [spineColor, textColor] = SPINES[h % SPINES.length];
+  return { spineColor, textColor };
+}
+
+export function coverExists(coverImage?: string) {
+  return (
+    !!coverImage &&
+    fs.existsSync(path.join(process.cwd(), "public", coverImage))
+  );
+}

src/lib/feed.ts

@@ -0,0 +1,43 @@
+import rehypeRaw from "rehype-raw";
+import rehypeStringify from "rehype-stringify";
+import remarkGfm from "remark-gfm";
+import remarkParse from "remark-parse";
+import remarkRehype from "remark-rehype";
+import { unified } from "unified";
+import { getWritings } from "@/lib/content";
+import { abs } from "@/lib/site";
+
+const processor = unified()
+  .use(remarkParse)
+  .use(remarkGfm)
+  .use(remarkRehype, { allowDangerousHtml: true })
+  .use(rehypeRaw)
+  .use(rehypeStringify);
+
+/** Post bodies as HTML with root-relative links made absolute, for feed readers. */
+export async function getFeedItems() {
+  return Promise.all(
+    getWritings().map(async (p) => {
+      const html = String(await processor.process(p.content)).replace(
+        /(src|href)="\/(?!\/)/g,
+        `$1="${abs("/")}`,
+      );
+      return {
+        slug: p.slug,
+        url: abs(`/writing/${p.slug}`),
+        title: p.data.title,
+        description: p.data.description ?? "",
+        date: new Date(String(p.data.date)),
+        tags: p.data.tags ?? [],
+        html,
+      };
+    }),
+  );
+}
+
+export const xml = (s: string) =>
+  s
+    .replace(/&/g, "&")
+    .replace(/</g, "&lt;")
+    .replace(/>/g, "&gt;")
+    .replace(/"/g, "&quot;");

src/lib/og.tsx

@@ -0,0 +1,56 @@
+import { ImageResponse } from "next/og";
+import { site } from "@/lib/site";
+
+export const ogSize = { width: 1200, height: 630 };
+export const ogContentType = "image/png";
+
+/** 1200x630 social card: title on white, name and domain along the bottom. */
+export function ogImage(title: string, kicker?: string) {
+  return new ImageResponse(
+    <div
+      style={{
+        width: "100%",
+        height: "100%",
+        display: "flex",
+        flexDirection: "column",
+        justifyContent: "space-between",
+        background: "#ffffff",
+        color: "#1a202c",
+        padding: "72px 80px",
+        borderLeft: "16px solid #2b6cb0",
+      }}
+    >
+      <div
+        style={{
+          fontSize: 30,
+          color: "#718096",
+          textTransform: "uppercase",
+          letterSpacing: 3,
+        }}
+      >
+        {kicker ?? ""}
+      </div>
+      <div
+        style={{
+          fontSize: title.length > 60 ? 56 : 72,
+          fontWeight: 700,
+          lineHeight: 1.15,
+          display: "flex",
+        }}
+      >
+        {title}
+      </div>
+      <div
+        style={{
+          display: "flex",
+          justifyContent: "space-between",
+          fontSize: 30,
+        }}
+      >
+        <span style={{ color: "#1a202c" }}>{site.name}</span>
+        <span style={{ color: "#718096" }}>andwati.com</span>
+      </div>
+    </div>,
+    ogSize,
+  );
+}

src/lib/site.ts

@@ -0,0 +1,45 @@
+export const site = {
+  name: "Ian Andwati",
+  alias: "mockingspectre",
+  title: "Ian Andwati (mockingspectre) | Software Engineer & CTF Player",
+  tagline: "Thoughts and musings",
+  description:
+    "Software engineer and captain of the binarysith CTF team. Essays on low-level programming, distributed systems, compilers, database internals and security.",
+  baseUrl: "https://andwati.com",
+  locale: "en_US",
+  twitter: "@andwati_",
+  keywords: [
+    "Ian Andwati",
+    "mockingspectre",
+    "binarysith",
+    "software engineering",
+    "cyber security",
+    "CTF writeups",
+    "binary exploitation",
+    "reverse engineering",
+    "low-level programming",
+    "distributed systems",
+    "compiler design",
+    "database internals",
+  ],
+  nav: [
+    { name: "Home", href: "/" },
+    { name: "Reading", href: "/reading" },
+    { name: "Writing", href: "/writing" },
+    { name: "Portfolio", href: "/portfolio" },
+  ],
+  social: [
+    { name: "GitHub", href: "https://github.com/andwati" },
+    { name: "Twitter", href: "https://twitter.com/andwati_" },
+    { name: "YouTube", href: "https://www.youtube.com/@pwnforfunandprofit" },
+    { name: "Email", href: "mailto:[email protected]" },
+  ],
+  sameAs: [
+    "https://github.com/andwati",
+    "https://twitter.com/andwati_",
+    "https://www.youtube.com/@pwnforfunandprofit",
+    "https://ctftime.org/team/379200",
+  ],
+};
+
+export const abs = (path: string) => new URL(path, site.baseUrl).toString();

static/50x.html

@@ -1,54 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-  <head>
-    <meta charset="utf-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1">
-    <title>50x Borked</title>
-    <meta name="author" content="Reilly Tucker Siemens">
-    <meta name="description" content="50x Borked">
-    <meta property="og:site_name" content="tuckersiemens.com">
-    <meta property="og:locale" content="en-us">
-    <meta property="og:title" content="50x Borked">
-    <meta property="og:description" content="50x Borked">
-    <meta property="og:image" content="https://tuckersiemens.com/self.jpg">
-    <meta property="twitter:card" content="summary">
-    <meta property="twitter:site" content="@TuckerSiemens">
-    <meta property="twitter:title" content="50x Borked">
-    <meta property="twitter:description" content="50x Borked">
-    <meta property="twitter:image" content="https://tuckersiemens.com/self.jpg">
-    <link rel="dns-prefetch" href="https://fonts.googleapis.com/">
-    <link rel="stylesheet" href="/site.css">
-    <link rel="icon" href="/favicon.svg" type="image/svg+xml">
-  </head>
-  <body>
-    <main id="content">
-      <header>
-        <h1>50[0234] Borked</h1>
-      </header>
-      <figure>
-        <video src="50x.mp4" type="video/mp4" autoplay loop controls></video>
-        <figcaption>
-        Video from <a href="https://www.sakugabooru.com/post/show/174648">sakugabooru</a>
-        </figcaption>
-      </figure>
-    </main>
-    <footer>
-      <nav>
-        <a href="/">Home</a>
-        ⬡
-        <a href="/posts">Posts</a>
-        ⬡
-        <a href="/tags">Tags</a>
-        ⬡
-        <a href="/contact">Contact</a>
-      </nav>
-      <p>
-        ©
-        2021 Reilly Tucker Siemens ⬡
-        <a href="https://github.com/reillysiemens/tuckersiemens.com">Source</a>
-        ⬡
-        <a href="/rss.xml">Feed</a>
-      </p>
-    </footer>
-  </body>
-</html>

static/favicon.svg

@@ -1,3 +0,0 @@
-<svg height="128" width="128" xmlns="http://www.w3.org/2000/svg">
-  <polygon points="64 4, 124 32, 124 96, 64 124, 4 96, 4 32" fill="#b16286"/>
-</svg>