REACT EĞİTİMİ

Modern React ile dinamik arayüzler kurun

Bileşen, hook, yönlendirme ve API entegrasyonuyla modern React uygulamaları geliştirin

React Eğitimi, modern web arayüzlerinin en yaygın kütüphanesi olan React'i bileşenlerden API entegrasyonuna kadar uçtan uca öğretir. Program JSX ve bileşen mantığıyla başlar; props ve olaylarla etkileşim kurar.

3 gün Orta Seviye Online / Yüz Yüze / Hibrit Sertifikalı

Eğitim Hakkında

JSX ve bileşenlerden hook, yönlendirme ve API entegrasyonuna kadar modern React

React Eğitimi, bileşen tabanlı yapısı ve geniş ekosistemiyle modern web arayüzlerinin en yaygın kütüphanesi olan React'i uçtan uca öğretir. Katılımcılar JSX ve bileşen mantığıyla başlar; props ve olaylarla etkileşim kurar. Ardından useState, useEffect ve useContext gibi hook'larla durum ve yan etkileri yönetir. Son gün React Router ile yönlendirme ve fetch ile API entegrasyonunu öğrenip tüm konuları bir bitirme projesinde birleştirir.

Süre ve Format

3 Gün. Her gün dört modül; React temelleri, hook ile durum yönetimi, yönlendirme ve API entegrasyonu uygulamalı işlenir.

Seviye

Orta Seviye — bileşen, hook, yönlendirme ve API ile modern React uygulaması geliştirme

Öğrenme Metodu

Her konu canlı kodlama ve küçük görevlerle işlenir; üç gün boyunca öğrenilenler adım adım bir bitirme projesinde birleştirilir.

Neden Bu Eğitim?

🧩Bileşen mimarisi

Arayüzü yeniden kullanılabilir bileşenlere ayırarak büyük uygulamaları düzenli ve bakımı kolay biçimde kurmayı öğrenirsiniz.

🪝Hook ile güç

useState, useEffect ve useContext gibi hook'larla durumu ve yan etkileri modern ve okunabilir biçimde yönetirsiniz.

💼Aranan beceri

React, frontend iş ilanlarında en çok aranan kütüphanelerden biridir; bu eğitim sizi bu talebe hazırlar.

Anahtar Konular

react eğitimireact kursureact js eğitimireact hook eğitimireact router eğitimimodern web arayüzü eğitimifrontend react eğitimireact bileşen eğitimireact api entegrasyonujavascript react kursu
“React öğrenmenin değeri, tek tek bileşenlerde değil; onları bir araya getirip çalışan bir uygulama kurabilme yeteneğindedir.”

Ön Koşullar

Eğitimden verim almak için faydalı olacak bilgi ve hazırlık

1
JavaScript bilgisi

Değişken, fonksiyon, dizi metotları ve ES6 söz dizimi gibi temel JavaScript kavramlarına aşinalık gereklidir.

2
HTML ve CSS

Temel HTML yapısı ve CSS ile arayüz oluşturma bilgisi JSX ve bileşen bölümlerinde işleri kolaylaştırır.

3
Tarayıcı ve araçlar

Tarayıcı geliştirici araçlarını ve terminalde temel komutları kullanabilmek faydalı bir beceridir.

4
Geliştirme ortamı

VS Code, güncel Node.js ve modern bir tarayıcının kurulu olduğu bilgisayar; kurulum ilk modülde yapılabilir.

Eğitim İçeriği

Programın gün gün akışı aşağıdadır. Bir güne tıklayarak o günün modüllerini ve içeriklerini görebilirsiniz.

Günün hedefiKatılımcı React'in bileşen mantığını ve JSX söz dizimini kavrar; props ile veri aktarır, olayları işler ve arayüzü yeniden kullanılabilir bileşenlere ayırmayı öğrenir.
Modül 1
React'e Giriş ve Kurulum
  • React nedir ve neden kullanılır
  • Bileşen tabanlı yaklaşım ve sanal DOM
  • Vite ile React projesi oluşturma
  • Proje yapısı ve dosya düzenine bakış
  • İlk bileşeni yazma ve render etme
  • Geliştirme sunucusu ve sıcak yenileme
