SC-Riber Web Sitesi
Flutter Web ile oluşturulmuş modern ve duyarlı şirket web sitesi. Glassmorphism tasarımı, akıcı animasyonlar, karanlık mod desteği ve OAuth + PassKey ile güvenli kimlik doğrulama sunar.
SC-RIBER WEB SİTESİ
Özet
SC-Riber Web Sitesi, tamamen Flutter Web ile oluşturulmuş modern, duyarlı bir şirket portföy web sitesidir. Proje, kullanıcı deneyimi, görsel çekicilik ve en son güvenlik teknolojilerine odaklanarak ürünlerimizi, projelerimizi ve blog içeriklerimizi sergiler.
Anahtar Kelimeler: Flutter Web, OAuth, PassKey, WebAuthn, Cloudflare, duyarlı tasarım, camlaşma
1. Giriş
SC-Riber Web Sitesi, şirketimizin dijital yüzü olarak hizmet vermekte, proje portföyümüzü, ürünlerimizi ve teknik uzmanlığımızı sunmaktadır. Flutter Web teknolojisi ile inşa edilen site, tüm platformlarda ve cihazlarda tutarlı, yüksek kaliteli bir deneyim sunar.
2. Temel Özellikler
2.1. Duyarlı Tasarım
Masaüstü, tablet ve mobil ekranlara sorunsuzca uyum sağlayan tamamen duyarlı düzen. Optimum görüntüleme için dikkatle hazırlanmış kesme noktaları ile mobil öncelikli yaklaşım kullanır.
2.2. Karanlık ve Aydınlık Temalar
Karanlık ve aydınlık modlar arasında yumuşak geçişlerle tam tema desteği. Manuel geçersiz kılmaya izin verirken sistem tercihlerini otomatik algılama ile saygı gösterir.
2.3. Camlaşma UI
Derinlik ve görsel ilgi yaratan camlaşma elementleri, ince bulanıklık efektleri ve yarı saydam yüzeyler içeren modern estetik.
2.4. Kaydırma Tetiklemeli Animasyonlar
Performanstan ödün vermeden içeriği canlandıran ilgi çekici mikro etkileşimler ve kaydırma tetiklemeli animasyonlar.
2.5. Blog Sistemi
Tam markdown desteği, kategori filtreleme, arama işlevi ve zengin medya yerleştirme ile entegre blog platformu.
2.6. Modern Giriş Sistemi (OAuth + PassKey)
En son kimlik doğrulama sistemi şunları içerir:
- OAuth 2.0 Entegrasyonu: Google, GitHub ve Discord hesapları ile sorunsuz giriş
- PassKey Desteği: WebAuthn/FIDO2 standardı kullanarak şifresiz kimlik doğrulama
- Güvenli Oturum Yönetimi: Otomatik yenileme ile şifrelenmiş oturum tokenları
- Çok Faktörlü Kimlik Doğrulama: Birden fazla doğrulama yöntemi ile gelişmiş güvenlik
2.7. Çoklu Dil Desteği
10'dan fazla dili destekleyen tam uluslararasılaştırma:
- İngilizce, Türkçe, Almanca, İspanyolca, Fransızca, İtalyanca
- Japonca, Rusça, Arapça, Çince
- Tarayıcı ayarlarına göre otomatik bölge algılama
3. Teknik Mimari
3.1. Frontend
- Flutter Web: Tutarlı deneyim için çapraz platform UI framework'ü
- Duyarlı Düzen: Tüm ekran boyutları için uyarlanabilir tasarım kalıpları
- Durum Yönetimi: Provider kalıbı ile verimli durum işleme
3.2. Backend Altyapısı
- Cloudflare Workers: API endpoint'leri için sunucusuz edge computing
- Cloudflare D1: Edge'de SQLite uyumlu veritabanı
- Cloudflare R2: Medya ve statik varlıklar için nesne depolama
- better-auth: OAuth ve PassKey desteği ile modern kimlik doğrulama kütüphanesi
3.3. Kimlik Doğrulama Akışı
- Kullanıcı OAuth sağlayıcısı veya PassKey ile giriş başlatır
- OAuth için: Sağlayıcıya yönlendirilir → yetkilendirme kodu alır → tokenlarla değiştirir
- PassKey için: WebAuthn seremonisi başlatır → authenticator'ı doğrular → oturum oluşturur
- Oturum tokeni otomatik yenileme mekanizması ile güvenli bir şekilde saklanır
4. Güvenlik Özellikleri
- Her Yerde HTTPS: Tüm bağlantılar TLS 1.3 ile şifrelenir
- CSRF Koruması: Siteler arası istek sahteciliğine karşı token tabanlı koruma
- Hız Sınırlama: Brute force ve DDoS saldırılarına karşı koruma
- İçerik Güvenlik Politikası: XSS saldırılarını önlemek için katı CSP başlıkları
- Güvenli Çerez İşleme: HttpOnly, Secure, SameSite çerezler
5. Performans Optimizasyonları
- Edge Dağıtımı: 200'den fazla küresel konumdan içerik sunumu
- Varlık Optimizasyonu: Sıkıştırılmış görseller ve lazy loading
- Kod Bölme: Daha hızlı ilk sayfa yüklemeleri için isteğe bağlı yükleme
- Önbellekleme Stratejisi: Önbellek geçersiz kılma ile akıllı önbellekleme
6. SEO Uygulaması
- Semantik HTML: Uygun başlık yapısı ve semantik elementler
- Meta Etiketler: Dinamik meta açıklamaları ve Open Graph etiketleri
- Site Haritası: Arama motorları için otomatik oluşturulan XML site haritası
- Yapılandırılmış Veri: Zengin arama sonuçları için JSON-LD işaretlemesi
7. Gelecek Yol Haritası
- Yeni blog yazıları için push bildirim desteği
- Gelişmiş analitik paneli
- API hız sınırlama iyileştirmeleri
- Ek OAuth sağlayıcı entegrasyonları