DOCSEARCHbyAlgolia
Submit Docs

Next.js Documentation (Japanese)

website·Indexed 32 days ago

https://nextjsjp.org

Japanese language documentation for Next.js, covering the App Router, Pages Router, and core features. Includes guides on rendering, environment variables, draft mode, Tailwind CSS v3 integration, and the @next/third-parties library, as well as detailed explanations for framework error and warning messages.

Tokens
291.5K
Snippets
1.5K
Records
2K
Agent score
63%

What's inside Next.js

  1. Overview of Next.js MCP Server capabilities

    Next.js provides two MCP (Model Context Protocol) servers to allow AI coding agents to interact with applications via a standardized interface. For the best experience, it is recommended to use both:

    1. Built-in Next.js MCP Server (Next.js 16+): Runs within the dev server. It provides access to real-time application state, runtime information, page metadata, routes, rendering details, build/runtime errors, development logs, Server Actions, and component hierarchies.
    2. Next DevTools MCP (External Package): A separate package (next-devtools-mcp) providing a Next.js Knowledge Base for best practices, migration/upgrade tools (including codemod helpers for Next.js 16), Cache Components guidance, and Playwright MCP integration for browser testing. It can automatically detect and communicate with a running Next.js dev server.

  3. Overview of Route Segment Configuration

    Route Segment Options allow you to configure the behavior of Pages, Layouts, and Route Handlers by exporting specific variables. These options are only valid in Server Component Pages, Layouts, or Route Handlers. Note that if the cacheComponents flag is enabled, these options will be disabled and will be deprecated in the future. Additionally, generateStaticParams cannot be used within 'use client' files.

  5. Overview of the Next.js Compiler

    The Next.js Compiler is a Rust-based tool powered by SWC that transforms and minifies JavaScript code for production. It replaces Babel and Terser, offering up to 17x faster compilation speeds. It is enabled by default in Next.js 12 and later. If a project contains an existing Babel configuration or uses unsupported features, Next.js will automatically opt-out of the compiler and fall back to Babel.

  6. Overview of Next.js Multi Zones for Micro-frontends

    Multi Zones allow you to split a large Next.js application into multiple smaller Next.js applications, each serving a specific set of paths under the same domain. This approach reduces individual application size, improves build times, and allows different zones to potentially use different frameworks.

    Key navigation behaviors:

    • Soft Navigation: Occurs when navigating between pages within the same zone (no full page reload).
    • Hard Navigation: Occurs when navigating between different zones (full page reload). Pages frequently accessed together should be placed in the same zone to avoid hard navigations.

  7. Overview of Turbopack in Next.js

    Turbopack is an incremental bundler written in Rust and integrated into Next.js, optimized for JavaScript and TypeScript. It is designed to improve local development performance through a single unified graph for all output environments, optimized bundling (rather than relying solely on native ESM), incremental computation with function-level caching, and lazy bundling that only processes requested assets.

  8. Overview of Next.js Preview Mode

    Preview Mode allows developers to bypass Static Generation and render pages at request time. This is specifically useful for previewing draft content from a headless CMS before it is officially published. Note: This feature has been superseded by Draft Mode.

  10. Overview of Next.js Draft Mode

    Draft Mode allows developers to preview draft content from a headless CMS in a Next.js application. When enabled, it switches the application to dynamic rendering, allowing changes to be viewed immediately without requiring a full site rebuild. This is particularly useful for pages that are otherwise statically generated at build time.

  11. Overview of Next.js CLI tools

    Next.js provides two primary command-line interface (CLI) tools for different stages of application development:

    1. create-next-app: Used to quickly bootstrap a new Next.js application using the default template or examples from public GitHub repositories.
    2. next: Used for operational tasks such as running the development server and building the application for production.

  12. Overview of Turbopack in Next.js

    Turbopack is an incremental bundler written in Rust and optimized for JavaScript and TypeScript, integrated directly into Next.js. It supports both the Pages Router and App Router. Key performance features include:

    • Unified Graph: Uses a single graph for all output environments (client and server).
    • Optimized Bundling: Bundles during development to avoid the network request overhead of native ESM in large apps.
    • Incremental Computation: Parallelizes work across cores and caches results at the function level.
    • Lazy Bundling: Only bundles modules actually requested by the development server, reducing initial compile time and memory usage.