React Foundations Eğitimi, modern ve dinamik kullanıcı arayüzleri geliştirmek için kullanılan React kütüphanesinin temel yapılarını uygulamalı olarak öğretmeyi amaçlar.

Eğitim boyunca katılımcılar; React geliştirme ortamının hazırlanmasından JSX kullanımına, component mimarisinden props ve state yönetimine kadar temel React kavramlarını ele alacaktır. Ayrıca React Hooks kullanımı, component'ler arasında veri akışı, form yönetimi, stil uygulamaları, side effect yönetimi ve uygulama hata ayıklama yöntemleri üzerinde çalışılacaktır.

Teorik anlatımların yanı sıra uygulamalar, laboratuvar çalışmaları ve alıştırmalarla desteklenen eğitim sonunda katılımcıların yeniden kullanılabilir component'ler oluşturabilmeleri, React uygulamalarındaki veri ve durum yönetimini gerçekleştirebilmeleri ve sürdürülebilir web uygulamaları geliştirebilmeleri hedeflenmektedir.

React Temelleri Eğitimi programına Online Instructor-Led (canlı sanal sınıf) veya Classroom Based (sınıf eğitimi) formatlarında doğrudan katılım sağlayabilirsiniz. Ayrıca bu eğitimi kurumunuza özel olarak Online Instructor-Led, Classroom Based veya Onsite (yerinde eğitim) formatlarında, tercih ettiğiniz tarih ve lokasyonda organize edebiliriz. Detaylı bilgi ve kurumunuza özel planlama için bizimle iletişime geçebilirsiniz.

Kurumsal gruplar için bu eğitimi, kurumunuza özel Onsite (yerinde eğitim) formatında organize edebiliriz.

Önkoşullar

Bu eğitim, React konusunda yetkinlik kazanmak isteyen ve temel web geliştirme bilgisine sahip katılımcılar için hazırlanmıştır.

Katılımcıların eğitim öncesinde aşağıdaki teknolojiler konusunda temel/orta düzey bilgi sahibi olmaları önerilir:

JavaScript
HTML
CSS

JavaScript konusunda yeterli deneyimi bulunmayan katılımcıların eğitim öncesinde JavaScript Fundamentals seviyesinde bir eğitim tamamlamaları tavsiye edilir.

Kimler Katılmalı

Front-End Developer'lar
Web Developer'lar
Software Engineer'lar
Web uygulama geliştirme alanında çalışan teknik profesyoneller

Neler Öğreneceksiniz

Bu eğitimi tamamlayan katılımcılar:

React geliştirme ortamını hazırlayabilir ve temel proje yapısını oluşturabilir.
JSX kullanarak dinamik kullanıcı arayüzleri geliştirebilir.
Yeniden kullanılabilir React component'leri oluşturabilir ve component composition yaklaşımını uygulayabilir.
Props aracılığıyla component'ler arasında veri ve event handler aktarabilir.
useState Hook kullanarak component state'lerini ve kullanıcı etkileşimlerini yönetebilir.
React'in tek yönlü veri akışı yaklaşımını uygulayabilir.
Container ve Presentational Component yaklaşımlarını kullanarak uygulama yapısını organize edebilir.
CSS ve CSS Modules kullanarak component bazlı stil yönetimi gerçekleştirebilir.
useEffect Hook ile side effect ve component lifecycle ihtiyaçlarını yönetebilir.
Controlled ve Uncontrolled yaklaşımlarla React formları geliştirebilir.
React Developer Tools kullanarak component, props ve state yapılarını inceleyebilir ve uygulama hatalarını analiz edebilir.

Eğitim İçeriği

1. React'e Giriş

React'in Temelleri

React nedir?
React'in gelişimi ve kullanım alanları
React'i diğer web geliştirme yaklaşımlarından ayıran temel özellikler
React kullanmanın sağladığı avantajlar
Component tabanlı kullanıcı arayüzü mimarisi

Virtual DOM

Virtual DOM kavramı
React'in Virtual DOM yaklaşımı
Geleneksel DOM işlemleri ile temel farklar
Modern web uygulamalarında Virtual DOM kullanımının önemi

React Geliştirme Ortamının Hazırlanması

Geliştirme ortamının kurulması
Create React App ile başlangıç projesi oluşturma
React geliştirme araçlarına genel bakış
React Developer Tools kullanımı

Proje Yapısı

İlk React uygulamasının oluşturulması
Temel klasör ve dosya yapısı
Component organizasyonu
Dosya ve component isimlendirme yaklaşımları

2. JSX

JSX'e Başlangıç

