Bogazici Admin Dashboard

Bogazici Denizcilik yonetim paneli. Kurs, duyuru, sayfa, kullanici ve icerik yonetimi icin gelistirilmis kapsamli bir CMS admin uygulamasidir.

Ozellikler

Icerik Yonetimi

• Kurslar - Kurs olusturma, duzenleme, kategori atama, fiyatlandirma, gorsel yukleme
• Kurs Takvimleri - Takvim planlamasi, kontenjan takibi, egitmen atama
• Kategoriler - Kurslari kategorilere ayirma, slug, SEO meta bilgileri
• Duyurular - Blog tarzinda duyurular, zengin metin editoru, one cikan gorseller
• Sayfalar - Blok tabanli sayfa olusturucu ile dinamik CMS sayfalari
• SSS - Sikca sorulan sorular yonetimi
• Basari Hikayeleri - Musteri referanslari ve basari hikayeleri

Site Yonetimi

• Hero Slider - Ana sayfa karousel yonetimi (gorsel ve video destegi)
• Menuler - Hiyerarsik navigasyon menu yonetimi
• Rehber Kartlari - Bilgilendirme kartlari yonetimi
• Ayarlar - Sistem genelinde yapilandirma

Kullanici ve Erisim

• Kullanici Yonetimi - Admin kullanicilari CRUD islemleri, rol atama
• Rol Tabanli Erisim Kontrolu (RBAC) - Modullere gore ayrilmis detayli izin tanimlari
• Lead Yonetimi - Farkli kaynaklardan (form, WhatsApp) gelen leadlerin takibi, UTM parametreleri, KVKK onay takibi
• Yorum Moderasyonu - Yorumlari onaylama/reddetme, admin yaniti

Arayuz

• Acik/karanlik/sistem tema destegi
• Responsive tasarim
• Komut paleti (Cmd/Ctrl+K) ile hizli navigasyon
• Siralama, filtreleme ve sayfalama destekli veri tablolari
• Zengin metin editoru (TipTap)
• Gorsel ve video yukleme
• Erisebilirlik (a11y) destegi
• RTL/LTR dil yonu destegi
• Toast bildirimleri ve ilerleme gostergeleri

Teknoloji Yigini

Katman	Teknoloji
UI Framework	React 19
Build	Vite 7 + SWC
Bilesenler	Shadcn UI (TailwindCSS + Radix UI)
Routing	TanStack Router (dosya tabanli, otomatik code splitting)
Sunucu Durumu	TanStack React Query
Istemci Durumu	Zustand
Formlar	React Hook Form + Zod
Zengin Metin	TipTap
Grafikler	Recharts
Tablolar	TanStack Table
HTTP	Axios (Bearer token interceptor)
Stil	TailwindCSS 4
Ikonlar	Lucide
Dil	TypeScript
Lint/Format	ESLint + Prettier

Proje Yapisi

src/
├── routes/                  # TanStack Router dosya tabanli yonlendirme
│   ├── (auth)/              # Giris sayfalari
│   ├── _authenticated/      # Korunmus rotalar (auth guard)
│   │   ├── dashboard/       # Ana panel
│   │   ├── courses/         # Kurs yonetimi
│   │   ├── categories/      # Kategori yonetimi
│   │   ├── schedules/       # Takvim yonetimi
│   │   ├── announcements/   # Duyuru yonetimi
│   │   ├── pages/           # Sayfa yonetimi (CMS)
│   │   ├── users/           # Kullanici yonetimi
│   │   ├── roles/           # Rol yonetimi
│   │   ├── leads/           # Lead yonetimi
│   │   ├── comments/        # Yorum moderasyonu
│   │   ├── hero-slides/     # Hero slider
│   │   ├── faqs/            # SSS
│   │   ├── menus/           # Menu yonetimi
│   │   ├── guide-cards/     # Rehber kartlari
│   │   ├── stories/         # Basari hikayeleri
│   │   └── settings/        # Ayarlar
│   └── (errors)/            # Hata sayfalari (403, 404, 500)
├── features/                # Ozellik modulleri (her module CRUD islemleri)
├── components/
│   ├── ui/                  # Shadcn UI bilesenler (40+)
│   ├── layout/              # Sidebar, header, ana layout
│   ├── data-table/          # Yeniden kullanilabilir tablo bilesenleri
│   └── block-manager/       # Sayfa blok yonetimi
├── lib/api/                 # API istemcisi ve modul bazli API fonksiyonlari
├── stores/                  # Zustand durum yonetimi
├── context/                 # React context (tema, font, yon, layout)
└── hooks/                   # Ozel React hooklari

Kurulum

Gereksinimler

• Node.js 22+
• pnpm

Yerel Gelistirme

# Projeyi klonla
git clone <repo-url>
cd bogazici-admin

# Ortam degiskenlerini ayarla
cp .env.example .env
# .env dosyasinda VITE_API_BASE_URL degerini duzenle

# Bagimliliklari yukle
pnpm install

# Gelistirme sunucusunu baslat
pnpm dev

Mevcut Betikler

Betik	Aciklama
pnpm dev	Gelistirme sunucusu
pnpm build	TypeScript kontrolu + uretim derlemesi
pnpm preview	Uretim derlemesini onizle
pnpm lint	ESLint ile kod kontrolu
pnpm format	Prettier ile otomatik formatlama
pnpm format:check	Format kontrolu
pnpm knip	Kullanilmayan dosya/bagimlilik tespiti

Ortam Degiskenleri

Degisken	Aciklama
VITE_API_BASE_URL	Backend API adresi (orn: https://bogazici-api.test)

Deployment

Docker

Proje, multi-stage Docker build ile Nginx uzerinde sunulmaktadir.

# Uretim imajini olustur
docker build --build-arg VITE_API_BASE_URL=https://api.bogazicidenizcilik.com -t bogazici-admin .

# Calistir
docker compose -f docker-compose.prod.yml up -d

CI/CD (DroneCI)

Dal	Islem
develop	TypeScript kontrolu + build dogrulamasi
test	Test sunucusuna otomatik deploy
main	Uretim sunucusuna otomatik deploy

Kimlik Dogrulama

• Email/sifre ile giris (/sign-in)
• JWT Bearer token tabanli kimlik dogrulama
• Token ve kullanici bilgisi Zustand store + cookie’lerde saklanir
• 401 yaniti alindiginda otomatik oturum sonlandirma
• Tum /_authenticated rotalari gecerli token gerektirir

Lisans

MIT