Modül 2
JSX ve Söz Dizimi Kuralları
  • JSX ile arayüz yapısını tanımlama
  • JSX içinde JavaScript ifadesi gömme
  • className ve satır içi stil kullanımı
  • Birden çok elemanı sarmalama (Fragment)
  • JSX kuralları ve yaygın hatalar
  • Koşullu ifadelerle içerik gösterme
Modül 3
Bileşenler ve Props
  • İlk fonksiyon bileşenini yazma
  • Props ile bileşene veri aktarma
  • Props'u destructuring ile okuma
  • children prop ve bileşen kompozisyonu
  • Yeniden kullanılabilir bileşen tasarımı
  • Bileşenleri ayrı dosyalara ayırma
Modül 4
Listeler ve Olaylar
  • map ile dizi verisini render etme
  • key prop ve listede doğru kullanımı
  • Koşullu render: && ve ternary kullanımı
  • onClick ve onChange olaylarını işleme
  • Olay nesnesi ve parametre geçirme
  • Basit etkileşimli bileşen örneği
Günün hedefiKatılımcı React hook'larıyla durum ve yan etkileri yönetir; useState ile durum tutar, useEffect ile yan etki kurar ve useContext ile veriyi bileşenler arası paylaşır.
Modül 1
useState ile Durum
  • useState ile bileşen durumu tutma
  • Durum güncelleme ve yeniden render
  • Durumu değişmez (immutable) güncelleme
  • Nesne ve dizi durumunu yönetme
  • Fonksiyonel güncelleme (prev) biçimi
  • Durumu bileşenler arası taşıma (lifting)
Modül 2
useEffect ile Yan Etkiler
  • useEffect ile yan etki yönetimi
  • Bağımlılık dizisi (deps) kullanımı
  • Temizleme (cleanup) fonksiyonu
  • Bileşen yaşam döngüsü ile ilişki
  • Zamanlayıcı ve abonelik yönetimi
  • Sık yapılan useEffect hataları
Modül 3
Formlar ve Kontrollü Girdi
  • Kontrollü bileşen (controlled input)
  • Form durumunu state ile yönetme
  • Çoklu girdi ve tek handler kullanımı
  • Form gönderimi (submit) yönetimi
  • Temel doğrulama ve hata gösterimi
  • Kullanıcı girişiyle anlık güncelleme
Modül 4
useContext ile Paylaşım
  • Prop drilling sorunu ve çözümü
  • createContext ile bağlam oluşturma
  • Provider ile bağlam değeri sağlama
  • useContext ile bağlam değerine erişim
  • Tema veya kullanıcı bağlamı örneği
  • Custom (özel) hook kavramına giriş
Günün hedefiKatılımcı React Router ile çok sayfalı yapı kurar, fetch ile API'den veri çeker ve öğrendiği tüm konuları çalışan bir bitirme projesinde birleştirir.
Modül 1
React Router ile Yönlendirme
  • React Router kurulumu ve yapılandırma
  • Route bileşeni ile rota tanımlama
  • Link ve NavLink ile sayfa geçişi
  • URL parametrelerini useParams ile okuma
  • İç içe rota ve yönlendirme (nested)
  • Programatik yönlendirme (useNavigate)
Modül 2
API Entegrasyonu
  • fetch ile API'den JSON veri çekme
  • useEffect içinde veri yükleme akışı
  • Yükleme ve hata durumlarını yönetme
  • Listeleme ve detay sayfası kurma
  • POST isteği ile sunucuya veri gönderme
  • async/await ile asenkron akış yönetimi
Modül 3
Durum ve Bileşen Organizasyonu
  • Klasör ve bileşen yapısını düzenleme
  • Ortak mantığı custom hook'a taşıma
  • Yeniden kullanılabilir bileşen kütüphanesi
  • Durumu bileşen ağacında doğru seviyede tutma
  • Performans için temel öneriler
  • Kod okunabilirliği ve düzen ilkeleri
