Definieren von Routen

Wir empfehlen, die Seite Routing-Grundlagen vor dem Weiterlesen durchzugehen.

Diese Seite führt Sie durch das Definieren und Organisieren von Routen in Ihrer Next.js-Anwendung.

Routen erstellen

Next.js verwendet einen dateisystembasierten Router, bei dem Ordner zur Definition von Routen verwendet werden.

Jeder Ordner repräsentiert ein Route-Segment, das einem URL-Segment zugeordnet ist. Um eine verschachtelte Route zu erstellen, können Sie Ordner ineinander verschachteln.

Route-Segmente zu Pfadsegmenten

Eine spezielle page.js-Datei wird verwendet, um Routensegmente öffentlich zugänglich zu machen.

Routen definieren

In diesem Beispiel ist der URL-Pfad /dashboard/analytics nicht öffentlich zugänglich, da er keine entsprechende page.js-Datei hat. Dieser Ordner könnte verwendet werden, um Komponenten, Stylesheets, Bilder oder andere zusammengehörige Dateien zu speichern.

Gut zu wissen: Die Dateiendungen .js, .jsx oder .tsx können für spezielle Dateien verwendet werden.

UI erstellen

Spezielle Dateikonventionen werden verwendet, um UI für jedes Routensegment zu erstellen. Die gebräuchlichsten sind Seiten zur Anzeige von UI, die für eine Route einzigartig ist, und Layouts zur Anzeige von UI, die über mehrere Routen hinweg geteilt wird.

Um beispielsweise Ihre erste Seite zu erstellen, fügen Sie eine page.js-Datei in das app-Verzeichnis ein und exportieren Sie eine React-Komponente:

export default function Page() {
  return <h1>Hello, Next.js!</h1>
}
export default function Page() {
  return <h1>Hello, Next.js!</h1>
}