Angular Geliştirici (Enterprise Web Apps) Nasıl Çalışılır? Adım Adım Yol Haritası

Aşama 1: TypeScript Temelleri (DNA)

Static Typing, Interfaces, Decorators

01

TypeScript Nedir ve Neden Gerekli?

JS'in üzerine gelen tip güvenliği.

02

Statik Tipleme (Static Typing) ve Tip Çıkarımı (Type Inference)

Değişkenlere tip atama kuralları.

03

Arayüzler (Interfaces)

Veri modellerini tanımlama.

04

Sınıflar (Classes) ve Erişim Belirleyiciler (Access Modifiers)

public, private, protected farkları.

05

Generics (Genel Tipler)

Esnek ve tip güvenli fonksiyonlar.

06

Enums (Numaralandırmalar)

Sabit değerler kümesi.

07

Dekoratörler (Decorators)

Sınıflara ve metotlara özellik katma.

08

Birleşim ve Kesişim Tipleri (Union & Intersection Types)

Birden fazla tipi birleştirme.

09

Tuples (Demetler)

Sabit uzunluklu ve tipli diziler.

10

Null ve Undefined Kontrolü

Strict null checks ayarı.

11

Optional Chaining (?. Operatoru)

Derin objelere güvenli erişim.

Aşama 2: Angular Mimarisi ve CLI

Standalone, Modules, Lifecycle

01

Angular CLI: Komut Satırı Gücü

Proje oluşturma ve yönetme.

02

Module Mimarisi (NgModule)

Eski tarzdaki toplu yönetim.

03

Standalone Components (Yeni Standart)

Modüllere ihtiyaç duymayan bileşenler.

04

Uygulama Başlatma (App Bootstrapping)

Uygulamanın ilk ateşlenmesi.

05

Çalışma Alanı (Workspace) Yapısı

angular.json ve projeler.

06

Angular Derleyicisi (Compiler: JIT vs AOT)

Kodun tarayıcıya çevrilmesi.

07

Dependency Injection Hazırlık

Servislerin nasıl tanındığı.

08

Varlıklar (Assets) ve Global Stiller

Resimler ve CSS yönetimi.

09

Ortamlar (Environments)

Prod, Test ve Dev ayarları.

10

Polyfills ve Tarayıcı Desteği

Eski tarayıcılarla uyum.

11

Angular Versiyon Yönetimi

ng update kullanımı.

Aşama 3: Componentler ve Veri Bağlama

Data Binding, ViewChild, Lifecycles

01

Interpolation ({{ }})

TS verisini HTML'e basma.

02

Property Binding ([ ])

HTML element özelliklerini bağlama.

03

Event Binding (( ))

Kullanıcı etkileşimlerini yakalama.

04

Two-Way Data Binding ([( )])

Çift yönlü senkronizasyon.

05

Bileşen Yaşam Döngüsü (Lifecycle): ngOnInit

Bileşen doğduğunda yapılacaklar.

06

Bileşen Yaşam Döngüsü (Lifecycle): ngOnChanges

Input verileri değiştiğinde tetiklenme.

07

Bileşen Yaşam Döngüsü (Lifecycle): ngOnDestroy

Bileşen öldüğünde temizlik.

08

@Input() ve @Output() Decorators

Bileşenler arası iletişim.

09

@ViewChild() ve @ViewChildren()

HTML elementine veya diğer bileşenlere erişim.

10

İçerik Yansıtma (Content Projection)

Bileşen içine HTML parçası gömme.

11

Bileşen Stilleri ve Kapsülleme (Encapsulation)

Emulated vs ShadowDom.

Aşama 4: Directive'ler ve Pipe'lar

Structural, Attribute, Custom Pipes

01

Yapısal Direktifler (Structural Directives)

HTML yapısını değiştiren direktifler.

02

Öznitelik Direktifleri (Attribute Directives)

Görünümü ve stilleri değiştirme.

03

Özel (Custom) Öznitelik Direktifi Yaratma

Kendi davranışımızı yazma.

04

HostListener ve HostBinding

Direktiflerin olayları dinlemesi.

05

Yerleşik Borular (Built-in Pipes)

Veriyi ekrana basmadan önce dönüştürme.

06

Özel Boru (Custom Pipe) Yazımı

Kendi dönüştürücümüzü yaratma.

07

Saf (Pure) vs Saf Olmayan (Impure) Borular

Performans ayarları.

08

Async Pipe (Çok Önemli)

Observable verileri otomatik subscribe etme.

09

Zincirleme Borular (Chaining Pipes)

Birden fazla pipe'ı arka arkaya kullanma.

10

Uluslararasılaştırma (i18n) ve Veri Biçimlendirme

Ülkelere göre formatlama.

11

Safe Navigation Operator (?.) ve Pipes

Hataları borularda önlemek.