Modül 4
Bitirme Projesi Geliştirme
  • Proje gereksinimlerini belirleme
  • Bileşen ve sayfa yapısını tasarlama
  • API verisini bileşen arayüzüne bağlama
  • Yönlendirme ve durum yönetimini kurma
  • Uygulamayı yayına (deploy) hazırlama
  • Projeyi deneme, test etme ve sunma

Eğitim Kazanımları

Program sonunda katılımcılar:

✅
Bileşen ve JSX

JSX söz dizimini öğrenir, fonksiyon bileşenleri yazar ve arayüzü yeniden kullanılabilir parçalara ayırmayı kavrarsınız.

✅
Props ve veri akışı

Props ile bileşenler arası veri aktarır, children ve kompozisyonla esnek ve düzenli arayüzler oluşturursunuz.

✅
Listeler ve olaylar

map ile liste render eder, key'i doğru kullanır ve onClick/onChange olaylarıyla etkileşimli arayüzler kurarsınız.

✅
useState

useState ile bileşen durumunu yönetir, durumu değişmez biçimde günceller ve bileşenler arası taşımayı uygularsınız.

✅
useEffect

useEffect ile yan etkileri yönetir, bağımlılık dizisini doğru kullanır ve temizleme fonksiyonuyla kaynakları yönetirsiniz.

✅
Formlar ve Context

Kontrollü form girdilerini yönetir, useContext ile veriyi paylaşır ve prop drilling sorununu çözersiniz.

✅
Yönlendirme

React Router ile çok sayfalı uygulama kurar, URL parametrelerini ve programatik yönlendirmeyi kullanırsınız.

✅
API ve proje

fetch ile API'den veri çeker, yükleme ve hata durumlarını yönetir ve tüm konuları bir bitirme projesinde birleştirirsiniz.

Kimler İçin Uygundur?

  • HTML
  • CSS ve temel JavaScript bilgisi olan; React ile bileşen tabanlı
  • dinamik
  • API'ye bağlı modern web arayüzleri geliştirmek isteyen frontend geliştiriciler ve geliştirici adayları için uygundur

Sıkça Sorulan Sorular

React eğitimi için ön koşul nedir?
Temel JavaScript bilgisi gereklidir; değişken, fonksiyon, dizi metotları (map, filter) ve ES6 söz dizimine aşinalık önemlidir. HTML ve CSS ile arayüz oluşturma bilgisi JSX bölümünde faydalı olur. React deneyimi gerekmez; eğitim bileşen mantığından başlayarak adım adım ilerler ve orta seviyeye kadar taşır.
Bu eğitimde hangi React sürümü ve yaklaşım kullanılıyor?
Eğitim, güncel React sürümünün fonksiyon bileşenleri ve hook tabanlı modern yaklaşımını kullanır. Sınıf bileşenleri yerine useState, useEffect ve useContext gibi hook'lar işlenir. Projeler Vite ile kurulur ve yönlendirme için React Router kullanılır; bu, güncel iş ortamında en çok karşılaşılan yaklaşımdır.
Eğitim sonunda bir proje geliştiriyor muyum?
Evet. Üçüncü gün, öğrenilen bileşen, hook, yönlendirme ve API konularını birleştiren çalışan bir bitirme projesi geliştirilir. Proje, API'den veri çeken, birden çok sayfası olan ve durum yöneten küçük bir uygulamadır. Böylece teoriyi uygulamaya döker ve kendi projelerinizi kuracak güveni kazanırsınız.
Eğitimin süresi ve formatı nedir?
Eğitim üç gün sürer ve her gün dört modülden oluşur. İlk gün React temelleri ve JSX, ikinci gün hook ile durum yönetimi, üçüncü gün yönlendirme, API entegrasyonu ve bitirme projesi işlenir. Yüz yüze veya online yapılabilir; tempo ve örnekler katılımcı grubun seviyesine göre uyarlanabilir.
Eğitim sonunda sertifika veriliyor mu?
Programı tamamlayan katılımcılar Digital Vizyon Akademi Katılım ve Başarı Sertifikası alır. Sertifika tamamlanan modülleri ve geliştirilen bitirme projesini belgeler; kurumsal gruplar için içerik, ekibin seviyesine ve hedeflenen uygulama türüne göre özelleştirilebilir.

