AMAhmed Mahmoudinengahmed.hashnode.dev·6h ago · 6 min readURL State in the Next.js App Router: How I Stopped Losing UI State on Refresh 9151f5Headline: URL state means storing UI state — filters, active tab, search query, pagination — in the URL query string instead of React useState, so a refresh, a shared link, or the back button restores00
AMAhmed Mahmoudinengahmed.hashnode.dev·1d ago · 7 min readError Handling in the Next.js App Router: How I Stopped One Throw From Blanking the Page 6cfc2bHeadline: In the Next.js App Router, error.tsx is a React error boundary for a route segment: it catches errors thrown while rendering that segment and everything nested below it, hands you an error o00
AMAhmed Mahmoudinengahmed.hashnode.dev·2d ago · 6 min readView Transitions in Next.js: How I Added Animated Page Changes Without a Library c3f6f5Headline: The View Transitions API animates the change between two DOM states — you call document.startViewTransition(), and the browser cross-fades or morphs the old page into the new one. In a Next.00
AMAhmed Mahmoudinengahmed.hashnode.dev·4d ago · 7 min readDebugging Hydration Mismatches in the Next.js App Router 3e99c5Headline: A hydration mismatch happens when the HTML your Next.js server renders does not match what React produces on the first client render, so React 19 throws away that subtree and re-renders it i00
AMAhmed Mahmoudinengahmed.hashnode.dev·4d ago · 3 min readFixing INP: Field Notes on Interaction to Next Paint in a React App 10c61aHeadline: Interaction to Next Paint (INP) is the Core Web Vitals metric that measures how long your page takes to visually respond to a user interaction, and since March 2024 it replaced First Input D00
