✨ Proje Özeti ve Temel Teknolojiler
Bu platform, Firebase'in sunduğu **Sunucusuz (Serverless)** mimariyi temel alarak, kullanıcı yönetimi, gerçek zamanlı veri akışı ve gelişmiş performans optimizasyonlarını bir araya getirmektedir. **Materialize CSS** ile modern ve kullanıcı dostu bir arayüz sunulmuştur.
Kullanılan Teknolojiler:
- Firebase Authentication
- Firestore Real-Time Database
- Vanilla JavaScript (Modüler)
- Materialize CSS
Dinamik Ekran Görüntüleri
Platformun kritik arayüzleri, gerçek zamanlı güncellemeleri ve kullanıcı yönetim ekranları aşağıdaki galeri yapısında incelenebilir. Geçişler **ileri/geri ok tuşları** ile yapılır.
Ana Sayfa ve Gerçek Zamanlı Makale Listesi
Sıralı ID'lerle listelenen ve açıldığında görüntülenme sayacı tetiklenen ana akış.
Yeni Makale Oluşturma Modalı
Kullanıcının makale başlığı ve içeriği girerek atomik ID ile kayıt yaptığı ekran.
Makalelerim: Düzenleme ve Silme İşlemleri
OnSnapshot ile gerçek zamanlı güncellenen, kullanıcının sadece kendi makalelerini gördüğü yönetim paneli.
Güvenli Şifre Yenileme
Reauthentication zorunluluğu ile hesap güvenliğinin sağlandığı arayüz.
Yeni Hesap Oluşturma (Sign Up)
Regex ile ön-validasyon yapılan ve atomik kullanıcı ID'si atanan kayıt formu.
Kullanıcı Detayları ve Oturum Bilgileri
Giriş yapmış kullanıcının cache'lenmiş profil bilgilerini ve oturum verilerini gösteren modal.
1. Veri Bütünlüğü ve Güvenli Atomik İşlemler
Projenin en kritik teknik yönü, veritabanı işlemlerinde veri tutarlılığını ve güvenliğini sağlamaktır.
Firestore Transaction ile Sıralı ID Garantisi
Rastgele UID yerine, eş zamanlı kayıt durumlarında dahi çakışmayı önleyen, **Firestore Transactions** kullanılarak atomik olarak garanti altına alınan sıralı ve artan ID'ler üretilmiştir. Bu, veritabanı işlemlerinde ileri düzey kontrolü gösterir.
Atomik Görüntüleme Sayacı Yönetimi
Makale görüntülenme sayacı, veri yarışlarını (race conditions) önlemek ve doğru sayım yapmak amacıyla atomik olarak güncellenir. Bu, NoSQL veritabanlarında güvenli sayaç yönetimine hakimiyetimi gösterir.
2. Performans Optimizasyonu ve Kaynak Verimliliği
Uygulamanın hızını artırmayı, Firebase okuma/yazma maliyetlerini düşürmeye odaklanılmıştır.
Kullanıcı Profili Caching (Önbellekleme)
Tekrarlanan Firestore okumalarını önlemek amacıyla, yazar adları ve ID'leri **JavaScript Map** yapısı kullanılarak önbelleğe alınmıştır. Bu, özellikle büyük listelerde sayfa yüklenme süresini ciddi ölçüde azaltır.
Local Storage ile Akıllı Sayaç Kontrolü
Gereksiz veritabanı yazma işlemlerini ve sayacı manipülasyonunu önlemek için, kullanıcının görme geçmişini yöneten bir **`ViewManager` Sınıfı** Local Storage'ı aktif olarak kullanır.
3. İstemci Tarafı Güvenlik ve Robust Hata Yönetimi
Kullanıcı güvenliğini ve kaliteli hata geri bildirimini merkeze alan çözümler üretilmiştir.
Regex ile Güvenli Ön-Validasyon
Şifre gücü (min. 6 karakter) ve email formatı gibi kritik kontroller, sunucuya gönderilmeden önce **Regular Expressions (Regex)** ile istemci tarafında zorunlu tutulmuştur. Bu, API çağrılarını azaltır ve ilk seviye veri temizliğini sağlar.
Merkezi ve Anlamlı Hata Geri Bildirimi
Tüm Firebase hata kodları yakalanır ve tek bir fonksiyon üzerinden, kullanıcıya özel ve anlaşılır mesajlarla sunulur. Bu, tutarlı ve profesyonel bir kullanıcı deneyimi sağlar.
Şifre Değiştirme için Yeniden Kimlik Doğrulama
Hesap güvenliğini artırmak için, şifre değiştirme işleminden önce kullanıcının mevcut şifresiyle yeniden kimlik doğrulaması zorunlu kılınmıştır.
4. Dinamik Kullanıcı Deneyimi (UX) ve Arayüz Detayları
Projenin kullanımını keyifli hale getiren, ince düşünülmüş arayüz etkileşimleridir.
Dinamik Onay ve Gelişmiş DOM Yönetimi
Silme işlemleri için onay modalında, onay butonunun olay dinleyicisi **`cloneNode(true)`** ve **`replaceChild`** gibi Vanilla JS teknikleri kullanılarak dinamik olarak yenilenmiştir. Bu, temiz ve güvenli bir olay delegasyonu becerisidir.
Görsel Geri Bildirim ve CSS Geçişleri
Görüntülenme sayısı güncellendiğinde, sayaç etiketinin arkaplanı anlık olarak renk değiştirir (CSS Transition). Bu küçük görsel ipucu, işlemin başarılı olduğunu kullanıcıya anında bildirir.
Collapsible Açılışında Sayaç Tetikleme
Makale görüntülenme sayacı, sayfa yükleniminde değil, sadece **Materialize Collapsible** elemanı **açılmaya başladığında** tetiklenir, böylece sayımın doğru anı yakalanır.
5. Real-Time Mimarisi ve Oturum Yönetimi
Firebase'in gerçek zamanlı yeteneklerinin ve modern modüler JavaScript mimarisinin kullanımı.
Gerçek Zamanlı Arayüz Senkronizasyonu
Kullanıcının kendi makalelerini listelediği "Makalelerim" modalı, bir veri değişikliği olduğunda (silme/güncelleme) sayfayı yenilemeye gerek kalmadan anlık olarak güncellenir.
Oturum Durumuna Bağlı Dinamik Navigasyon
Navigasyon menüsü, kullanıcının giriş/çıkış durumuna göre anlık olarak değişir ve yalnızca yetkili menü öğelerini gösterir.