How I think about folders, components, server data, and UI boundaries in maintainable React and Next.js projects.
Frontend architecture is mostly about reducing surprise. A new developer should know where data is loaded, where mutations happen, and which components are reusable without reading the whole app.
In Next.js App Router, I like keeping data fetching in Server Components and pushing Client Components down to the smallest interactive area. That keeps the page lighter and makes ownership clearer.
Reusable UI should not be too clever. Buttons, cards, badges, forms, and layout primitives are worth extracting. Business-specific components should stay close to their route until they prove they are shared.
The goal is not a perfect folder structure. The goal is a project that still feels editable after the fifth feature, the third redesign, and the first urgent production bug.
Nested replies, so conversations can branch naturally like Reddit threads.