RSSAmplifier

Blog

Yash Kapure - Blog (en)

Engineering notes on React, Next.js, performance, and SEO.

yashkapure.comRSS feed ↗22 posts

Latest posts

How to Set Up CI/CD for a React App

A practical, step-by-step walkthrough of CI/CD for React: from a git push to GitHub Actions, quality gates, preview deployments, production releases, monitoring, and rollback - with interactive demos you can run.

Claude Fable 5 Explained: A Quick Developer Guide

Anthropic just launched Claude Fable 5, its most capable model yet. A short, no-fluff guide for developers: what it does, what it costs, how the safety routing works, and how to start using claude-fable-5.

Frontend Architecture for the Age of AI Codegen: Designing Code LLMs Get Right

AI writes most of the boilerplate now. The bottleneck moved to architecture. Here is how to design component APIs, contracts, and guardrails so AI-generated frontend code is correct by construction.

Monorepo Architecture for Frontend Teams

Package boundaries, shared TypeScript configs, build caching, and dependency management - how to structure a monorepo that scales with the team.

Design Systems That Teams Actually Use

Why most design systems collect dust - and how to build one that developers reach for by default. Governance, naming, contribution workflows, and adoption patterns.

Testing Strategy for Frontend Architecture

Where to invest testing effort for maximum confidence - unit tests for logic, integration for workflows, E2E for critical paths, and what to mock at each layer.

API Contracts Between Frontend and Backend

Shared types, Zod schemas, contract testing, and the patterns that turn API mismatches from runtime surprises into compile-time errors.

State Management Without the Pain

A decision tree for where each piece of state lives - useState, useReducer, Context, Zustand, server state, URL state - and when to reach for each.

Component Design: From Primitive to Product

How to design components that compose cleanly - slots, compound components, and the line between flexibility and chaos.

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.

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.

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.

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.

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.

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.

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.

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.

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.

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, 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.

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.

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.