nextjs

Erste Schritte mit nextjs

Überblick

Next.js ist ein React-Framework für die Produktion. Es bietet hybrides statisches und Server-Rendering, TypeScript-Unterstützung, intelligentes Bundling, Routen-Prefetching und mehr ohne Konfiguration.

Erste Schritte

Nach dem Klonen Ihres Repositories folgen Sie diesen Schritten:

1

Abhängigkeiten Installieren

npm install
2

Entwicklungsserver Starten

npm run dev
3

Für Produktion Kompilieren

npm run build && npm start

Projektstruktur

├── app/                # App Router (Next.js 13+)
│   ├── layout.js       # Root-Layout
│   ├── page.js         # Startseite
│   └── [routes]/       # Dynamische Routen
├── pages/              # Pages Router (Alternative)
│   ├── api/            # API-Routen
│   └── _app.js         # App-Komponente
├── public/             # Statische Dateien
├── components/         # React-Komponenten
├── styles/             # CSS-Dateien
├── next.config.js      # Next.js Konfiguration
└── package.json        # Abhängigkeiten und Skripte
        

Wichtige Konzepte

Dateibasiertes Routing

Erstellen Sie Seiten durch Hinzufügen von Dateien zu app/ oder pages/ Verzeichnis.

Server-Komponenten

Komponenten rendern standardmäßig auf dem Server. Verwenden Sie 'use client' für Client-Komponenten.

API-Routen

Erstellen Sie Backend-API-Endpunkte in app/api/ oder pages/api/.

Nützliche Befehle

npm run dev Entwicklungsserver mit Fast Refresh starten
npm run build Optimierten Produktions-Build erstellen
npm start Produktionsserver starten
Weitere Informationen finden Sie in der offiziellen Next.js Dokumentation.