Cyou Live, geleneksel online eğitimin dağınık yapısını ortadan kaldıran, öğrenenleri ve eğitmenleri sınırların olmadığı dijital bir ekosistemde buluşturan yeni nesil bir EdTech (Eğitim Teknolojileri) girişimidir. TÜBİTAK 1512 BİGG programı desteğiyle geliştirilen bu platform, yapay zeka tabanlı "akıllı eşleştirme" algoritmalarını kullanarak, kullanıcıları ilgi alanlarına göre Sosyal Canlı Sınıflar'da bir araya getirir. Platform, kullanıcıların tek bir profil ile hem "öğrenen" hem de "öğreten" olabildiği hibrit bir pazar yeri (Marketplace) modeli sunar.
Frontend Geliştirici Olarak Rolüm ve Teknik Çözümler
Bu projede, yüksek trafikli ve etkileşim odaklı bir web uygulamasının Frontend mimarisini, performans ve SEO kriterlerini merkeze alarak Next.js ekosistemi üzerinde inşa ettim.
Next.js ile Hibrit Rendering Stratejisi (SSR / SSG / ISR): SEO görünürlüğünü artırmak ve ilk yükleme süresini (First Contentful Paint) minimize etmek için sayfa bazlı rendering stratejileri geliştirdim.
Dinamik sınıf detay sayfaları ve kullanıcı profilleri için Server-Side Rendering (SSR),
Statik blog ve pazarlama sayfaları için Static Site Generation (SSG),
Sürekli güncellenen içerikler için Incremental Static Regeneration (ISR) kullanarak veritabanı yükünü azalttım ve performansı optimize ettim.
Cypress ile Uçtan Uca (E2E) Test Otomasyonu: Uygulamanın kararlılığını sağlamak ve canlıya çıkış (deployment) süreçlerindeki hataları sıfıra indirmek için Cypress kullanarak kapsamlı test senaryoları yazdım. Kritik kullanıcı akışlarını (giriş yapma, sınıf oluşturma, ödeme süreci) otomatize ederek kod kalitesini garanti altına aldım.
Gelişmiş State Yönetimi ve Performans: Canlı sınıflardaki anlık etkileşimleri ve kompleks veri akışlarını yönetmek için Context API ve React Hooks yapısını efektif bir şekilde kurguladım. Gereksiz "re-render" işlemlerini engelleyerek uygulamanın bellek kullanımını optimize ettim.
Modern UI/UX ve Responsive Tasarım: Tailwind CSS kullanarak, Figma tasarımlarını piksel hassasiyetinde (pixel-perfect), mobil öncelikli (mobile-first) ve tüm tarayıcılarla uyumlu interaktif arayüz bileşenlerine dönüştürdüm.
Kullanılan Teknolojiler: React.js, Next.js (App Router), Cypress (Testing), Context API, Tailwind CSS, SSR/ISR, Axios, Git/GitHub.
