Go to Home Page

the tools, verified

Hardware · hand-set

The machine

4 rows · owner-confirmed

Machine
13-inch MacBook Pro · Apple M1 · 16 GB unified memory
Display
2560 × 1600 Retina · 1440 × 900 logicalThe fluid-scale unity viewport — every sub-page is authored at scale 1 on exactly this width, then breathes from one factor.
OS
macOS 26 · Darwin 25.6
Phone
iPhone, running OwnTracks in HTTP modeIt posts a location fix to /api/location; the town and local time in the footer come from this device.see the town it feeds

Environment · hand-set

The bench

6 stations · settings.json excerpt

  • EditorVisual Studio CodeDracula theme · vscode-icons · Prettier on save
  • Agentic pairClaude CodeVS Code extension + CLI — skills, subagents and MCP servers (Chrome DevTools, Playwright) drive the browser during verification
  • Terminal & shellzsh · macOS Terminal · the VS Code terminalNode pinned by .nvmrc through nvm · Homebrew for everything else
  • Formatting & lintPrettier + ESLintprettier-plugin-tailwindcss · eslint-config-next (core-web-vitals)
  • TypeInter · Montserrat · Varela Roundnext/font/google — self-hosted at build, so the fonts never shift layout
  • Browser toolingChrome DevTools · Playwright · LighthousePixel probes, reduced-motion emulation and the e2e gate all run against real Chromium
  • Extensions I reach for
    • Claude Code
    • Tailwind CSS IntelliSense
    • ESLint
    • Prettier
    • GitLens
An excerpt of my VS Code settings.json, shown in the Dracula theme.
{
"workbench.colorTheme": "Dracula Theme",
"workbench.iconTheme": "vscode-icons",
"editor.defaultFormatter": "esbenp.prettier-vscode",
"editor.formatOnSave": true,
"[dockercompose]": {
"editor.tabSize": 2
}
}

Stack · curated set

The stack

curated · 42 tools · syncing with GitHub…

Languages

0 of 0

What the code itself is written in.

  • JavaScript

    The language web browsers run natively; with Node.js it runs the server too.

  • TypeScript

    JavaScript with a type system, so mistakes surface while writing, not for users.

  • HTML

    The structure of every web page: the headings, text, links and images a browser reads.

  • CSS

    The styling language: colour, spacing, type and layout for everything on screen.

  • Bash

    The language of the terminal, used for small scripts that automate a machine.

  • C#

    Microsoft's C#, a general-purpose language for desktop and back-end applications.

  • PHP

    A server-side language that assembles web pages before they reach the browser.

Frameworks

0 of 0

The scaffolding an application is built on: its structure and its conventions.

  • Next.js

    The React framework this site is built on: pages, routing and server rendering.

  • React

    The component library behind the interface: the UI as small reusable pieces.

  • Tailwind CSS

    Utility-class styling: the design system expressed directly in the markup.

  • Express

    The minimal server framework for Node.js: routes, requests and responses.

  • Vue.js

    A progressive front-end framework, an alternative to React for building interfaces.

  • Bootstrap

    A ready-made kit of layouts and components for building pages quickly.

Libraries

0 of 0

Ready-made building blocks, each pulled in to do one job well.

  • Three.js

    3D graphics in the browser: the WebGL scenes on this site.

  • Framer Motion

    The animation library behind this site's motion: springs, reveals and gestures.

  • Prisma

    A type-safe bridge between application code and a database.

  • React Hook Form

    Forms in React with validation and almost no re-rendering.

  • Axios

    A tidy way for code to call web APIs and handle what comes back.

  • sharp

    High-speed image processing: resizing and converting pictures on the server.

  • upstash

    Serverless Redis: the live data store behind the guestbook and the footer.

  • postcss

    A pipeline that transforms CSS; Tailwind and autoprefixer both run through it.

  • autoprefixer

    Adds the browser-specific prefixes CSS needs so styles work everywhere.

  • testing-library

    Tests that exercise the interface the way a real user would.

  • Swiper

    Touch-friendly carousels and sliders.

  • dotenv

    Loads secrets and settings from a local file instead of the code.

  • nodemon

    Restarts a server automatically whenever its code changes.

  • ts-node

    Runs TypeScript directly, without a separate build step.

Tools

0 of 0

