ReactJS Web Application Development Eğitimi

Bu eğitim; modern, performanslı ve kullanıcı odaklı web uygulamaları geliştirmek isteyen herkes için özel olarak hazırlanmıştır. ReactJS'in component tabanlı yapısı, modern JavaScript yetenekleri (ES6+), API entegrasyonları, stil yönetimi ve global state yönetimi gibi temel ve ileri düzey konular, tamamen uygulamalı olarak işlenmektedir.

Katılımcılar, eğitim sonunda gerçek bir SPA (Single Page Application) inşa etme yetkinliği kazanır.

• Temel düzeyde JavaScript bilgisi (değişkenler, fonksiyonlar, döngüler)

• HTML/CSS bilgisi

• Komut satırı ve terminal araçlarına aşinalık

Bonus: TypeScript bilgisi avantaj sağlar ama zorunlu değildir.

• Web geliştirmeye yeni adım atmış geliştiriciler

• Vanilla JS bilgisine sahip olup framework’e geçmek isteyenler

• React dünyasına sağlam temellerle başlamak isteyen öğrenciler

• Yazılım ekiplerinde ReactJS görevleri alan full-stack geliştiriciler

• UI/UX geliştiricileri ve frontend profesyonelleri

• ReactJS’in felsefesi ve mimarisi
• SPA mantığı ve React Router ile yönlendirme
• React Hooks (useState, useEffect, useRef, useReducer...)
• Context API ve Redux Toolkit ile global state yönetimi
• Axios ile REST API bağlantıları
• React Hook Form & Yup ile form kontrolü ve validasyon
• Material UI & Styled Components ile profesyonel UI geliştirme
• Performans artırımı: Lazy loading, Suspense, Code Splitting
• Build alma, çevresel değişkenler ve dağıtım süreci

1. Gün – React'e Giriş & Temel Yapılar

• SPA (Single Page Application) mantığı ve modern frontend mimarisi

• ES6+ ile modern JavaScript yazımı ve TypeScript'e giriş

• Virtual DOM kavramı ve React’in component-based yapısı

• Vite kullanarak hızlı proje kurulumu

• JSX kullanımı: HTML içinde JavaScript yazmanın avantajları

• Component mantığına hazırlık

2. Gün – Function Components & Props Yönetimi

• Function component nedir, nasıl yazılır?

• Props kavramı ve veri aktarımı

• “Props drilling” problemi ve temel çözüm yolları

• Kod organizasyonu: reusable component yapıları

3. Gün – React Hooks ile Durum Yönetimi

• useState hook’u ile state kontrolü

• Controlled ve uncontrolled component farkları

• useEffect: lifecycle simülasyonu ve bağımlılık dizisi kullanımı

• useRef ile DOM manipülasyonu

• useMemo ve useCallback ile performans optimizasyonu

• useReducer kullanarak karmaşık state senaryoları

4. Gün – Routing, Global State, Formlar ve Stil

• SPA'de sayfa yapısı ve client-side routing

• React Router v7+: useNavigate, useParams, useLocation

• Nested routing & layout routes

• Protected routes ile yetkilendirme yapısı

• Context API: global state oluşturma ve dağıtımı

• React Hook Form ile modern form kontrolü

• Yup ile doğrulama şemaları

• Styled Components & CSS-in-JS

• Material UI ile profesyonel UI geliştirme

• Mini Lab Uygulaması (login formu, ürün listesi)

5. Gün – API İşlemleri, Redux Toolkit & Yayın Süreci

• REST API nedir? JSON & HTTP istek yapısı

• Axios ile HTTP işlemleri (GET, POST, PUT, DELETE)

• Servis mimarisiyle API modülleri oluşturma

• Redux Toolkit (RTK): configureStore, createSlice, useSelector, useDispatch

• Async işlemler: createAsyncThunk kullanımı

• Lazy loading & React Suspense

• Code Splitting ile performans artışı

• Css Modules ile lokal stil yönetimi

• Build alma, preview testi ve environment değişkenleri

• Babel & SWC farkları, hızlı derleme