Writing

Blog

Writing on system design, React, web performance, and the craft of building software.

1

What This Advanced React Series Actually Covers

Part 1•5 min read•This series is the map I wish I had before building serious React apps. Layout, containers, forms, performance, and TypeScript all have a place here.

React File Naming Conventions: The Only Rule That Actually Matters

Part 2•3 min read•React has no official naming convention. PascalCase, camelCase, and kebab-case are all used in production codebases. Here's what I've seen work and why consistency beats everything else.

2

Layout Components and the Split Screen Pattern

Part 1•3 min read•I kept mixing layout CSS into content components until I saw why that kills reusability. Layout components fix this by owning the 'where', so content only owns the 'what'.

List and List Item Patterns in React

Part 2•4 min read•Six components, eight combinations, zero duplication. Here's how separating list containers from list items turns a maintenance headache into a composable system.

Building a Modal as a Layout Component

Part 3•3 min read•A modal is not a special case. It's a layout component with visibility state. Build one from scratch and discover why stopPropagation is the one line you cannot skip.

3

What Are React Design Patterns (And Why They Are Not Gang of Four)

Part 1•3 min read•React design patterns are not the Singleton or Factory from your CS textbook. They emerged from specific React problems. Here's the map before we go deep.

Container Components: One Place for Data, Many Places to Display It

Part 2•3 min read•Every component that fetches its own data creates a duplication problem. Container components fix this by extracting data loading into a wrapper that passes results down automatically.

Generic Data Containers: Three Levels of Abstraction

Part 3•4 min read•A container hardcoded to one endpoint is a start. Remove assumptions one at a time and you end up with a DataSource that fetches from any source: API, localStorage, Redux, or a mock.

Advanced React: Patterns & Performance | Writing & Engineering | Durgesh Rai