Kişisel Portfolyo Platformu
Next.js frontend, API backend, admin kontrollü içerik yönetimi, proje galerileri, dosya yüklemeli notlar, iletişim akışı ve self-hosted production dağıtımını birleştiren kişisel portfolyo platformunu geliştirdim ve canlıda yönetiyorum.
Teknoloji
Next.js + API
Frontend ve backend platformu
İçerik
Dinamik
Projeler, notlar, özgeçmiş, yüklemeler
Dağıtım
Self-hosted
HTTPS production ortamı
Durum
Gelişiyor
Özellikler hâlâ ekleniyor
Proje Galerisi
1/4
Problem
Statik bir portfolyo; her yeni proje, not, görsel veya özgeçmiş güncellemesi için kod değişikliği gerektirirdi ve içerik yönetimi ile dağıtım tarafındaki mühendisliği görünür kılmazdı.
Zorluk
Temel zorluk, kişisel web sitesini sürdürülebilir bir ürüne dönüştürmekti: güvenli admin erişimi, kalıcı yüklemeler, dinamik içerik, zengin not render'ı, responsive galeriler, cache ve production hardening aynı sistemde hafif kalmalıydı.
Mimari
Parçalar nasıl bir araya geliyor?
Frontend Next.js App Router ve ISR cache kullanır. Tipli API katmanı projeleri, notları, yüklemeleri, özgeçmiş içeriğini ve iletişim mesajlarını yönetir; production ortamı ise public ve admin iş akışlarını ayıran HTTPS edge katmanı arkasında çalışı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
- Portfolyo içeriği, yüklenen proje medyaları, teknik notlar, özgeçmiş verisi, iletişim mesajları ve production dağıtım konfigürasyonu.
Teknik Kararlar
- İçerik kod değişikliği olmadan yönetilebilsin diye statik-only portfolyo yerine full-stack mimari kullandım.
- Public içeriği ISR ile cache'ledim, kimlik doğrulamalı admin akışlarını ise no-store davranışında tuttum.
- Yüklenen medyaları kalıcı şekilde sakladım ve dosyalara kontrollü API path'leriyle eriştirdim.
- Uygulamayı HTTPS edge katmanı arkasına aldım ve admin iş akışlarını public içerikten ayırdım.
Uygulama Detayları
- Next.js public portfolyo, lokalize rotalar, proje sayfaları, notlar ve özgeçmiş görünümlerini render eder.
- Express ve Prisma; projeler, notlar, yüklemeler, profil verisi, iletişim mesajları ve admin işlemleri için REST endpoint'leri sunar.
- Admin paneli proje galerilerini, kapak görsellerini, görsel kırpmayı, PDF/HTML not dosyalarını ve Markdown içeriği destekler.
- Production ortamı public HTTPS giriş noktası arkasında ayrılmış uygulama servisleriyle çalışır.
Metrikler / Sonuçlar
- Site dinamik projeleri, galeri yüklemelerini, görsel kırpmayı, PDF/HTML not eklerini, Markdown ve KaTeX render'ını, iletişim mesajlarını, güçlendirilmiş admin akışlarını ve self-hosted dağıtımı destekliyor; özellikler hâlâ aktif olarak geliştiriliyor.
Çıkarımlar
- Bir portfolyo, içerik operasyonları manuel kod düzenleme olmaktan çıktığında çok daha kullanışlı hale gelir.
- Cache algılanan hızı ciddi artırır; ama admin rotaları ve public rotalar farklı tazelik kurallarına ihtiyaç duyar.
- Upload yönetimi kalıcılık, validasyon, önizleme ve uzun vadeli deploy davranışıyla birlikte düşünülmelidir.
Gelecek İyileştirmeler
- Yüklemeleri daha kolay yedekleme ve CDN dağıtımı için object storage'a taşımak.
- Projeler ve teknik notlar arasında arama/filtreleme eklemek.
- Özel domain bağlandıktan sonra daha zengin analytics ve uptime monitoring eklemek.
- Yeni portfolyo ihtiyaçları çıktıkça admin akışını genişletmeye devam etmek.