HTML giriş noktası ve root elementi
createRoot ve render kullanımı
JSX ile temel React component yapısı
React uygulamasındaki dosyalar arasındaki ilişkinin anlaşılması

JSX Temelleri

JSX nedir ve neden kullanılır?
JSX yazım kuralları
Parent element kullanımı
Element ve tag kapatma kuralları

JSX Yazımı

Temel JSX syntax
Attribute kullanımı
{} ile JavaScript expression'larının JSX içerisinde kullanılması

JSX Kullanım Senaryoları

Değişkenlerin JSX içerisinde kullanılması
Props ile dinamik içerik oluşturma
Conditional rendering temelleri

3. React Component'leri

Component Temelleri

Component kavramı
İlk React component'inin oluşturulması
Tek ve çok satırlı JSX kullanımı
Component import ve export işlemleri
Component'lerin render edilmesi

Component İçerisinde İş Mantığı

Component içerisinde JavaScript logic kullanımı
Koşullu işlemler
Kullanıcı etkileşimlerinin yönetilmesi

Component Composition

Component'lerin iç içe kullanılması
Yeniden kullanılabilir component yapıları
Component'lerin organize edilmesi
Component composition yaklaşımı

4. Props

Props Temelleri

Props kavramı
Component'lere veri aktarımı
Props değerlerinin alınması ve kullanılması
Prop type ve default değer yaklaşımları
children prop kullanımı
Props değerlerinin ekrana yansıtılması
Component'ler arasında props aktarımı
Props ile dinamik rendering

Gelişmiş Props Kullanımı

Event handler'ların prop olarak aktarılması
Event handler prop'larının component içerisinde kullanılması
Event handler isimlendirme yaklaşımları

5. State ve Event Yönetimi

State Kavramı

State nedir?
Stateful component yaklaşımı
State kullanılması gereken durumlar
State kullanılmaması gereken durumlar
Component re-render mekanizmasının temelleri

useState Hook

React Hook kavramı
State oluşturma ve başlangıç değerleri
State değerlerinin güncellenmesi
Birden fazla state değerinin yönetilmesi
Kullanıcı etkileşimlerinin state ile yönetilmesi

Temel Konuların Uygulamalı Tekrarı

Component oluşturma
Props kullanımı
State yönetimi
Component ve state yapılarının birlikte kullanılması

6. Component Tasarım Kalıpları

Component Mimarisi

Container Component yaklaşımı
Presentational Component yaklaşımı
Component'lerin hangi durumlarda ayrıştırılması gerektiği
Presentational component'lerin container component içerisinde kullanılması

React Veri Akışı

Tek yönlü veri akışı
Parent–Child component iletişimi
Child–Parent iletişim senaryoları
Sibling component'ler arasında veri paylaşımı
Prop drilling kavramı
Lifting State Up yaklaşımı

7. React Uygulamalarında Styling

className ile standart CSS kullanımı
CSS Modules yaklaşımı
Stil dosyalarının organize edilmesi
Component bazlı styling
React projelerinde sürdürülebilir stil yapısının oluşturulması

8. Effects ve Component Lifecycle

Effects ile Çalışmak

React'te side effect kavramı
Side effect'lerin yönetilme nedenleri
useEffect Hook syntax ve temel kullanım
Effect'lerin çalışma zamanları
Dependency yapısı
Effect cleanup kavramı
Cleanup function oluşturulması

Component Lifecycle

Component'in başlangıç aşaması
Component güncellemeleri
Component cleanup aşaması
Lifecycle ihtiyaçlarının useEffect ile yönetilmesi

9. React Formları

Form Temelleri

Standart HTML formları ve React formları arasındaki farklar
Controlled ve Uncontrolled Form yaklaşımları
Uygun form yaklaşımının seçilmesi

Uncontrolled Forms

Formlarda useRef Hook kullanımı
Input değerlerine erişim
Uncontrolled form oluşturma
Submit event'lerinin yönetimi
Form değerlerinin alınması
Uncontrolled Form kullanım senaryoları

Controlled Forms

Temel form elementlerinin kullanımı
Input'ların useState ile yönetilmesi
Birden fazla form alanının yönetimi
Farklı input türleriyle çalışma
Form submit işlemlerinin yönetilmesi
Default browser davranışlarının kontrol edilmesi
Form verilerinin toplanması
Temel form validation
Başarı ve hata durumlarının yönetimi

10. React Uygulamalarında Debugging

React Developer Tools

Components sekmesinin kullanımı
Props ve state değerlerinin incelenmesi
Component tree üzerinde gezinme
Component davranışlarının analiz edilmesi