What runs around the code: testing, formatting, databases and deployment.

  • Node.js

    JavaScript outside the browser: the runtime behind every server here.

  • Vercel

    The platform this site deploys to: builds, previews and hosting.

  • Docker

    Packages an app with everything it needs so it runs the same anywhere.

  • Vite

    A fast development server and bundler for front-end projects.

  • Vitest

    A test runner built for Vite projects: this repository's unit tests.

  • Jest

    A test runner for JavaScript: proves the code does what it claims.

  • Mocha

    A flexible test runner, usually paired with Chai.

  • Chai

    An assertion library: the 'expect this to equal that' inside a test.

  • ESLint

    Reads code for mistakes and inconsistencies before it ever runs.

  • Prettier

    Formats code automatically so every file reads the same way.

  • Redis

    An in-memory data store for things that must be fast: caches, counters, sessions.

  • MySQL

    A relational database: tables, rows and the queries between them.

  • SQLite

    A whole database in a single file, ideal for small apps and tests.

  • Swagger

    Documents an API so others can read and try it without the source.

Software

0 of 0

The services the finished work lives on.

  • GitHub

    Where the code lives: version control, reviews and automation.

bars fill and repository counts arrive with the live crawl

Delivery · commit to compute

The pipeline

7 workflows · read from .github at build

Delivery pipeline: GitHub to GitHub Actions to Vercel build to Fluid compute, fanning out over a service bus to Upstash Redis, the AI Gateway, GitHub GraphQL, Spotify and SMTP, with a daily cron dropping in from above.SOURCEGitHubgit push · mainCIGitHub Actions7 workflows · lint · unit · build · e2eBUILDVercel buildnext build · Node 24.xRUNTIMEFluid compute19 API routes · Next 14.2SCHEDULEcrondaily-warmup · 01:00–01:59 UTCSTOREUpstash Redisguestbook · location · dedupeGATEWAYAI Gatewayrefine-messageGRAPHQLGitHub GraphQLstats · skills · progressRESTSpotifynow playingMAILSMTPcontact · Abstract verify
  1. source — GitHub: git push · main
  2. ci — GitHub Actions: 7 workflows · lint · unit · build · e2e
  3. build — Vercel build: next build · Node 24.x
  4. runtime — Fluid compute: 19 API routes · Next 14.2
  5. schedule — cron: daily-warmup · 01:00–01:59 UTC
  6. store — Upstash Redis: guestbook · location · dedupe
  7. gateway — AI Gateway: refine-message
  8. graphql — GitHub GraphQL: stats · skills · progress
  9. rest — Spotify: now playing
  10. mail — SMTP: contact · Abstract verify

main · CI, AI Code Review, Enable Auto-Merge, Issue triage, Lighthouse, Stale, Sync README · cron daily-warmup · 0 1 * * * · fires 01:00–01:59 UTC (Hobby precision)

Quality · counted at build

The instruments

counted at build · 27 Sep 2026

Bill of materials · this site

What it is made of

package-lock.json · verified at build · 27 Sep 2026

Core
next14.2.30
react18.3.1
react-dom18.3.1
tailwindcss3.4.17
3D & motion
three0.162.0
@react-three/drei9.122.0
@react-three/fiber8.18.0
framer-motion11.18.2
Data & services
ai7.0.4
@upstash/ratelimit2.0.8
@upstash/redis1.38.0
next-auth5.0.0-beta.32
nodemailer7.0.13
pdf-parse2.4.5
tz-lookup6.1.25
tldts7.4.11
marked16.4.2
Interface
lucide-react0.344.0
react-icons5.5.0
sonner1.7.4
react-hot-toast2.6.0
react-hook-form7.61.1
clsx2.1.1
tailwind-merge3.6.0
emoji-dictionary1.0.12
Platform
@vercel/analytics2.0.1
@vercel/speed-insights2.0.0
Media
sharp0.34.5
ffmpeg-static5.3.0
pdf-lib1.17.1
Quality
vitest4.1.11
@playwright/test1.62.1
@testing-library/dom10.4.1
@testing-library/react16.3.3
eslint8.57.1
eslint-config-next14.1.1
eslint-plugin-react7.37.5
prettier3.6.2
prettier-plugin-tailwindcss0.6.14
jsdom29.1.1
Build
postcss8.5.26
autoprefixer10.4.21
@next/bundle-analyzer16.3.2

43 packages · .nvmrc 22.14.0 · engines ^22.13.0 || ^24.0.0 · built 27 Sep 2026

MUHAMMADABDULLAH
0%