#React
85 posts
TypeScript + React in Practice #6: Fetch and API response typing
The limits and risks of generic fetchers, and patterns for truly safe handling of external data using zod runtime validation.
TypeScript + React in Practice #5: Context and generic components
Type-argument patterns for createContext, a safe useContext helper, and how to build reusable List/Select-like components with generic components.
TypeScript + React in Practice #4: Typing events and forms
What types to use for React event objects and how to type controlled/uncontrolled forms in TypeScript — with practical patterns.
TypeScript + React in Practice #3: Typing hooks
How far to leave types to inference and when to be explicit for built-in hooks — useState, useReducer, useRef, useCallback, and useMemo.
TypeScript + React in Practice #2: Typing props and children
How to define props types and how far to narrow them — optional props, union props, and children patterns. Real-world decisions you meet often.
TypeScript + React in Practice #1: Getting Started and Setup
Why use TypeScript with React, plus building a React + TS project with Vite and adding types to your first component — all in one go.
Build a Blog with Next.js #5: SEO and Deployment (Wrap-up)
Optimize for search engines with the metadata API, build sitemap and RSS, and deploy to Vercel. Wrap up with a retrospective across the series and the 31 React posts in total.
Build a Blog with Next.js #4: Comments (Server Actions)
Let users comment on each post. Handle form submission and validation with Server Actions, polish UX with useActionState, and apply the patterns to a real build.
Build a Blog with Next.js #3: Tags and Search
Add a per-tag post list page and a search feature driven by URL query parameters. Two dynamic-route patterns (generateStaticParams vs searchParams) appear together.
Build a Blog with Next.js #2: Post List and Detail Page
Read MDX files directly with fs in a Server Component, compile the body in a dynamic route, and render it on the screen — the core flow.
Build a Blog with Next.js #1: Getting Started and Design
Apply Server Components and Server Actions from the Modern React series to a real project. The first post covers requirements, data model, folder structure, and MDX setup.
Modern React + Next.js #6 Server Actions and Forms (Wrap-up)
Use Server Actions to handle form submission and server-data mutation simply, polish the UX with useActionState/useFormStatus, and reflect on the series.