React Uygulamalarında Hata Ayıklama

Yaygın React hatalarının incelenmesi
Component kaynaklı problemlerin tespit edilmesi
Props ve state problemlerinin analiz edilmesi
React uygulamalarında temel debugging yöntemleri

Neden Bizi Seçmelisiniz

1995’ten beri Birleşik Krallık merkezli lider bir global eğitim sağlayıcısıyız.

React Temelleri Uzbekistan eğitimine Bilginç IT Academy'nin canlı ve etkileşimli sanal sınıf ortamında katılabilirsiniz. Online Instructor-Led eğitimlerimize bireysel olarak genel katılıma açık (Public) sınıflardan katılabileceğiniz gibi, kurumunuza özel (Private / In-house) bir sınıf da planlayabilirsiniz.

Eğitim Formatı (Delivery Method): Online Instructor-Led
Katılım Modeli (Participation Model): Genel Katılıma Açık (Public) / Kuruma Özel (Private / In-house)
Canlı ve Etkileşimli Eğitim: Eğitmeninizle gerçek zamanlı iletişim kurun; soru-cevap, uygulama ve grup çalışmalarıyla öğrenme sürecine aktif olarak katılın.
Esnek Katılım: Evinizden, ofisinizden veya internet erişiminizin bulunduğu herhangi bir lokasyondan eğitime katılın.
Uzman Eğitmen Kadrosu: Sektör deneyimine sahip, alanında yetkin eğitmenlerden güncel ve uygulanabilir bilgiler edinin.
30 Yılı Aşkın Deneyim: Bilginç IT Academy'nin 1995 yılından bu yana süregelen eğitim uzmanlığından yararlanın.
Dünya Genelinde Erişim: Uzbekistan dahil dünyanın farklı lokasyonlarından canlı sanal sınıflarımıza katılabilir veya kurumunuza özel online eğitim planlayabilirsiniz.

REACT Foundations Uzbekistan eğitimine yüz yüze sınıf ortamında katılabilirsiniz. Classroom Based eğitimlerimiz genel katılıma açık (Public)sınıflar veya kurumunuza özel (Private / In-house)sınıflar şeklinde planlanabilir.

Eğitim Formatı (Delivery Method): Classroom Based
Katılım Modeli (Participation Model): Genel Katılıma Açık (Public) / Kuruma Özel (Private / In-house)
Yüz Yüze Öğrenme: Eğitmeniniz ve diğer katılımcılarla doğrudan iletişim kurarak etkileşimli bir sınıf deneyimi yaşayın.
Deneyimli Eğitmenler: Sektörde uzun yıllara dayanan deneyime sahip uzmanlardan gerçek dünya örnekleriyle öğrenin.
Profesyonel Eğitim Ortamı: Teknolojik altyapısı güçlü, konforlu ve öğrenmeye uygun sınıflarda eğitim alın.
Uygulamalı Öğrenme: Eğitim içeriğine bağlı olarak uygulamalar, senaryolar, vaka çalışmaları ve eğitmen yönlendirmeli çalışmalarla teorik bilgilerinizi pratiğe dönüştürün.

REACT Foundations Uzbekistan eğitimini kurumunuza özel olarak kendi ofisinizde veya tercih ettiğiniz lokasyonda gerçekleştirebilirsiniz. Bilginç IT Academy eğitmenleri, kurumunuzun ihtiyaçlarına göre planlanan eğitim için belirlediğiniz lokasyona gelebilir.

Eğitim Formatı (Delivery Method): Onsite
Katılım Modeli (Participation Model): Kuruma Özel (Private / In-house)
Tercih Ettiğiniz Lokasyonda Eğitim: Eğitimi şirketinizin ofisinde veya belirlediğiniz farklı bir lokasyonda organize edin.
Kuruma Özel İçerik: Eğitim programını şirketinizin projelerine, ekip yapısına, mevcut yetkinlik seviyesine ve iş ihtiyaçlarına göre uyarlayın.
Ekip Odaklı Öğrenme: Ekibinizin aynı içerik ve yaklaşım etrafında gelişmesini sağlayarak kurum içi bilgi paylaşımını ve iş birliğini güçlendirin.
Esnek Planlama: Eğitim tarihini, lokasyonunu ve programını kurumunuzun operasyonel ihtiyaçlarına göre planlayın.
Global Eğitim Organizasyonu: Eğitimi Uzbekistan lokasyonunda veya tercih ettiğiniz farklı bir ülkede/lokasyonda kurumunuza özel olarak organize edebilirsiniz.

REACT Foundations Uzbekistan Eğitimi