What is the best architecture for a Next.js site with both static marketing pages and authenticated app pages?
Quick Answer: The best architecture is a single Next.js codebase using the App Router, with static marketing content rendered through Server Components and ISR, and authenticated app surfaces behind middleware-gated route groups. This gives you one deployment, shared design system and SEO foundation, while keeping app data private, cacheable, and fast at the edge. For larger teams, isolate marketing and application concerns with separate route groups, shared packages, and server-side auth/session enforcement rather than client-only protection.
Detailed Explanation
A strong Next.js architecture for mixed marketing and authenticated experiences should separate concerns at the routing and rendering layer, not necessarily at the repository level. Public pages should be optimized for crawlability and performance using static generation, incremental revalidation, and edge-friendly asset delivery, while authenticated pages should be rendered as dynamic Server Components with session validation, role-based access control, and data fetching performed on the server. The most maintainable pattern is a single monorepo or single app with route groups such as (marketing) and (app), shared UI and utility packages, centralized auth middleware, and clear caching boundaries so that public content benefits from CDN caching without leaking private data into static caches.
Key Technical Drivers
- Use App Router route groups to cleanly split public and authenticated surfaces, e.g. /(marketing) for static pages and /(app) for protected workflows, while sharing components and layout primitives.
- Protect app routes with middleware plus server-side session checks in layout or page loaders; never rely on client-side redirects alone for authentication or authorization.
- Apply ISR or static export patterns only to marketing routes, and keep authenticated data uncached or selectively cached with explicit revalidation rules to prevent data leakage and stale personalization.