Aşama 5: Form Yönetimi (Reactive & Template)

Validation, FormGroups, Custom Validators

01

Şablon Odaklı Formlar (Template-Driven Forms)

HTML odaklı form yönetimi.

02

Reaktif Formlar (Reactive Forms) Temelleri

Kod odaklı (Programmatic) form yönetimi.

03

FormBuilder Servisi

Form gruplarını kolayca oluşturma.

04

Form Doğrulayıcılar (Form Validators)

Giriş verilerini doğrulama.

05

Özel Doğrulayıcı (Custom Validators) Yazımı

Kendi doğrulama mantığımızı ekleme.

06

Asenkron Doğrulayıcılar (Async Validators)

API sorgusu ile doğrulama.

07

FormArray: Dinamik Formlar

Değişken sayıda form elemanı yönetimi.

08

ValueChanges ve StatusChanges

Formdaki her hareketi izleme.

09

patchValue vs setValue

Form verilerini güncelleme farkları.

10

İç İçe Geçmiş Form Grupları (Nested FormGroups)

İç içe geçmiş form yapıları.

11

Form Reset ve Prinstine State

Formu temizleme ve durum yönetimi.

Aşama 6: Dependency Injection ve Servisler

Providers, Injectors, Singleton Services

01

Bağımlılık Enjeksiyonu (Dependency Injection) Nedir?

Bağımlılıkların dışarıdan enjekte edilmesi.

02

Servis Yaratma (@Injectable)

Paylaşılan mantık ve veri merkezi.

03

Hiyerarşik Enjektörler (Hierarchical Injectors)

Hiyerarşik enjektör yapısı.

04

Tekil Servisler (Singleton Services)

Uygulama genelinde tek bir nesne.

05

Enjeksiyon Jetonları (Injection Tokens)

String veya nesne tabanlı anahtarlar.

06

The useClass, useValue, useFactory

Provider tanımlama stratejileri.

07

@Optional() ve @Self() Decorators

DI arama davranışını değiştirme.

08

@Host() ve @SkipSelf()

Enjektör ağacında arama yönü.

09

ProvidedIn: 'platform' vs 'any'

Gelişmiş servis ömürleri.

10

Inject() Fonksiyonu (Yeni)

Constructor dışı bağımlılık alma.

11

Servis Yaşam Döngüsü (Service Life-cycle)

Servislerin ne zaman öldüğü.

Aşama 7: Routing ve Navigasyon Mimarisi

Lazy Loading, Guards, Resolvers

01

App Routing Modülü Planlama

Sayfa yollarının tanımlanması.

02

RouterLink ve RouterOutlet

Sayfalar arası geçiş ve görüntüleme.

03

Dinamik Rotalar (Dynamic Routes ve Params)

ID bazlı sayfalar.

04

Tembel Yükleme (Lazy Loading)

Sayfaları sadece ihtiyaç anında yükleme.

05

Rota Korumaları (Route Guards): CanActivate

Yetkisiz girişleri engelleme.

06

Rota Korumaları (Route Guards): CanDeactivate

Kaydedilmemiş değişiklik uyarısı.

07

Çözümleyiciler (Resolvers: Veri Önden Yükleme)

Sayfa açılmadan veriyi hazır etme.

08

Alt Rotalar (Child Routes / Nested Routing)

İç içe geçmiş sayfalar.

09

Joker Rotalar (Wildcard Routes / 404)

Bilinmeyen yolları yakalama.

10

Router Events Takibi

Navigasyon anlarını izleme.

11

Konum Stratejisi (Location Strategy: Hash vs Path)

URL formatı seçimi.

Aşama 8: RxJS ve Reaktif Programlama

Observables, Operators, Subjects

01

Observable Nedir?

Zamanla akan veri akışı.

02

Abonelik (Subscription) ve Gözlemci (Observer)

Veri akışına abone olma.

03

Boru (Pipeable) Operatörleri: Map & Filter

Veriyi akarken dönüştürme ve süzme.

04

switchMap Operatörü (Mülakat Sorusu)

Eski isteği iptal edip sonuncuya odaklanma.

05

mergeMap vs concatMap

Paralel vs Sıralı işlem yönetimi.

06

debounceTime ve distinctUntilChanged

Gereksiz istekleri durdurma.

07

Subjects (Normal, Behavior, Replay)

Hem veri üreten hem veri dinleyen yapılar.

08

combineLatest ve forkJoin

Birden çok kaynağı birleştirme.

09

Hata Yönetimi (Error Handling): catchError ve retry

Ağ hatalarını yakalama ve tekrar deneme.

10

takeUntil ve Unsubscription

Otomatik abonelik sonlandırma.

11

Tap Operatörü: Yan Etkiler

Akışı bozmadan işlem yapma.

Aşama 9: HttpClient ve API Entegrasyonu

