Pages are special components that become routes automatically when placed in pages/ or app/ directory. Components are reusable UI pieces that don't create routes. Pages can use getStaticProps/getServerSideProps while components cannot.
Server Components are rendered on server by default in App Router. Cannot use browser APIs or React hooks. Better performance and bundle size. Support async operations directly.
Use React Context, state management libraries, or lift state up. Handle component communication. Support state updates. Implement state management patterns.
Implement semantic versioning. Handle backwards compatibility. Support version migration. Implement versioning strategies.
Hydration attaches JavaScript event handlers to server-rendered HTML. Makes static content interactive. Happens automatically after initial load. Preserves server-rendered state.
Use metadata object or generateMetadata function in page files. Set title, description, open graph data. Support dynamic metadata. Handle SEO requirements.
Create error.js files for error boundaries. Handle component errors. Support fallback content. Implement error reporting. Manage error states.
Use [param] syntax for dynamic routes. Access parameters through props. Support multiple segments. Handle parameter validation. Implement dynamic routing.
Use dynamic imports, route-based splitting, component-based splitting. Handle lazy loading. Support chunk optimization. Implement loading strategies.
Implement form handling logic. Handle validation. Support form submission. Implement form state management. Handle form errors.
