Model Online/Fiziksel
Süre
Modüller 4 modül

Eğitim Hakkında

Modern frontend ekosistemi, bileşenlerin yalnızca tarayıcıda değil sunucuda da çalıştığı hibrit bir mimariye evrilmiştir. Bu eğitim, React 19 yeniliklerini ve Next.js App Router mimarisini bir arada ele alarak kurumsal ölçekte hızlı, SEO uyumlu ve ölçeklenebilir web uygulamaları geliştirmeyi öğretir.

Katılımcılar; React Server Components (RSC) ile istemci bileşenleri arasındaki sınırı doğru kurgulamayı, Streaming ve Suspense ile algılanan performansı artırmayı, Server Actions ile veri mutasyonlarını yönetmeyi ve Next.js önbellekleme (caching) mekanizmalarını uygulamalı olarak deneyimler.

Kimler Katılmalı ve Ön Koşullar

  • Modern React ve Next.js mimarisine geçiş yapmak isteyen frontend ve full-stack geliştiriciler
  • Kurumsal web projelerinde Core Web Vitals, SEO ve ilk yükleme performansını iyileştirmek isteyen ekipler
  • JavaScript/TypeScript ve temel React (bileşen, prop, state) bilgisine sahip olunması gereklidir

Kazanımlar

  • Modern React Mimarisi: Temel ve ileri Hooks, özel hook tasarımı ve React 19 form/aksiyon API'lerini etkin kullanma
  • App Router ve RSC: Server Components ve Client Components kompozisyonu ile JavaScript paket boyutunu küçültme
  • Esnek Render Stratejileri: Sayfa ve bileşen bazında SSR, SSG, ISR ve Streaming stratejilerini seçme
  • Performans ve Üretim Hazırlığı: Next.js Caching, Revalidation, Middleware ve görüntü/font optimizasyonlarını uygulama

Konular

Modern React 19 Mimarisi, Hooks ve Bileşen Tasarım Kalıpları
  • React render yaşam döngüsü, useState, useEffect, useRef, useId ve özel hook (Custom Hooks) geliştirme
  • React 19 yenilikleri: useActionState, useOptimistic, use API'si ve React Compiler yaklaşımları
  • Compound Components, Context API ile durum paylaşımı ve gereksiz re-render önleme teknikleri
Next.js App Router, Dosya Tabanlı Rotalama ve Server Components
  • App Router dizin yapısı: layout.tsx, page.tsx, loading.tsx, error.tsx ve Route Groups
  • Dinamik rotalar, Parallel Routes (@slot) ve Intercepting Routes ile modal/galeri akışları
  • React Server Components (RSC) çalışma mantığı ve "use client" sınırlarını doğru konumlandırma
Veri Çekme (Data Fetching), Render Stratejileri ve Server Actions
  • Sunucu bileşenlerinde doğrudan asenkron veri çekme, paralel istekler ve React Suspense ile Streaming
  • Statik ve dinamik render: SSG, SSR, ISR (Incremental Static Regeneration) ve Partial Prerendering
  • Server Actions ("use server") ile form işleme, Zod validasyonu, revalidatePath ve revalidateTag
Önbellekleme, Route Handlers, Middleware ve Performans Optimizasyonu
  • Next.js Caching katmanlarını anlama ve güncel önbellek kontrol stratejileri
  • Route Handlers (API uç noktaları), Middleware ile kimlik doğrulama/yönlendirme ve Metadata API ile dinamik SEO
  • next/image, next/font, dinamik importlar ve Core Web Vitals (LCP, INP, CLS) optimizasyonu

Bu Kategorideki Diğer Eğitimler

  • SPA (Single Page Applications) Kütüphaneleri

    Modern SPA mimarisi, istemci tarafı rotalama, TanStack Query ile sunucu durumu yönetimi, Vite yapılandırması ve paket optimizasyonu tekniklerinde uzmanlaşın.

    Web Development - FrontEnd Kurumsal
    Canlı Kurs
    4 modül
    İncele
  • Angular ile Kurumsal Frontend Geliştirme

    Standalone Components, Angular Signals, RxJS, Reactive Forms, modüler mimari ve değişim algılama optimizasyonlarıyla kurumsal Angular uygulamaları geliştirin.

    Web Development - FrontEnd Kurumsal
    Canlı Kurs
    4 modül
    İncele
  • Micro Frontend ve Monorepo Mimarisi

    Module Federation, Nx ve Turborepo ile monorepo yönetimi, paylaşımlı tasarım sistemleri ve bağımsız dağıtım boru hatlarıyla frontend projelerini ölçeklendirin.

    Web Development - FrontEnd Kurumsal
    Canlı Kurs
    4 modül
    İncele
  • Redux ile Durum Yönetimi

    Redux Toolkit (RTK), RTK Query, normalize edilmiş state mimarisi, memoized selector'lar ve modern React durum yönetimi kalıplarıyla karmaşık uygulamaları yönetin.

    Web Development - FrontEnd Kurumsal
    Canlı Kurs
    4 modül
    İncele
  • TypeScript

    Strict tip sistemi, generics, utility types, discriminated unions ve tip güvenli API katmanlarıyla ölçeklenebilir ve hatasız TypeScript projeleri geliştirin.

    Web Development - FrontEnd Kurumsal
    Canlı Kurs
    4 modül
    İncele

Bizimle iletişime geçin