All Guides

Next.js Projekt Einrichtung

Erstellen Sie eine moderne Webanwendung mit Next.js 14+.

Intermediate15 Min.

Setup Steps

1. Create a new Next.js project:

npx create-next-app@latest project-name

2. Options during setup:

- TypeScript: Yes

- ESLint: Yes

- Tailwind CSS: Yes

- src/ directory: Yes

- App Router: Yes

- Import alias: @/*

3. Navigate to the project directory:

cd project-name

4. Start the development server:

npm run dev

5. Open http://localhost:3000 in your browser

6. Create a page (App Router):

mkdir -p src/app/about

Create page file: src/app/about/page.tsx

7. Create an API Route:

mkdir -p src/app/api/hello

Route file: src/app/api/hello/route.ts

8. Production build:

npm run build
npm start

9. Environment variables (.env.local):

DATABASE_URL="..."
NEXT_PUBLIC_API_URL="..."