-
Notifications
You must be signed in to change notification settings - Fork 6
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Automated translation commit: Translated Next.js docs to Japanese und…
…er docs/app-router. Timestamp: 2024-09-10 06:51:18
- Loading branch information
1 parent
fa6aaad
commit c14a5af
Showing
1 changed file
with
33 additions
and
33 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,59 +1,59 @@ | ||
--- | ||
title: Introduction | ||
description: Welcome to the Next.js Documentation. | ||
title: はじめに | ||
description: Next.jsドキュメンテーションへようこそ。 | ||
--- | ||
|
||
Welcome to the Next.js documentation! | ||
Next.jsドキュメンテーションにようこそ! | ||
|
||
## What is Next.js? | ||
## Next.jsとは何ですか? | ||
|
||
Next.js is a React framework for building full-stack web applications. You use React Components to build user interfaces, and Next.js for additional features and optimizations. | ||
Next.jsは、フルスタックのWebアプリケーションを作成するためのReactフレームワークです。ユーザーインターフェースを構築するためにReactコンポーネントを使用し、その他の機能と最適化をNext.jsが担当します。 | ||
|
||
Under the hood, Next.js also abstracts and automatically configures tooling needed for React, like bundling, compiling, and more. This allows you to focus on building your application instead of spending time with configuration. | ||
Next.jsは裏側でReactのためのツール類、例えばバンドリングやコンパイルなどを自動的に抽象化し設定します。これにより、あなたは設定作業に時間をかけることなく、アプリケーションの構築に専念することができます。 | ||
|
||
Whether you're an individual developer or part of a larger team, Next.js can help you build interactive, dynamic, and fast React applications. | ||
あなたが個人の開発者であろうと、大きなチームの一部であろうと、Next.jsはあなたがインタラクティブで動的で速いReactアプリケーションを構築するのをサポートします。 | ||
|
||
## Main Features | ||
## 主な機能 | ||
|
||
Some of the main Next.js features include: | ||
Next.jsの主な機能は以下の通りです: | ||
|
||
| Feature | Description | | ||
| ------------------------------------------------------------------------ | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | | ||
| [Routing](/docs/app/building-your-application/routing) | A file-system based router built on top of Server Components that supports layouts, nested routing, loading states, error handling, and more. | | ||
| [Rendering](/docs/app/building-your-application/rendering) | Client-side and Server-side Rendering with Client and Server Components. Further optimized with Static and Dynamic Rendering on the server with Next.js. Streaming on Edge and Node.js runtimes. | | ||
| [Data Fetching](/docs/app/building-your-application/data-fetching) | Simplified data fetching with async/await in Server Components, and an extended `fetch` API for request memoization, data caching and revalidation. | | ||
| [Styling](/docs/app/building-your-application/styling) | Support for your preferred styling methods, including CSS Modules, Tailwind CSS, and CSS-in-JS | | ||
| [Optimizations](/docs/app/building-your-application/optimizing) | Image, Fonts, and Script Optimizations to improve your application's Core Web Vitals and User Experience. | | ||
| [TypeScript](/docs/app/building-your-application/configuring/typescript) | Improved support for TypeScript, with better type checking and more efficient compilation, as well as custom TypeScript Plugin and type checker. | | ||
| 機能 | 説明 | | ||
| -------------------------------------------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | | ||
| [ルーティング](/docs/app-router/building-your-application/routing) | サーバーコンポーネントを基に作成されたファイルシステムのルーターで、レイアウト、ネストしたルーティング、Loadingの状態、エラーハンドリングなどをサポート。 | | ||
| [レンダリング](/docs/app-router/building-your-application/rendering) | クライアントサイドとサーバーサイドのレンダリングを行い、クライアントとサーバーのコンポーネントを使用。スタティックおよびダイナミックなレンダリングをNext.jsがサーバー上で最適化。EdgeとNode.jsのランタイムをストリーミング。 | | ||
| [データ取得](/docs/app-router/building-your-application/data-fetching) | `fetch`APIを拡張した非同期/待機型のサーバーコンポーネントでデータ取得を単純化。リクエストのメモ化、データキャッシング、再検証をサポート。 | | ||
| [スタイリング](/docs/app-router/building-your-application/styling) | CSSモジュール、Tailwind CSS、CSS-in-JSを含む、あなたの好みのスタイリング方法をサポート | | ||
| [最適化](/docs/app-router/building-your-application/optimizing) | 画像、フォント、スクリプトの最適化を行い、あなたのアプリケーションのユーザービリティとコアWebビタルズを向上させます。 | | ||
| [TypeScript](/docs/app-router/building-your-application/configuring/typescript) | フルサポートされたTypeScriptで、より優れた型チェックと効率的なコンパイルが可能。またカスタムされたTypeScriptプラグインと型チェッカーを用意しています。 | | ||
|
||
## How to Use These Docs | ||
## このドキュメンテーションの使い方 | ||
|
||
On the left side of the screen, you'll find the docs navbar. The pages of the docs are organized sequentially, from basic to advanced, so you can follow them step-by-step when building your application. However, you can read them in any order or skip to the pages that apply to your use case. | ||
画面の左側にはドキュメンテーションのナビゲーションバーが表示されています。ドキュメンテーションのページは基本から高度なものまで順に並べられているので、アプリケーションを構築する際にはそれらを順に参照することが可能です。ただし、任意のページを読んだり、自分のケースに適用可能なページにスキップしたりすることも可能です。 | ||
|
||
On the right side of the screen, you'll see a table of contents that makes it easier to navigate between sections of a page. If you need to quickly find a page, you can use the search bar at the top, or the search shortcut (`Ctrl+K` or `Cmd+K`). | ||
画面の右側にはページの各セクション間を容易に移動するための目次が表示されています。すぐに特定のページを探したい場合は、上部の検索バーを使用するか、検索ショートカット(`Ctrl+K`または`Cmd+K`)を使用できます。 | ||
|
||
To get started, check out the [Installation](/docs/getting-started/installation) guide. | ||
始めるためには、[インストールガイド](/docs/getting-started/installation)をチェックしてみてください。 | ||
|
||
## App Router vs Pages Router | ||
## App RouterとPages Router | ||
|
||
Next.js has two different routers: the App Router and the Pages Router. The App Router is a newer router that allows you to use React's latest features, such as Server Components and Streaming. The Pages Router is the original Next.js router, which allowed you to build server-rendered React applications and continues to be supported for older Next.js applications. | ||
Next.jsには2種類のルーターがあります:App RouterとPages Routerです。App Routerは新しいルーターで、サーバーコンポーネントとストリーミングなどのReactの最新機能を使用できるようにします。Pages Routerは元々Next.jsで使用されていたルーターで、サーバー側レンダリングのReactアプリケーションを構築することができ、旧来のNext.jsアプリケーションに対してサポートされ続けています。 | ||
|
||
At the top of the sidebar, you'll notice a dropdown menu that allows you to switch between the **App Router** and the **Pages Router** features. Since there are features that are unique to each directory, it's important to keep track of which tab is selected. | ||
サイドバーの上部に**App Router**と**Pages Router**の機能を切り替えることができるドロップダウンメニューがあることに注意してください。それぞれのディレクトリに固有の機能があるため、どちらのタブが選択されているかを把握しておくことが重要です。 | ||
|
||
The breadcrumbs at the top of the page will also indicate whether you're viewing App Router docs or Pages Router docs. | ||
ページの上部にあるブレッドクラムは、App Routerのドキュメンテーションを表示しているのか、Pages Routerのドキュメンテーションを表示しているのかを示します。 | ||
|
||
## Pre-Requisite Knowledge | ||
## 必要な基礎知識 | ||
|
||
Although our docs are designed to be beginner-friendly, we need to establish a baseline so that the docs can stay focused on Next.js functionality. We'll make sure to provide links to relevant documentation whenever we introduce a new concept. | ||
ドキュメンテーションは初心者にも親切に設計されていますが、Next.jsの機能に焦点を当ててドキュメンテーションを進めるためには、基準となる知識を確立する必要があります。新しい概念を導入するたびに、該当するドキュメンテーションへのリンクを提供するようにします。 | ||
|
||
To get the most out of our docs, it's recommended that you have a basic understanding of HTML, CSS, and React. If you need to brush up on your React skills, check out our [React Foundations Course](/learn/react-foundations), which will introduce you to the fundamentals. Then, learn more about Next.js by [building a dashboard application](/learn/dashboard-app). | ||
ドキュメンテーションを最大限に活用するためには、HTML、CSS、Reactの基本的な理解が推奨されます。Reactのスキルを磨きたい方は、基礎から学べる[React Foundations Course](/learn/react-foundations)をチェックしてみてください。その後、[ダッシュボードアプリケーションの作成](/learn/dashboard-app)を通じてNext.jsについてより詳しく学ぶことができます。 | ||
|
||
## Accessibility | ||
## アクセシビリティ | ||
|
||
For optimal accessibility when using a screen reader while reading the docs, we recommend using Firefox and NVDA, or Safari and VoiceOver. | ||
ドキュメントを読む際にスクリーンリーダーを使用する場合、FirefoxとNVDAまたはSafariとVoiceOverを使用することをお勧めします。 | ||
|
||
## Join our Community | ||
## コミュニティへの参加 | ||
|
||
If you have questions about anything related to Next.js, you're always welcome to ask our community on [GitHub Discussions](https://github.com/vercel/next.js/discussions), [Discord](https://discord.com/invite/bUG2bvbtHy), [X (Twitter)](https://x.com/nextjs), and [Reddit](https://www.reddit.com/r/nextjs). | ||
Next.jsに関連する質問がある場合は、いつでも[GitHub Discussions](https://github.com/vercel/next.js/discussions)、[Discord](https://discord.com/invite/bUG2bvbtHy)、[X (Twitter)](https://x.com/nextjs)、または[Reddit](https://www.reddit.com/r/nextjs)のコミュニティで質問をしていただけます。 | ||
|
||
test | ||
テスト |