Full-Stack React: Başlangıçtan İleri Seviyeye

Bu kapsamlı kurs, React'in temel kavramlarından başlayarak full-stack geliştirme yetkinliklerine kadar geniş bir yelpazeyi kapsar. Kurs boyunca, katılımcılar React'in temel bileşenlerini nasıl oluşturacaklarını ve yöneteceklerini öğrenirken, Hooks, Event Handlers, React Context, useQuery ile data-fetching , Suspense, Lazy Loading  CSR, SSR ve Straming SSR gibi ileri düzey özelliklerle nasıl etkili bir şekilde çalışacaklarını keşfedecekler. Kursun son bölümü NextJS App router ile fullstack uygulamalar geliştirmeye ayrılmıştır.

React Temelleri ve Bileşen Yönetimi:

• React'in temel kavramları ve bileşen tabanlı geliştirme anlayışı

• JSX kullanımı ve componentlar arası iletişim

• State yönetimi ve props kullanımı

• Conditional(Şartlı) Rendering

• Pure Components

• Lists

  
  

Event Handlers

• Event Handlers

• Event Handler fonksiyonlarını prop olarak aktarma

• Event Propagation

• Default Behaviour

React State

• React State ( useState Hook )

• Multiple States

• Rendering

• Object States

• Array States

• Immer

• State Structure Best Practices

• Lifting State Up

Hooks

• Hooks kavramı: useId, useRef, useEffect, useReducer gibi temel Hooks'ların kullanımı

• Custom Hook'lar oluşturma ve kullanma

• useEffect ile side-effectler

• useEffect cleanup function

Memoization

• Memoization

• React.memo() Kullanımı

• useMemo() hook

• useCallback() hook

React Context

• Context hangi problemi çözüyor?

• React Context kullanımı

• React Context ne zaman kullanılmalı?

• Provider Pattern

• Performans

3rd Party Component Libraries

• Component Kütüphaneleri ( Antd, Material UI vs.. )

• Stilsiz Component Kütüphaneleri ( Radix UI )

• Radix UI ile custom modal oluşturma

Custom VideoPlayer Uygulaması ( ÖRNEK PROJE)

• Öğrendiklerimizi kullanarak custom videoplayer oluşturalım!

Fullstack React - NextJS 14 (APP ROUTER)

• NextJS Frameworkü

• Client - Server Components

• Client / Server Side Rendering

• Hydration

• Routing

• Hydration Mismatch Hatalarını Çözelim!

• Params & Query Params

• Dynamic Segments In Route

• Metadata API

• React Cache

• Suspense

• Selective Hydrate

• NextJS Loading Page

• Streaming SSR

• Lazy Loading