Sertifikalandırma

Bu eğitim Digital Vizyon Akademi Başarı Sertifikası ile tamamlanır.

Eğitim başında “Ön Test”, bitiminde “Son Test” uygulanarak gelişim ölçümlenir. Değerlendirme formunu dolduran katılımcılar sertifikalarını alır. Sertifikanızın geçerliliğini Sertifika Sorgulama sayfasından doğrulayabilirsiniz.

Örnek Sertifika d Digital Vizyon AKADEMİ KATILIM SERTİFİKASI Bu sertifika [Katılımcı Adı Soyadı] adlı katılımcının aşağıdaki eğitim programını başarıyla tamamladığını belgeler. React Eğitimi Sertifika Kodu DV-2026XX00 Tarih 15.10.2026 Yetkili İmza DV AKADEMİ

Eğitim Bilgileri

Süre3 gün
SeviyeOrta Seviye
FormatOnline / Yüz Yüze / Hibrit
KonuReact
Sertifika✓ Var
Hemen Bilgi Al
İlgili Eğitimler

Bu Eğitimle Birlikte Tercih Edilenler

ReactSpring Boot, React ve Redux Eğitimi
Web ve Ön Yüz Geliştirme Eğitimleri

Spring Boot, React ve Redux Eğitimi

4 günOrtaOnline / Yüz Yüze / Hibrit

Spring Boot REST API, Spring Security ve JWT ile React ve Redux ön yüzünü birleştiren uçtan uca tam yığın geliştirme eğitimi.

Detayları Gör →
ReactTam Katmanlı Geliştirme ile React, TypeScript, Next.js ve Modern Arka Uç Eğitimi
Web ve Ön Yüz Geliştirme Eğitimleri

Tam Katmanlı Geliştirme ile React, TypeScript, Next.js ve Modern Arka Uç Eğitimi

4 günOrtaOnline / Yüz Yüze / Hibrit

TypeScript, Next.js App Router, sunucu bileşenleri, Prisma ve Auth.js ile tam katmanlı modern web uygulaması geliştirme eğitimi.

Detayları Gör →
ReactIntroduction to ASP.NET Core Development using React with Redux Eğitimi
Web ve Ön Yüz Geliştirme Eğitimleri

Introduction to ASP.NET Core Development using React with Redux Eğitimi

4 günOrtaOnline / Yüz Yüze / Hibrit

ASP.NET Core Web API ile React ve Redux kullanarak tam yığın geliştirme: EF Core, Redux Toolkit, async thunk ve JWT ile uçtan uca eğitim.

Detayları Gör →
Reactİleri Seviye React Eğitimi
Web ve Ön Yüz Geliştirme Eğitimleri

İleri Seviye React Eğitimi

4 günİleriOnline / Yüz Yüze / Hibrit

İleri seviye React eğitimi: performans optimizasyonu, ileri hook desenleri, durum mimarisi, React Query, test ve TypeScript ile üretim React.

Detayları Gör →
ReactJavaScript Kullanarak React'e Giriş Eğitimi
Web ve Ön Yüz Geliştirme Eğitimleri

JavaScript Kullanarak React'e Giriş Eğitimi

2 günBaşlangıçOnline / Yüz Yüze / Hibrit

JavaScript kullanarak React'e giriş eğitimi: modern ES6 özellikleri, JSX, bileşen, props, useState ve useEffect ile iki günde React temelleri.

Detayları Gör →
ReactReact Giriş Eğitimi
Web ve Ön Yüz Geliştirme Eğitimleri

React Giriş Eğitimi

2 günBaşlangıçOnline / Yüz Yüze / Hibrit

React giriş eğitimi: bileşen, JSX, props, useState ve olaylarla iki günde React'e sıfırdan uygulamalı ve hızlı başlangıç yapın.

Detayları Gör →
+90 (501) 369 40 14 WhatsApp [email protected] LinkedIn