Interceptors, Error Handling, File Upload

01

HttpClientModule ve Injection

API istekleri için motoru kurma.

02

HTTP Araya Girenler (Interceptors)

Tüm isteklere merkezi müdahale.

03

Fonksiyonel Interceptors (Yeni)

Modern ve hafif interceptor yapısı.

04

HttpParams ve HttpHeaders

Dinamik sorgu ve başlık yönetimi.

05

Global Hata Yönetimi (HttpErrorResponse)

Merkezi hata yakalama simülasyonu.

06

Dosya Yükleme (File Upload) ve İlerleme Çubuğu

Büyük dosyaları sunucuya yükleme.

07

JSONP ve Alanlar Arası (Cross-Domain) İstekler

Güvenlik ve CORS aşma yöntemleri.

08

Interceptor ile Önbellekleme (Caching)

API cevaplarını bellekte saklama.

09

Yeniden Deneme Deseni (Retry Pattern)

Kopan bağlantıları kurtarma.

10

Tip Güvenli HTTP Yanıtları (Type-Safe Responses)

API cevaplarına tip atama.

11

İkili Veri İşleme (Handling Binary Data / Blob)

Resim veya PDF indirme.

Aşama 10: State Management (NgRx & Signals)

Store, Effects, Modern Signals State

01

Neden Durum Yönetimi (State Management)?

Bileşenler arası veri senkronizasyonu.

02

NgRx Core: Actions, Reducers, Store

Redux mimarisinin Angular hali.

03

NgRx Yan Etkileri (Effects)

API çağrılarını Store'dan ayırma.

04

Seçiciler (Selectors: Zeki Sorgular)

Store içinden veri seçme mantığı.

05

NgRx Varlık (Entity): Tablo Yönetimi

ID bazlı verileri yönetme.

06

Angular Signals (Gelecek Geldi!)

Yeni nesil reaktif veri yönetimi.

07

Hesaplanmış (Computed) Signals ve Effects

Bağımlı verileri otomatik güncelleme.

08

Signals vs RxJS (Ne Zaman Hangisi?)

Hibrit mimari kuralları.

09

Servislerle Durum Yönetimi (State with Services)

Kütüphanesiz basit state yönetimi.

10

NgRx Bileşen Deposu (Component Store)

Bileşene özel lokal state.

11

Redux DevTools Entegrasyonu

Zaman yolculuğu ile hata ayıklama.

Aşama 11: Angular Testing (Unit & E2E)

Jasmine, Karma, Cypress, Spectator

01

Birim Test (Unit Testing) Nedir?

Küçük fonksiyonların doğruluğunu test etme.

02

Karma Test Runner

Testlerin tarayıcıda çalıştırılması.

03

Bileşen Testi (Component Testing)

Bileşenin HTML ve TS uyumunu test etme.

04

Servis Testi ve Taklit Etme (Mocking)

Ağ isteklerini simüle etme.

05

Boru ve Direktif Testi (Pipe ve Directive Testing)

Saf fonksiyonların ve davranışların testi.

06

Spies (Casuslar) ve Mocks

Fonksiyon çağrılarını takip etme.

07

Asenkron Test: fakeAsync ve tick

Zamanı kontrol etme.

08

Spectator Kütüphanesi

Boilerplate kodları azaltan test aracı.

09

Uçtan Uca Test (E2E Testing): Cypress

Gerçek bir kullanıcı gibi akış testi.

10

Chrome DevTools ile Hata Ayıklama (Debugging)

Breakpoint koyarak hata ayıklama.

11

Test Kapsamı (Code Coverage)

Kodun yüzde kaçının test edildiği.

Aşama 12: SSR, SEO ve Deployment

Angular Universal, Hydration, Firebase

01

Angular Universal (SSR)

Sunucu tarafında render etme.

02

Hydration (Angular 17+)

Sunucudan gelen sayfayı canlandırma.

03

Ön Oluşturma (Prerendering / Static Site Gen)

Statik sayfalar üretme.

04

PWA: Progress Web Apps

Web sitesini uygulama gibi yükleme.

05

Paket Boyutu Optimizasyonu (Bundle Size Optimization)

Paket boyutunu küçültme.

06

Görsel ve Fontların Tembel Yüklenmesi (Lazy Loading)

Görsel ve font optimizasyonu.

07

Çalışma Zamanı Konfigürasyonu (Runtime Config)

Ayarları başlarken çekme.

08

Firebase Hosting & Deployment

Hızlı ve bedava yayına alma.

09

Angular Uygulamasını Dockerize Etmek

Uygulamayı konteynere koyma.

10

CI/CD Pipelines (GitHub Actions)

Otomatik build ve deploy.

11

Güvenlik En İyi Pratikleri (Security Best Practices)

Web güvenliği önlemleri.