Skip to content

Engineering notes from production work

Engineering Notes

Articles on React, Next.js, hiring, and full-stack development.

ReactNext.jsAI APIsPerformanceSEO / AEO / GEO
Featured: Frontend10 min readMay 19, 2026

Component Design: From Primitive to Product

The best component APIs are not the ones with the most props. They are the ones that vanish - you reach for them without thinking because the shape matches your mental model.

Read article
3 composition patterns Slots, compound, render props
1

Primitives own look, product components own intent, pages own wiring.

2

Compound components beat giant props objects for complex UI.

3

If a component has more than 8 props, you probably missed a composition opportunity.

Latest Articles

Explore more notes on production engineering.

Frontend
12 min readMay 16, 2026

Frontend Architecture: The Mental Model That Keeps Complex Apps Maintainable

Five interconnected pillars - components, state, contracts, testing, tooling - that keep a frontend codebase healthy as the team and features grow.

Frontend
18 min readMay 3, 2026

How React Knows What to Re-render: The Reconciliation & Diffing Algorithm

Learn React's reconciliation algorithm: virtual DOM diffing, key prop rules, render vs commit phases, React 18 batching, and concurrent rendering - from first principles to production patterns.

Frontend
22 min readMay 1, 2026

Mastering Async JavaScript: Promises, Async/Await, and the Microtask Queue

From callback hell to Promise chains to async/await, this guide covers everything about asynchronous JavaScript including error handling, Promise combinators, AbortController, and real-world patterns.

AI Tools
13 min readApril 28, 2026

How I Use Claude Code to Ship Features 10× Faster

A real-world workflow guide for using Claude Code CLI to build features, debug bugs, refactor legacy code, and run custom automations - with actual examples from building this portfolio.

AI Tools
15 min readApril 28, 2026

How to Build an MCP Server from Scratch (Step-by-Step for Beginners)

A practical beginner guide to building a local MCP server (stdio) step-by-step. You will run a working server, connect it to Claude Desktop, and call your first tool.

Frontend
14 min readApril 24, 2026

JavaScript Closures Explained: Why Your Functions Remember Everything

Learn JavaScript closures with interactive demos. Covers lexical scope, the var vs let loop bug, stale React hooks, memory leak patterns, and closure interview questions.

Frontend
16 min readApril 22, 2026

How JavaScript Actually Executes Your Code: Event Loop & Call Stack Deep Dive

JavaScript call stack, event loop, microtask queue, and macrotask queue explained with real execution traces. Learn why Promises beat setTimeout and how to debug async timing bugs.

Engineering
7 min readApril 15, 2026

Onboard to Any Git Repo Fast: 5 Commands Before I Read Code

Five git commands I run before reading any code: find churn hotspots, map ownership risk, spot bug clusters, read delivery cadence, and detect firefighting patterns in minutes.

AI
18 min readApril 12, 2026

The Ultimate Guide to Free AI API Keys: 6 Platforms You Need to Know

Free AI API keys from OpenRouter, Groq, Google AI Studio, NVIDIA Build, GitHub Models, and Cloudflare Workers AI - rate limits, working provider combos, and key hygiene explained.

Performance
10 min readMarch 10, 2026

Improving Next.js Lighthouse Without Killing the Design

How I chase Lighthouse and Core Web Vitals on a real Next.js portfolio without turning the UI into a gray wireframe.

SEO
11 min readMarch 8, 2026

SEO, AEO, and GEO for a Modern Developer Portfolio

How I structure a portfolio so Google, featured snippets, and AI crawlers can all quote me without me sounding like a keyword vending machine.

Frontend
9 min readMarch 5, 2026

Shipping React UI Fast Without Making a Mess

The way I structure React and Next.js UI so the team ships fast because the system is obvious, not because we skipped every guardrail.

Frontend
13 min readSeptember 15, 2025

JavaScript's Hidden Superpower: Prototypal Inheritance from __proto__ to class

ES6 classes are syntactic sugar over prototypes. This guide explains how the prototype chain actually works, what Object.create does, and how to use composition over inheritance effectively.

Subscribe for new posts, or read how referrals and sponsored placements are handled on this site.