App Router patterns I reach for on product work
Server components by default, thin route handlers, and clear client boundaries — without overengineering.
The App Router rewards teams that think in composition rather than pages as giant client islands.
Default to server components
Fetch data close to the source, keep secrets on the server, and only mark interactive leaves with "use client". Your bundle and mental model both stay lighter.
Colocate route handlers
API scaffolds under app/api are perfect for contact forms and chat endpoints. Keep them thin: validate input, call a service helper, return JSON with clear status codes.
Shared data modules
A single content module (or a CMS later) keeps marketing copy and project metadata out of components. Components become presentation; content becomes easy to swap.
Layouts for chrome
Nav, footer, and ambient backgrounds belong in layout.tsx. Section pages and blog posts inherit the shell without reimplementing it.
What to avoid
Avoid wrapping entire trees in client providers "just in case." Be intentional about interactivity boundaries — it's the difference between a snappy product and a heavy SPA.