VCAMP Website ve İçerik Platformu
4-5 kişilik ekipte VCAMP web sitesi ve içerik platformunun frontend ve backend geliştirmelerine katkı verdim. Sistem; takım projelerini, üyeleri, sponsorları, blog içeriklerini, kurum bilgilerini ve sertifika doğrulama akışlarını Django REST API ile beslenen React frontend üzerinden sunar.
Ekip
0-5
Ortak geliştirme ekibi
Rol
Full-stack
Frontend ve backend katkısı
Modül
0
Projeler, ekip, blog, sponsorlar, info, kurslar, sertifikalar, admin
API
REST
Frontend tarafından tüketilen yapılandırılmış içerik
Proje Galerisi
1/6
Problem
Takımın proje, ekip, sponsor, blog ve sertifika içeriklerini statik sayfalara gömmek yerine admin arayüzünden yönetebileceği sürdürülebilir bir web sitesine ihtiyacı vardı.
Zorluk
Temel zorluk; zengin public frontend deneyimini yapılandırılmış backend içerik modellerine bağlamak ve proje detay sayfaları, medya, dokümanlar, ekip ilişkileri, blog içerikleri, sponsorlar ve sertifika doğrulama akışını tutarlı bir kullanıcı deneyiminde birleştirmekti.
Mimari
Parçalar nasıl bir araya geliyor?
Frontend; ana sayfa, projeler, ekip, blog, iletişim, sponsorluk, arama ve sertifika doğrulama için rotalara sahip Vite ve React tabanlı bir single-page application olarak çalışır. Backend; Django, Django REST Framework, ilişkisel içerik modelleri, Django admin, zengin metin blog düzenleme, medya/doküman yüklemeleri ve frontend tarafından tüketilen read-only public API endpoint'leri kullanır.
Mimari Görünüm
Sistem yapısı ve karar akışı
Next.js Frontend
Public portfolyo, notlar, projeler, özgeçmiş ve yerelleştirilmiş rotalar.
Express API
İçerik, yüklemeler, iletişim mesajları ve admin işlemleri için REST endpoint'leri.
Admin CMS
Proje galerileri, not dosyaları, görsel kırpma ve dinamik güncellemeler.
HTTPS Edge
Public giriş noktası ve ayrılmış production servisleri.
Veri Seti / Girdiler
- Web sitesi backend'i üzerinden yönetilen kurum profili, ekip üyeleri, sponsorlar, proje sayfaları, proje medyaları, teknik dokümanlar, blog yazıları, kurslar ve sertifika kayıtları.
Teknik Kararlar
- Developer olmayan güncellemeler için Django admin'i içerik yönetim yüzeyi olarak kullandık.
- Public web sitesi içerikleri için read-only REST API endpoint'leri sunduk.
- Proje detay sayfalarını tek büyük statik sayfa yerine ilişkili ve yapılandırılmış veri olarak modelledik.
- Sertifika doğrulama akışını kod bazlı arama ve badge-style JSON cevapları olan ayrı bir workflow olarak ele aldık.
Uygulama Detayları
- React ve Vite; ana sayfa, projeler, ekip, blog, sponsorluk, arama ve sertifika sayfaları için rotalı public frontend'i yönetir.
- Django REST Framework; teknik özellikler, zaman çizelgesi, medya, dokümanlar, testler, ekip ve sponsor ilişkilerini içeren nested proje verisini serialize eder.
- Frontend, ham API payload'larını proje özetleri, detay sayfaları, blog içerikleri ve sertifika doğrulama ekranları için stable view model'lara dönüştürür.
- Backend admin kontrollü zengin metin içeriklerini, medya yüklemelerini, doküman eklerini ve kurum bilgisi kayıtlarını içerir.
Metrikler / Sonuçlar
- Platform; admin kontrollü içerik yönetimini, teknik özellikler/zaman çizelgesi/galeri/doküman/test/ekip/sponsor ilişkileri olan proje detay sayfalarını, blog render'ını, kurum bilgilerini ve badge-style JSON cevaplarıyla sertifika doğrulamayı destekler. Proje 4-5 kişilik ekip tarafından frontend ve backend katkılarıyla geliştirildi.
Çıkarımlar
- Takım web siteleri, proje ve üye verisi açık şekilde modellendiğinde daha sürdürülebilir olur.
- Frontend deneyimi, backend API cevaplarını kararlı view model'lara dönüştürmeye çok bağlıdır.
- Ekip projelerinde bireysel katkıyı net anlatmak, projeyi tek başına sahiplenmiş gibi göstermeden değer üretir.
Gelecek İyileştirmeler
- Public config ve secret yönetimini tamamen environment-managed hale getirmek.
- Kaynak kod paylaşılmadan önce production odaklı güvenlik hardening yapmak.
- API serializer'ları ve sertifika doğrulama akışları için otomatik test kapsamını genişletmek.