Birebir mentorluk
Müfredatı senin seviyene ve hedefine göre sıralıyor, kodunu inceliyor ve takıldığın yerde yön gösteriyoruz.
- Genelde 8-16 hafta
- Haftalık görevler
- Kod incelemesi
Sayfa yükleniyor.
Hiç kod yazmamış olsan bile başlayabileceğin, kendi hızında ilerlediğin bir program: HTML/CSS temellerinden nesne yönelimli JavaScript'e, TypeScript'e ve React ekosistemine, üç projeyle.
Kod yazmaya başlamadan önce gereken düzeni kurmak: VS Code kurulumu ve Türkçe klavye ile özel karakterler, zorunlu eklentiler, klavye kısayolları, terminal temelleri ve Node.js kurulumu.
Tarayıcıya bir adres yazdığında perde arkasında ne olduğunu ve bir web sayfasının iskeletini oluşturan HTML'in temel yapı taşlarını öğrenmek.
HTML'e görünüm kazandıran CSS'in temel kurallarını (seçiciler, kutu modeli, renkler, birimler, specificity) DevTools ile teşhis ederek öğrenmek; ardından her ödevin kalıcı bir geçmişe kaydedilmesini sağlayan Git ve GitHub temellerini kavramak.
Modern arayüzlerin büyük çoğunluğunu dizen Flexbox modelini öğrenmek: container ve item özellikleriyle elemanları hizalamak, boşluk vermek ve navbar/kart ızgarası/sticky footer gibi klasik layout desenlerini kurmak.
İki boyutlu düzenler için CSS Grid'i, elementleri normal akıştan çıkarıp konumlandıran position özelliğini ve tek bir kod tabanının hem telefonda hem masaüstünde doğru görünmesini sağlayan responsive tasarım tekniklerini öğrenmek.
Utility-first CSS yaklaşımını öğrenmek: hazır sınıflarla hızlı arayüz kurmak, Tailwind v4'ü kurmak ve yapılandırmak, spacing/renk/responsive/durum varyantlarıyla günlük çalışmak, ve tekrar eden class listelerine gerçekçi bir bakış açısı geliştirmek.
HTML formlarını doğru şekilde kurmayı, klavye ve ekran okuyucu kullanıcıları için erişilebilir arayüzler tasarlamayı, ikonları inline SVG ile yönetmeyi, gelişmiş seçicilerle stil yazmayı ve performanslı görsel efektler eklemeyi öğrenmek.
İlk canlı deploy'unu yapmak, GitHub üzerinde takım halinde çalışma akışını (branch, pull request, code review) öğrenmek ve şimdiye kadar öğrenilen HTML/CSS/Flexbox/Grid/Tailwind/erişilebilirlik bilgisini tam responsive, çok sayfalı bir statik siteye dönüştürmek.
JavaScript nedir, tarayıcıda ve Node'da nasıl çalışır; let/const ile değişken tanımlama, ilkel ve referans türler arasındaki fark, tür dönüşümleri ve operatörler — dilin gerçek temeli, DOM'dan önce.
if/else, switch ve guard clause ile karar verme; for/while/do-while ve for...of/for...in ile döngüler; function declaration, expression, arrow function ve saf fonksiyonlar ile kod tekrar kullanımı; klasik problem çözme alıştırmalarıyla (FizzBuzz, palindrom, faktöriyel) pekiştirme; AI asistanını eleştirel ve doğrulayarak kullanma alışkanlığı.
Bir değişkenin nerede "görünür" olduğunu, bir fonksiyonun neden bir değer sayıldığını ve bir fonksiyonun doğduğu ortamı nasıl yanında taşıdığını (closure) öğrendiğin modül — map/filter/reduce'ı elle yazmaktan sayaç örneğine, klasik döngü tuzağına kadar.
Objelerde derinlemesine erişim, dizi metotlarının mutasyon ayrımı, arama/dönüştürme metotları, destructuring, JSON ve JavaScript'in yerleşik objeleri — React'te state'i güvenle yönetmenin temeli.
HTML'in tarayıcıda dönüştüğü canlı ağaç yapısı olan DOM'u okuma ve değiştirme, olaylarla (event) kullanıcı etkileşimine tepki verme — bubbling/delegation/preventDefault — ve localStorage/IntersectionObserver gibi tarayıcı API'leri; fonksiyonları bilen bir öğrencinin artık gerçek, etkileşimli bir sayfa yazabilmesi için gereken köprü.
İlişkili veri ve davranışı bir arada tutma ihtiyacından yola çıkarak nesne yönelimli düşünmeye giriş: metotları olan objeler, prototipin var olma nedeni (bellek paylaşımı), this'in dört bağlanma kuralı ve klasik this kaybı hataları, ve her objenin arkasındaki [[Prototype]] zincirinin nasıl çalıştığı.
class sözdizimi ve onun prototip üzerine şeker olduğu gerçeği, extends/super() ile kalıtım, dört OOP ilkesi somut örneklerle, kalıtım yerine kompozisyon tercih etme sezgisi ve modül deseni/özel Error sınıfları/iterable protokolü gibi pratik desenler.
JavaScript'in tek iş parçacıklı çalışma modelinden call stack, Web API'ler ve event loop'a; callback'lerin dağılan hata yönetiminden Promise'in "değer sözü" fikrine; async/await ile okunabilir asenkron koddan Promise.all/allSettled/race/any ile sıralı-paralel kararına — "bu neden bu sırada çalıştı?" sorusuna artık cevap verebileceğin bir modül.
HTTP metotları, durum kodları ve header'lardan REST kavramına; fetch ile gerçek bir sunucuyla konuşmaktan 404'ün sessizce geçmediğini öğrenmeye; yükleniyor/hata/boş/dolu dört durumunu yöneten dayanıklı bir veri katmanı kurmaya — tarayıcıdan ağa çıkan her JS uygulamasının temeli.
ES Modules ile kodu dosyalara bölmek, npm ile üçüncü parti paket yönetimi (semantic versioning, güvenlik) ve Vite ile modern bir geliştirme/derleme akışı kurmak — tarayıcının çalıştıramadığı kodu proje hâline getiren araç zinciri.
Şimdiye kadar öğrendiğin ES modülleri, async/await, class'lar ve DOM güvenliğini tek bir gerçek projede birleştirdiğin kapanış modülü: bir arkadaşının kodunu inceleyip yapıcı bir code review yazıyor, ardından framework kullanmadan halka açık bir API'yi tüketen tam bir tek sayfa uygulama kuruyorsun.
JavaScript'in üzerine statik bir tür sistemi ekleyen TypeScript'i öğreniyorsun: tür çıkarımı, union/generic türler, class'larda tür kullanımı, utility türler ve Zod ile çalışma zamanı doğrulaması. React'ten önce konumlandırıldı çünkü `useState<User[]>` gibi bir satırı anlamak önce generic kavramını gerektiriyor.
DOM'u elle yönetmenin acısından bildirimsel (declarative) komponent zihniyetine geçiyorsun: JSX'in gerçekte ne olduğunu, props ve state'i, olay yönetimini ve TypeScript ile Tailwind'i React'te nasıl kullanacağını öğren.
useEffect'in gerçekten ne için var olduğunu ve ne zaman gereksiz olduğunu öğren, elle veri çekmenin sınırlarını görüp TanStack Query'yle sunucu state'ini doğru yönetmeyi keşfet, useRef/useMemo/useCallback gibi diğer hook'ları ölçmeden optimize etmeden kullan, React 19'un getirdiği use(), Form Actions, useActionState ve useOptimistic API'leriyle tanış ve Error Boundary ile render hatalarının tüm uygulamayı beyaz ekrana düşürmesini engelle.
Kendi hook'unu yazarak mantığı UI'dan ayırmayı, Context ile prop drilling'i çözmeyi ama performans tuzağına düşmemeyi, Zustand ile 'her şeyi global yapmadan' paylaşılan state kurmayı ve React Hook Form + Zod ile büyük formları hem hızlı hem de doğrulanmış hâlde yönetmeyi öğren.
Tek sayfalık uygulamalarda sayfa geçişlerini yönetmeyi, kullanıcı oturumunu güvenli biçimde taşımayı, render stratejilerinin farkını, bileşenleri gerçekçi biçimde test etmeyi ve bir React uygulamasını üretime almayı öğren.
Programın tamamında öğrendiklerini tek bir uçtan uca uygulamada birleştirdiğin, portfolyonun merkezine koyacağın kapanış projesi.
Müfredatı senin seviyene ve hedefine göre sıralıyor, kodunu inceliyor ve takıldığın yerde yön gösteriyoruz.
Modülleri kendi hızında açarsın: bir modülün quiz'ini geçince sıradaki açılır.
Seviye testi iki dakika sürüyor. Sonucuna göre bu müfredatta hangi modülden başlaman gerektiğini görürsün.