Restauracja Aurelia - Next.js Website

Strona restauracji premium zbudowana w Next.js 14 z TypeScript.

Funkcjonalności

• Responsywny design - dopasowany do wszystkich urządzeń
• Animacje przy scrollowaniu - fade-in/slide-up efekty (framer-motion)
• Menu mobilne - hamburger menu dla urządzeń mobilnych
• Formularz rezerwacji - z walidacją i powiadomieniami (react-hot-toast)
• Optymalizacja obrazów - Next.js Image z lazy loading
• Efekty hover - na kartach menu i galerii
• Animacja liczników - count-up dla statystyk
• Parallax effect - na hero image
• Custom scrollbar - własny pasek przewijania
• Smooth scroll - płynne scrollowanie z offsetem
• Back to top button - przycisk powrotu na górę
• SEO - Open Graph tags i Schema.org JSON-LD

Technologie

• Next.js 14 (App Router)
• TypeScript
• React 18
• Framer Motion (animacje)
• React Hot Toast (powiadomienia)
• Google Fonts (Inter, Cormorant Garamond)

Lokalne uruchomienie

# Zainstaluj zależności
npm install

# Uruchom development server
npm run dev

Otwórz http://localhost:3000 w przeglądarce.

Budowanie

# Zbuduj produkcję
npm run build

# Uruchom produkcję
npm start

Deploy na Netlify

Metoda 1: Git integration (zalecana)

1. Push kod do GitHub/GitLab/Bitbucket
2. Zaloguj się na Netlify
3. Kliknij "Add new site" → "Import an existing project"
4. Wybierz repozytorium
5. Netlify automatycznie wykryje Next.js dzięki netlify.toml

Metoda 2: Netlify CLI

# Zainstaluj Netlify CLI
npm install -g netlify-cli

# Zaloguj się
netlify login

# Zainicjuj deploy
netlify init

# Deploy
netlify deploy --prod

Metoda 3: Drag & Drop

# Zbuduj projekt
npm run build

# Wrzuć folder .next na Netlify dashboard

Konfiguracja Netlify

Projekt zawiera netlify.toml z automatyczną konfiguracją:

• Build command: npm run build
• Publish directory: .next
• Node version: 18
• Plugin: @netlify/plugin-nextjs

Zmienne środowiskowe

Jeśli potrzebujesz zmiennych środowiskowych, dodaj je w Netlify dashboard:

1. Site settings → Environment variables
2. Dodaj zmienne (np. API keys, secrets)

Struktura projektu

projekt1/
├── src/
│   ├── app/
│   │   ├── layout.tsx      # Główny layout z metadata
│   │   ├── page.tsx        # Strona główna
│   │   └── globals.css     # Globalne style
│   └── components/
│       ├── ScrollAnimation.tsx
│       ├── MobileMenu.tsx
│       ├── CountUp.tsx
│       ├── BackToTop.tsx
│       ├── ReservationForm.tsx
│       ├── HeroImage.tsx
│       └── GalleryImage.tsx
├── public/                 # Statyczne assets
├── netlify.toml           # Konfiguracja Netlify
├── next.config.js         # Konfiguracja Next.js
├── tsconfig.json          # Konfiguracja TypeScript
├── package.json           # Zależności
└── README.md              # Ten plik

Wsparcie

W razie problemów z deployem:

• Sprawdź Netlify Next.js documentation
• Upewnij się że netlify.toml jest w głównym folderze
• Sprawdź logi build w Netlify dashboard