Bu projede ürün listesinden ödeme sonucuna uzanan bir alışveriş akışı geliştirdim. Katalog, kategori filtreleri ve sepet arayüzü Next.js tarafında; ürün yönetimi, stok kontrolü ve ödeme işlemleri .NET 8 API üzerinde çalışıyor. Frontend ve backend aynı depoda bulunuyor.
Proje eğitim ve portfolyo amaçlı bir demo. Ödeme entegrasyonu iyzico'nun sandbox ortamını kullanıyor.
Ürün ve kategori yönetimi
Kullanıcı ürün adına göre arama yapabiliyor, kategori seçip sonuçları daraltabiliyor. Listeler sayfalı; sepette ürün miktarı değiştirilebiliyor. Arayüzde mobil kullanım ve koyu tema desteği de var.
Kategori silme işleminde ürünlerin ne olacağını ayrıca ele aldım. Boş kategori doğrudan silinebiliyor. Ürünü olan bir kategoride ise normal silme isteği reddediliyor; zorunlu silme seçilirse ürünler “Kategorisiz” bölümüne taşınıp pasif hâle getiriliyor. Böylece kategori kaldırılırken ürün kayıtları korunuyor.
Ödeme nasıl ilerliyor?
Kullanıcı ödeme adımına geldiğinde sunucu iyzico'ya başlatma isteği gönderiyor. Dönen Pay with iyzico adresi tarayıcıda açılıyor; kart bilgileri uygulamada tutulmuyor. Kullanıcı geri döndüğünde backend ödeme durumunu kontrol ederek siparişi güncelliyor.
Bu bölümde kart verisini işlememek ile sipariş durumunu takip etmek ayrı sorumluluklar. Uygulama, ödeme sağlayıcısının sonucunu kendi sipariş kaydıyla ilişkilendiriyor.
Kodu nasıl düzenledim?
Backend'de API, iş kuralları, veri erişimi ve ortak modeller ayrı katmanlarda. MySQL işlemleri Entity Framework Core üzerinden yürütülüyor. Girişte JWT, yönetici işlemlerinde rol kontrolü, gelen verilerde FluentValidation kullanılıyor.
Arayüzde TypeScript, Tailwind CSS ve Radix UI yer alıyor. React Query sunucu verisini, Context API sepet ve kullanıcı durumunu yönetiyor. Formlarda React Hook Form ve Zod kullanıyorum.
API yanıtları ortak bir yapıya sahip; listeleme uçları sayfalama bilgisi döndürüyor. Swagger dokümantasyonu, Serilog kayıtları ve xUnit testleri de sunucu tarafının parçaları.