# Next.js

## Docs

- [create-next-app](https://mintlify.wiki/vercel/next.js/api-reference/cli/create-next-app.md): Create a new Next.js application with a single command using create-next-app.
- [next build](https://mintlify.wiki/vercel/next.js/api-reference/cli/next-build.md): Build your Next.js application for production with next build.
- [next dev](https://mintlify.wiki/vercel/next.js/api-reference/cli/next-dev.md): Start the Next.js development server with Hot Module Replacement, error reporting, and more.
- [next start](https://mintlify.wiki/vercel/next.js/api-reference/cli/next-start.md): Start a production Next.js server after building with next build.
- [Font](https://mintlify.wiki/vercel/next.js/api-reference/components/font.md): Optimize web font loading with next/font, which self-hosts fonts at build time and eliminates external network requests for improved privacy and performance.
- [<Form>](https://mintlify.wiki/vercel/next.js/api-reference/components/form.md): The next/form component extends HTML <form> with client-side navigation, search param encoding, prefetching, and Server Action integration.
- [<Image>](https://mintlify.wiki/vercel/next.js/api-reference/components/image.md): Optimize images in your Next.js application using the built-in next/image component with automatic format conversion, resizing, and lazy loading.
- [<Link>](https://mintlify.wiki/vercel/next.js/api-reference/components/link.md): Enable fast client-side navigation with the built-in next/link component, which extends the HTML <a> element with prefetching and SPA navigation.
- [<Script>](https://mintlify.wiki/vercel/next.js/api-reference/components/script.md): Optimize third-party script loading in your Next.js application using the built-in next/script component with fine-grained loading strategies.
- [Edge Runtime](https://mintlify.wiki/vercel/next.js/api-reference/config/edge.md): API reference for the Next.js Edge Runtime: supported APIs, restrictions, and how to use it in Middleware and Route Handlers.
- [ESLint](https://mintlify.wiki/vercel/next.js/api-reference/config/eslint.md): Next.js provides an ESLint configuration package that catches common issues and enforces best practices in your application.
- [next.config.js](https://mintlify.wiki/vercel/next.js/api-reference/config/next-config-js.md): Configure your Next.js application with next.config.js or next.config.ts, covering output, images, redirects, rewrites, headers, env, webpack, and more.
- [Turbopack](https://mintlify.wiki/vercel/next.js/api-reference/config/turbopack.md): Configure Turbopack in Next.js — loaders, resolve aliases, module ID strategies, and more.
- [TypeScript](https://mintlify.wiki/vercel/next.js/api-reference/config/typescript.md): Next.js provides a TypeScript-first development experience, including automatic configuration, type-safe navigation, IDE plugin, and typed environment variables.
- [error.js](https://mintlify.wiki/vercel/next.js/api-reference/file-conventions/error.md): API reference for the error.js file convention. Wraps a route segment in a React error boundary to display fallback UI when unexpected errors occur.
- [instrumentation.js](https://mintlify.wiki/vercel/next.js/api-reference/file-conventions/instrumentation.md): API reference for the instrumentation.js file convention. Integrate observability tools, track performance, and handle server-side errors across your application.
- [layout.js](https://mintlify.wiki/vercel/next.js/api-reference/file-conventions/layout.md): API reference for the layout.js file convention. Layouts wrap route segments and persist across navigations, preserving state and avoiding unnecessary re-renders.
- [loading.js](https://mintlify.wiki/vercel/next.js/api-reference/file-conventions/loading.md): API reference for the loading.js file convention. Creates an automatic Suspense boundary that shows instant loading UI while route content streams in.
- [middleware.ts](https://mintlify.wiki/vercel/next.js/api-reference/file-conventions/middleware.md): API reference for the middleware.ts file convention. Run code before a request completes to redirect, rewrite, set headers, or modify cookies.
- [not-found.js](https://mintlify.wiki/vercel/next.js/api-reference/file-conventions/not-found.md): API reference for not-found.js and global-not-found.js. Used to render custom 404 UI when notFound() is called or when a URL does not match any route.
- [page.js](https://mintlify.wiki/vercel/next.js/api-reference/file-conventions/page.md): API reference for the page.js file convention. Pages define unique UI for a route and receive dynamic params and search parameters as props.
- [route.js](https://mintlify.wiki/vercel/next.js/api-reference/file-conventions/route.md): API reference for the route.js file convention. Create custom HTTP request handlers using the Web Request and Response APIs.
- [template.js](https://mintlify.wiki/vercel/next.js/api-reference/file-conventions/template.md): API reference for the template.js file convention. Templates are similar to layouts but create a new component instance on every navigation, resetting state and effects.
- [after](https://mintlify.wiki/vercel/next.js/api-reference/functions/after.md): API reference for the after() function, used to schedule work to run after a response is sent.
- [cookies](https://mintlify.wiki/vercel/next.js/api-reference/functions/cookies.md): API reference for the cookies() function, used to read and write HTTP cookies in Server Components, Server Functions, and Route Handlers.
- [fetch](https://mintlify.wiki/vercel/next.js/api-reference/functions/fetch.md): API reference for the extended fetch() function in Next.js, which adds server-side caching and revalidation options.
- [generateMetadata](https://mintlify.wiki/vercel/next.js/api-reference/functions/generate-metadata.md): API reference for the metadata object and generateMetadata function used to define page metadata for SEO and web shareability.
- [generateStaticParams](https://mintlify.wiki/vercel/next.js/api-reference/functions/generate-static-params.md): API reference for the generateStaticParams function, used to statically generate routes at build time for dynamic segments.
- [headers](https://mintlify.wiki/vercel/next.js/api-reference/functions/headers.md): API reference for the headers() function, used to read HTTP request headers in Server Components.
- [ImageResponse](https://mintlify.wiki/vercel/next.js/api-reference/functions/image-response.md): API reference for the ImageResponse class, used to generate dynamic images (e.g. Open Graph images) using JSX and CSS.
- [NextRequest](https://mintlify.wiki/vercel/next.js/api-reference/functions/next-request.md): API reference for the NextRequest class, which extends the Web Request API with additional helpers for Next.js middleware and Route Handlers.
- [NextResponse](https://mintlify.wiki/vercel/next.js/api-reference/functions/next-response.md): API reference for the NextResponse class, which extends the Web Response API with helpers for redirects, rewrites, and cookie management in middleware.
- [redirect](https://mintlify.wiki/vercel/next.js/api-reference/functions/redirect.md): API reference for the redirect() and permanentRedirect() functions used to navigate users to a different URL.
- [revalidatePath](https://mintlify.wiki/vercel/next.js/api-reference/functions/revalidate-path.md): API reference for the revalidatePath() function, used to invalidate cached data for a specific route path on demand.
- [revalidateTag](https://mintlify.wiki/vercel/next.js/api-reference/functions/revalidate-tag.md): API reference for the revalidateTag() function, used to invalidate cached data for a specific cache tag on demand.
- [useParams](https://mintlify.wiki/vercel/next.js/api-reference/functions/use-params.md): API reference for the useParams hook, used to read dynamic route parameters in Client Components.
- [usePathname](https://mintlify.wiki/vercel/next.js/api-reference/functions/use-pathname.md): API reference for the usePathname hook, used to read the current URL pathname in Client Components.
- [useRouter](https://mintlify.wiki/vercel/next.js/api-reference/functions/use-router.md): API reference for the useRouter hook, used to programmatically navigate between routes in Client Components.
- [useSearchParams](https://mintlify.wiki/vercel/next.js/api-reference/functions/use-search-params.md): API reference for the useSearchParams hook, used to read the current URL query string in Client Components.
- [Caching](https://mintlify.wiki/vercel/next.js/app/core-concepts/caching.md): Learn how to cache data and UI in Next.js using the use cache directive, cacheLife, cacheTag, and Partial Prerendering.
- [Data Fetching](https://mintlify.wiki/vercel/next.js/app/core-concepts/data-fetching.md): Learn how to fetch data in Server and Client Components using async/await, the fetch API, ORMs, and parallel data fetching patterns.
- [Error Handling](https://mintlify.wiki/vercel/next.js/app/core-concepts/error-handling.md): Learn how to handle expected errors with return values and unexpected exceptions with error boundaries in Next.js App Router.
- [Rendering](https://mintlify.wiki/vercel/next.js/app/core-concepts/rendering.md): Understand how Next.js renders your application — Server Components, Client Components, and the rendering strategies available in the App Router.
- [Revalidating](https://mintlify.wiki/vercel/next.js/app/core-concepts/revalidating.md): Learn how to keep cached data fresh using time-based revalidation with cacheLife, and on-demand revalidation with revalidateTag, updateTag, and revalidatePath.
- [Routing](https://mintlify.wiki/vercel/next.js/app/core-concepts/routing.md): Learn how the App Router uses the file system to define routes — including dynamic routes, route groups, layouts, and middleware.
- [Streaming](https://mintlify.wiki/vercel/next.js/app/core-concepts/streaming.md): Learn how to use React Suspense and the loading.js convention to progressively stream UI from the server to the client in Next.js.
- [Deploying](https://mintlify.wiki/vercel/next.js/app/getting-started/deploying.md): Learn how to deploy your Next.js application as a Node.js server, Docker container, static export, or using a platform adapter.
- [Fetching data](https://mintlify.wiki/vercel/next.js/app/getting-started/fetching-data.md): Learn how to fetch data in Server and Client Components, stream loading states with Suspense, and share data across components with React.cache.
- [Installation](https://mintlify.wiki/vercel/next.js/app/getting-started/installation.md): Create a new Next.js application with create-next-app, or set it up manually. Covers system requirements, TypeScript, ESLint, and module path aliases.
- [Introduction](https://mintlify.wiki/vercel/next.js/app/getting-started/introduction.md): Next.js App Router is a React framework for building full-stack web applications. Learn what it is, why to use it, and how to get started.
- [Layouts and pages](https://mintlify.wiki/vercel/next.js/app/getting-started/layouts-and-pages.md): Create your first pages and shared layouts, link between them, and use dynamic segments to generate routes from data.
- [Linking and navigating](https://mintlify.wiki/vercel/next.js/app/getting-started/linking-and-navigating.md): Learn how prefetching, streaming, and client-side transitions work in Next.js, and how to optimize navigation for dynamic routes and slow networks.
- [Mutating data](https://mintlify.wiki/vercel/next.js/app/getting-started/mutating-data.md): Learn how to mutate data in Next.js using Server Functions and Server Actions, handle form submissions, show pending states, and revalidate the cache.
- [Project structure](https://mintlify.wiki/vercel/next.js/app/getting-started/project-structure.md): An overview of all folder and file conventions in a Next.js App Router project, and how to organize your code.
- [Server and Client Components](https://mintlify.wiki/vercel/next.js/app/getting-started/server-and-client-components.md): Learn when to use React Server Components and Client Components, how the 'use client' directive works, and how to compose them together.
- [Authentication](https://mintlify.wiki/vercel/next.js/app/guides/authentication.md): Learn how to implement authentication, session management, and authorization in your Next.js App Router application.
- [Content Security Policy](https://mintlify.wiki/vercel/next.js/app/guides/content-security-policy.md): Learn how to configure a Content Security Policy (CSP) for your Next.js application using nonces with Middleware or static headers in next.config.js.
- [Debugging](https://mintlify.wiki/vercel/next.js/app/guides/debugging.md): Learn how to debug your Next.js application using VS Code, Chrome DevTools, Firefox DevTools, and the Node.js inspector.
- [Draft mode](https://mintlify.wiki/vercel/next.js/app/guides/draft-mode.md): Learn how to use Draft Mode in Next.js to preview headless CMS draft content by bypassing static generation caching.
- [Environment variables](https://mintlify.wiki/vercel/next.js/app/guides/environment-variables.md): Learn how to use .env files, the NEXT_PUBLIC_ prefix, runtime vs build-time variables, and the environment variable load order in Next.js.
- [Forms](https://mintlify.wiki/vercel/next.js/app/guides/forms.md): Learn how to handle form submissions with Server Actions, add validation, display errors, manage pending states, and implement optimistic updates in Next.js.
- [Internationalization](https://mintlify.wiki/vercel/next.js/app/guides/internationalization.md): Add support for multiple languages with i18n routing, locale detection, and server-side message translation in the Next.js App Router.
- [Multi-zones](https://mintlify.wiki/vercel/next.js/app/guides/multi-zones.md): Learn how to build micro-frontends with Next.js Multi-Zones by splitting your application into independently deployed Next.js apps that share a single domain.
- [OpenTelemetry](https://mintlify.wiki/vercel/next.js/app/guides/open-telemetry.md): Learn how to instrument your Next.js application with OpenTelemetry for observability, tracing, and performance monitoring.
- [Production checklist](https://mintlify.wiki/vercel/next.js/app/guides/production-checklist.md): A comprehensive checklist of optimizations and best practices to apply before deploying your Next.js application to production.
- [Progressive Web Apps](https://mintlify.wiki/vercel/next.js/app/guides/progressive-web-apps.md): Learn how to build a Progressive Web App (PWA) with Next.js, including the manifest, service workers, push notifications, and home screen installation.
- [Redirecting](https://mintlify.wiki/vercel/next.js/app/guides/redirecting.md): Learn all the ways to handle redirects in Next.js, including redirect(), permanentRedirect(), next.config.js redirects, and middleware redirects.
- [Self-hosting](https://mintlify.wiki/vercel/next.js/app/guides/self-hosting.md): Learn how to deploy your Next.js application on a Node.js server, Docker container, or as a static export.
- [Single-page applications](https://mintlify.wiki/vercel/next.js/app/guides/single-page-applications.md): Learn how to build SPAs with Next.js, including client-side data fetching patterns, shallow routing, and progressive adoption of server features.
- [Static exports](https://mintlify.wiki/vercel/next.js/app/guides/static-exports.md): Learn how to export your Next.js app as a static site, what features are supported, and how to deploy the output.
- [Testing](https://mintlify.wiki/vercel/next.js/app/guides/testing.md): Learn how to set up unit, component, and end-to-end testing in your Next.js application with Jest, Vitest, Playwright, and Cypress.
- [Analytics](https://mintlify.wiki/vercel/next.js/app/optimizations/analytics.md): Measure and report Web Vitals performance metrics from your Next.js application.
- [Fonts](https://mintlify.wiki/vercel/next.js/app/optimizations/fonts.md): Optimize fonts in your Next.js application with next/font for automatic self-hosting and zero layout shift.
- [Images](https://mintlify.wiki/vercel/next.js/app/optimizations/images.md): Optimize images in your Next.js application with the built-in next/image component.
- [Lazy loading](https://mintlify.wiki/vercel/next.js/app/optimizations/lazy-loading.md): Lazy load imported libraries and React components to improve your application's loading performance.
- [Metadata](https://mintlify.wiki/vercel/next.js/app/optimizations/metadata.md): Define static and dynamic metadata, OpenGraph images, and other SEO tags using the Next.js Metadata APIs.
- [Scripts](https://mintlify.wiki/vercel/next.js/app/optimizations/scripts.md): Optimize third-party scripts in your Next.js application with the next/script component.
- [CSS](https://mintlify.wiki/vercel/next.js/app/styling/css.md): Style your Next.js application with CSS Modules, global CSS, and external stylesheets.
- [CSS-in-JS](https://mintlify.wiki/vercel/next.js/app/styling/css-in-js.md): Use CSS-in-JS libraries like styled-components and Emotion with the Next.js App Router.
- [Sass](https://mintlify.wiki/vercel/next.js/app/styling/sass.md): Style your Next.js application using Sass with .scss and .sass file extensions.
- [Tailwind CSS](https://mintlify.wiki/vercel/next.js/app/styling/tailwind-css.md): Set up and use Tailwind CSS with the Next.js App Router.
- [Accessibility](https://mintlify.wiki/vercel/next.js/architecture/accessibility.md): Next.js includes built-in accessibility features including route announcements and integrated ESLint rules via eslint-plugin-jsx-a11y.
- [Next.js compiler](https://mintlify.wiki/vercel/next.js/architecture/compiler.md): The Next.js SWC compiler transforms and minifies your application. Learn what it compiles, how to configure it, and when Babel is used as a fallback.
- [Fast Refresh](https://mintlify.wiki/vercel/next.js/architecture/fast-refresh.md): Fast Refresh gives you sub-second feedback on edits to React components without losing client-side state.
- [Architecture overview](https://mintlify.wiki/vercel/next.js/architecture/overview.md): A high-level look at how Next.js is structured — the compilation pipeline, rendering strategies, key packages, and how client and server tie together.
- [Turbopack](https://mintlify.wiki/vercel/next.js/architecture/turbopack.md): Turbopack is a Rust-based incremental bundler built into Next.js. Learn how it works, why it's fast, and how it differs from Webpack.
- [Contributing to Next.js](https://mintlify.wiki/vercel/next.js/community/contributing.md): Learn how to set up your development environment, run tests, and submit pull requests to the Next.js repository.
- [Getting support](https://mintlify.wiki/vercel/next.js/community/support.md): Where to ask questions, report bugs, and get help with Next.js.
- [Configuring](https://mintlify.wiki/vercel/next.js/pages/building/configuring.md): Configure next.config.js for Pages Router projects, including environment variables, TypeScript, ESLint, absolute imports, and custom headers.
- [Data fetching](https://mintlify.wiki/vercel/next.js/pages/building/data-fetching.md): Deep dive into getStaticProps, getServerSideProps, getStaticPaths with fallback modes, and SWR for client-side data fetching in the Pages Router.
- [Deploying](https://mintlify.wiki/vercel/next.js/pages/building/deploying.md): Deploy your Next.js Pages Router app to Vercel, a Node.js server, Docker, or as a static export.
- [Optimizations](https://mintlify.wiki/vercel/next.js/pages/building/optimizations.md): Image optimization, font optimization, script loading strategies, lazy loading, and bundle analysis in the Pages Router.
- [Rendering](https://mintlify.wiki/vercel/next.js/pages/building/rendering.md): Static Site Generation (SSG), Server-side Rendering (SSR), Incremental Static Regeneration (ISR), and client-side rendering in the Pages Router.
- [Routing](https://mintlify.wiki/vercel/next.js/pages/building/routing.md): File-based routing in the Pages Router, including dynamic routes, catch-all routes, nested routes, the Link component, and API routes.
- [Styling](https://mintlify.wiki/vercel/next.js/pages/building/styling.md): CSS Modules, global CSS, styled-jsx, Sass, and CSS-in-JS in the Pages Router.
- [Installation](https://mintlify.wiki/vercel/next.js/pages/getting-started/installation.md): Create a new Next.js Pages Router project with create-next-app, or add Pages Router to an existing project.
- [Introduction to the Pages Router](https://mintlify.wiki/vercel/next.js/pages/getting-started/introduction.md): An overview of the Pages Router, how it differs from the App Router, and when to use it.
- [Project structure](https://mintlify.wiki/vercel/next.js/pages/getting-started/project-structure.md): A reference for the folder and file conventions in a Next.js Pages Router project.

## OpenAPI Specs

- [openapi](https://mintlify.wiki/vercel/next.js/api-reference/openapi.json)