# Source Setups - Tasarım Hizmetleri

Source Setups markası için Next.js 14 + MongoDB tabanlı, animasyonlu arka planlı, portfolyo / takım / müşteri yorumları sayfaları ve tek admin hesaplı yönetim paneli olan kapsamlı bir tasarım hizmetleri sitesi.

## Özellikler

- Hareketli (canlı) arka plan: 3 katmanlı SVG dalga + sürekli yükselen mavi baloncuklar
- Renk paleti: `#425369` (birincil) ve `#7c92ae` (ikincil)
- Sayfalar: Ana Sayfa, Portfolyo (kategorili 4 sütunlu grid), Takımımız, Ürün detay
- Admin paneli (`/admin`):
  - Tek admin hesabı (`.env` üzerinden bcrypt hash ile)
  - Portfolyo (kategori + ürün CRUD, dosya yükleme: PNG/JPG/GIF/WEBP/MP4/WEBM)
  - Takım üyeleri (6 farklı renkli rol etiketi: Sahip, Yönetici, Yetkili, Tasarım, Destek, Satış)
  - Müşteri yorumları (yıldız puan + avatar)
  - Referanslar (siyah-beyaz hover'da renkli marquee)
- Dosyalar MongoDB GridFS içinde (ek servis yok), `/api/files/[id]` endpoint'i ile stream edilir

## Teknoloji Yığını

- Next.js 14 (App Router) + TypeScript
- MongoDB + Mongoose ODM (GridFS dosya depolama)
- NextAuth.js (Credentials provider)
- Tailwind CSS + Framer Motion
- bcryptjs, lucide-react, react-hook-form, zod

## Kurulum

```bash
npm install
cp .env.example .env.local
```

`.env.local` dosyasını düzenleyin:

```env
MONGODB_URI=mongodb+srv://USER:PASS@CLUSTER.mongodb.net/source_setups?retryWrites=true&w=majority
NEXTAUTH_SECRET=uzun_rastgele_bir_metin
NEXTAUTH_URL=http://localhost:3000
ADMIN_USERNAME=admin
ADMIN_PASSWORD_HASH=...
```

### Admin Şifresi Üretme

Admin şifrenizin bcrypt hash'ini üretmek için:

```bash
npm run hash-password
```

Çıkan hash'i `ADMIN_PASSWORD_HASH=` satırına kopyalayın.

`NEXTAUTH_SECRET` için güvenli bir değer üretmek:

```bash
node -e "console.log(require('crypto').randomBytes(32).toString('base64'))"
```

### MongoDB Atlas

1. [mongodb.com/cloud/atlas](https://www.mongodb.com/cloud/atlas) üzerinde ücretsiz bir cluster oluşturun.
2. "Database Access" altında bir kullanıcı ekleyin.
3. "Network Access" altında IP adresinizi (veya `0.0.0.0/0` test için) izinli yapın.
4. "Connect" -> "Drivers" -> kopyalanan URI'yi `.env.local`'a yapıştırın, `<password>` yerine kullanıcının şifresini yazın.

### Çalıştırma

```bash
npm run dev
```

Tarayıcıda `http://localhost:3000` açılır. Admin paneli için `http://localhost:3000/admin/login`.

## Production Build

```bash
npm run build
npm run start
```

## Vercel Deploy

1. Reponuzu Vercel'e bağlayın.
2. Environment Variables ekleyin (yukarıdaki tüm `.env.local` değerleri).
3. Deploy.

GridFS Vercel'in serverless function süre/bant limiti içinde çalışır; çok büyük (>50MB) MP4 yüklemeleri için Vercel Pro veya VPS düşünebilirsiniz.

## Klasör Yapısı

```
src/
├── app/                 # Next.js App Router sayfaları
│   ├── api/             # CRUD + auth + dosya stream API'leri
│   ├── admin/           # Yönetim paneli sayfaları
│   ├── portfolio/       # Portfolyo + ürün detay
│   ├── takimimiz/       # Takım sayfası
│   └── page.tsx         # Ana sayfa
├── components/
│   ├── background/      # AnimatedBackground (dalga + baloncuk)
│   ├── home/            # Hero, FeatureBoxes, Reviews, References, TeamPreview
│   ├── layout/          # Navbar, Footer
│   ├── portfolio/       # ProductCard, PortfolioBrowser
│   ├── team/            # TeamMemberCard, RoleBadge, ExpertisePill
│   ├── admin/           # AdminShell, MediaUploader
│   └── providers/       # NextAuth provider
├── lib/                 # mongo, gridfs, auth, slugify, authGuard
└── models/              # Mongoose modelleri
```

## Komut Listesi

| Komut                  | Açıklama                              |
| ---------------------- | ------------------------------------- |
| `npm run dev`          | Geliştirme sunucusu                   |
| `npm run build`        | Production build                      |
| `npm run start`        | Build sonrası sunucu                  |
| `npm run lint`         | ESLint                                |
| `npm run hash-password`| Admin şifresinin bcrypt hash'i üretir |

## Etiket Renkleri (Takım)

| Rol               | Renk                  |
| ----------------- | --------------------- |
| Takım Sahibi      | Kırmızı (`#dc2626`)   |
| Takım Yöneticisi  | Pembe-kırmızı (`#f472b6`) |
| Takım Yetkilisi   | Turuncu (`#f97316`)   |
| Tasarım Birimi    | Mavi (`#3b82f6`)      |
| Destek Birimi     | Beyaz (`#f8fafc`)     |
| Satış Sorumlusu   | Yeşil (`#22c55e`)     |

## Lisans

Özel kullanım için.
