React Native Eğitimi

Eğitim Hakkında

Bileşen temellerinden durum yönetimine, animasyondan native modüllere React Native yolculuğu

React Native Eğitimi, JavaScript bilen geliştiricilere tek kod tabanıyla iOS ve Android için native uygulama geliştirmeyi kapsamlı biçimde öğretir. Katılımcılar çekirdek bileşenleri, Hook'larla durum yönetimini, React Navigation ile gezinmeyi, Context ve Redux Toolkit ile uygulama genelinde durumu, Animated ve Reanimated ile akıcı animasyonları ve native modül entegrasyonunu öğrenir. Eğitim, performans iyileştirme ve iki platform için derleyip yayınlamayı da kapsar.

Süre ve Format

4 Gün. Her gün dört modül; örnek bir uygulama bileşenlerden durum yönetimine, animasyona ve iki platform için yayına doğru adım adım geliştirilir.

Seviye

Orta Seviye — JavaScript bilen geliştiricilere React Native ile iOS ve Android uygulaması geliştirmeyi kapsamlı öğretir

Öğrenme Metodu

Gerçek bir örnek uygulama dört gün boyunca geliştirilir; her modülde yeni bir React Native kavramı canlı olarak projeye eklenir.

Neden Bu Eğitim?

🎯Gerçek native çıktı

JavaScript ile yazdığınız kod gerçek native bileşenlere dönüşür; hem iOS hem Android için native görünümlü uygulamalar üretirsiniz.

🔄Güçlü durum yönetimi

Context ve Redux Toolkit ile uygulama genelinde veriyi düzenli yönetir, büyüyen projelerde sürdürülebilir mimari kurarsınız.

🔧Native modül erişimi

Çıplak akışla native modüllere ve üçüncü parti kütüphanelere tam erişim sağlayarak her türlü cihaz yeteneğini kullanırsınız.

Anahtar Konular

react native eğitimireact native kursumobil uygulama geliştirme eğitimiçapraz platform mobil geliştirmereact navigation eğitimiredux toolkit react nativereact native animasyonnative modül entegrasyonuios android tek kodjavascript mobil uygulama

“React Native, web bilgisini gerçek native uygulamaya dönüştürür; bu eğitim bileşenden durum yönetimine ve yayına tam yetkinlik kazandırır.”

Ön Koşullar

Eğitimden en iyi verimi almak için faydalı bilgi ve geliştirme ortamı

1

JavaScript bilgisi

Değişken, fonksiyon, dizi metotları ve ES6 kavramlarına aşinalık bileşen geliştirmeyi kolaylaştırır.

2

Temel React mantığı

Bileşen, props ve Hook kavramlarını bilmek öğrenmeyi hızlandırır; ayrıntılar eğitimde işlenir.

3

Node.js ve CLI

Node.js, npm ve React Native CLI kurulu, proje oluşturup çalıştırabilir bir ortam gerekir.

4

Derleme ortamı

Android Studio ya da Xcode kurulu, emülatör veya simülatörde çalıştırmaya hazır bir ortam faydalıdır.

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 Native mimarisini kavrar, çekirdek bileşenlerle arayüz oluşturur, useState ve useEffect ile durumu yönetir ve Flexbox ile platformlar arası tutarlı tasarım yapar.

Modül 1

React Native Mimarisi

JavaScript ile native köprü çalışma mantığı
Hibrit yerine gerçek native bileşen üretimi
Yeni mimari, Fabric ve TurboModules bakışı
Metro paketleyicinin rolü ve çalışması
React Native ve React farkının kavranması
CLI ile çıplak proje kurulum akışı

Modül 2

Çekirdek Bileşenler

View ile yerleşim kapsayıcısının kurulması
Text ile metin gösterimi ve biçimlendirme
Image ile yerel ve uzak görsel yükleme
ScrollView ile kaydırılabilir içerik
TextInput ile kullanıcı girdisi alma
Pressable ve dokunma olaylarının işlenmesi

Modül 3

Hooks ile Durum ve Etki

useState ile bileşen içi durum tutma
useEffect ile yan etkileri yönetme
Bağımlılık dizisi ile tetiklenme kontrolü
useRef ile değer ve bileşen erişimi
Özel Hook ile mantığı yeniden kullanma
Değişmezlik ilkesi ve yeniden render

Modül 4

Flexbox ile Stil

StyleSheet ile stil tanımlama yaklaşımı
flexDirection ile eksen ve yön belirleme
justifyContent ve alignItems ile hizalama
flex ile orantılı alan paylaşımı
Farklı ekran boyutlarına esnek uyum
Platforma özel stil ile ince ayar

Günün hedefiKatılımcı React Navigation ile ekran geçişlerini kurar, Context API ile paylaşılan durumu yönetir ve Redux Toolkit ile büyüyen uygulamalarda ölçeklenebilir durum mimarisi kurar.

Modül 1

React Navigation

Stack navigator ile ekranlar arası geçiş
Tab navigator ile sekmeli ana akış
Drawer navigator ile yan menü kurulumu
Ekranlar arası parametre aktarımı
Başlık, buton ve üst bar özelleştirme
Derin bağlantı ve navigasyon durumu

Modül 2

Context API ile Paylaşımlı Durum

createContext ile genel durum tanımı
Provider ile değerleri alt ağaca yayma
useContext ile durumu bileşende okuma
Tema ve oturum için Context kullanımı
useReducer ile karmaşık durum mantığı
Gereksiz render ve Context sınırları

Modül 3

Redux Toolkit ile Durum

Store, action ve reducer kavramları
createSlice ile dilim tanımlama
configureStore ile store kurulumu
useSelector ve useDispatch kullanımı
createAsyncThunk ile eşzamansız akış
Redux ve Context arasında seçim

Modül 4

Veri Çekme ve Önbellek

fetch ve axios ile REST isteği atma
Yükleniyor ve hata durumu yönetimi
React Query ile veri önbellekleme
Sorgu yeniden deneme ve tazeleme
Sonsuz kaydırma ve sayfalı veri
İstek iptali ve yarış koşulu önleme

Günün hedefiKatılımcı FlatList ile verimli listeler kurar, Animated ve Reanimated ile akıcı animasyonlar yapar, jest işler ve kamera ve konum gibi native cihaz API'lerine erişir.

Modül 1

FlatList ile Verimli Listeler

FlatList ile büyük verinin verimli gösterimi
renderItem ve keyExtractor kullanımı
Aşağı çekerek yenileme desteği ekleme
Sona gelince sayfalı veri yükleme
SectionList ile bölümlü liste yapısı
Ayraç, başlık ve boş liste durumu

Modül 2

Animated API ile Hareket

Animated.Value ile animasyon değeri tutma
timing, spring ve decay animasyonları
interpolate ile değer aralığı eşleme
Paralel ve sıralı animasyon dizileri
Animated.event ile kaydırmaya bağlama
useNativeDriver ile performanslı animasyon

Modül 3

Reanimated ve Gesture Handler

Reanimated ile UI iş parçacığında animasyon
useSharedValue ve useAnimatedStyle kullanımı
Gesture Handler ile dokunma ve kaydırma
Sürükle bırak etkileşimi kurma
withSpring ve withTiming geçişleri
Akıcılık için jank kaynaklarını azaltma

Modül 4

Native Cihaz API'leri

Çalışma zamanı izin isteme akışı
Kamera ve galeri erişimi kurma
Konum bilgisi alma ve izin yönetimi
AsyncStorage ile yerel veri saklama
Bildirim gönderme ve izin onayı
Linking ile dış uygulama ve URL açma

Günün hedefiKatılımcı native modül entegrasyonunu öğrenir, uygulamayı hata ayıklar, performansı iyileştirir, temel testleri yazar ve iki platform için derleyip yayınlamayı uygular.

Modül 1

Native Modül Entegrasyonu

npm ile native paket kurulum süreci
iOS ve Android bağımlılık kurulum farkı
Autolinking ve manuel bağlama mantığı
Köprü üzerinden native fonksiyon çağırma
Platforma özel kod yazma yaklaşımı
Native modül seçerken dikkat noktaları

Modül 2

Hata Ayıklama ve Performans

Flipper ile uygulama durumunu inceleme
Yeniden render kaynaklı yavaşlığı bulma
useMemo ve useCallback ile iyileştirme
React.memo ile gereksiz render önleme
Liste performansını ölçme ve geliştirme
Bellek ve çökme sorunlarını çözme

Modül 3

Test ve Kod Kalitesi

Jest ile birim testi yazma temeli
React Native Testing Library kullanımı
Bileşen etkileşimini test etme
Anlık görüntü testi ile arayüz kontrolü
ESLint ve Prettier ile kod kalitesi
TypeScript ile tip güvenliği sağlama

Modül 4

Derleme ve Mağaza Yayını

Android App Bundle üretim derlemesi
iOS için imzalama ve sertifika mantığı
Uygulama ikonu ve açılış ekranı ayarı
Sürüm numarası ve güncelleme yönetimi
Play Store ve App Store listesi hazırlığı
ProGuard ve derleme boyutunu küçültme

Eğitim Kazanımları

Program sonunda katılımcılar:

✅

Mimariyi kavrama

React Native'in native köprü mimarisini ve yeni mimariyi anlar, çıplak akışla proje kurulumunu doğru yaparsınız.

✅

Bileşen ve Hooks

Çekirdek bileşenler ve Hook'larla yeniden kullanılabilir, temiz ve okunabilir arayüz bileşenleri geliştirebilirsiniz.

✅

Navigasyon kurma

React Navigation ile stack, tab ve drawer gezinmeyi kurar, parametre aktarımı ve derin bağlantıyı uygularsınız.

✅

Durum yönetimi

Context API ve Redux Toolkit ile uygulama genelindeki durumu ölçeklenebilir ve sürdürülebilir biçimde yönetirsiniz.

✅

Verimli listeler

FlatList ve SectionList ile büyük verileri performanslı listeler; yenileme ve sayfalı yüklemeyi uygularsınız.

✅

Animasyon yapma

Animated ve Reanimated ile akıcı animasyonlar kurar, Gesture Handler ile zengin dokunma etkileşimleri eklersiniz.

✅

Native entegrasyon

Native modülleri kurar, köprü üzerinden native fonksiyon çağırır ve cihaz yeteneklerine tam erişim sağlarsınız.

✅

Test ve yayın

Jest ile test yazar, performansı iyileştirir ve uygulamayı iki platform için derleyip mağazalarda yayınlarsınız.

Kimler İçin Uygundur?

JavaScript ve temel React bilgisine sahip olup mobil geliştirmede derinleşmek isteyen geliştiriciler
tek kod tabanıyla iki platforma üretim yapan yazılımcılar
native modül entegrasyonunu öğrenmek isteyenler için uygundur

Sıkça Sorulan Sorular

Bu eğitim kimler için uygundur?

JavaScript ve temel React bilgisine sahip olup mobil uygulama geliştirmede derinleşmek isteyen geliştiriciler, tek kod tabanıyla iki platforma üretim yapmak isteyen yazılımcılar ve native modül entegrasyonunu öğrenmek isteyenler için uygundur. React temelleri eğitim içinde hatırlatılır.

Bu eğitim Expo eğitiminden farkı nedir?

Bu program çıplak React Native akışına, native modül entegrasyonuna ve durum yönetimi ile animasyon gibi çekirdek konulara odaklanır. Expo eğitimi yönetilen akış ve EAS odaklıyken bu eğitim, native tarafa tam erişim gerektiren projeler için gereken derinliği ve mimari becerileri kazandırır.

Durum yönetimi için ne öğretiliyor?

Eğitim önce Context API ve useReducer ile paylaşılan durumu, ardından büyüyen uygulamalar için Redux Toolkit ile store, slice ve async thunk yapısını işler. Hangi senaryoda Context'in yeterli olduğunu, ne zaman Redux'a geçmenin doğru olduğunu örneklerle netleştirir.

Native modül eklemeyi öğrenecek miyim?

Evet. Eğitim npm ile native paket kurulumunu, autolinking ve manuel bağlamayı, köprü üzerinden native fonksiyon çağırmayı ve platforma özel kod yazmayı kapsar. Böylece kamera, Bluetooth veya ödeme gibi özel cihaz yetenekleri gerektiren kütüphaneleri projenize güvenle entegre edebilirsiniz.

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 dört gün boyunca geliştirilen örnek uygulamayı belgeler; eğitim yüz yüze veya online verilebilir ve kurumsal gruplara özel olarak uyarlanabilir.

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

REACT NATIVE EĞİTİMİ

Eğitim Hakkında

Neden Bu Eğitim?

Anahtar Konular

Ön Koşullar

Eğitim İçeriği

React Native Mimarisi

Çekirdek Bileşenler

Hooks ile Durum ve Etki

Flexbox ile Stil

React Navigation

Context API ile Paylaşımlı Durum

Redux Toolkit ile Durum

Veri Çekme ve Önbellek

FlatList ile Verimli Listeler

Animated API ile Hareket

Reanimated ve Gesture Handler

Native Cihaz API'leri

Native Modül Entegrasyonu

Hata Ayıklama ve Performans

Test ve Kod Kalitesi

Derleme ve Mağaza Yayını

Eğitim Kazanımları

Kimler İçin Uygundur?

Sıkça Sorulan Sorular

Sertifikalandırma

Eğitim Bilgileri

Bu Eğitimle Birlikte Tercih Edilenler

.Net MAUI Eğitimi

.NET MAUI Temel Kavramları Eğitimi

Advanced Features of Ionic JavaScript & CLI Eğitimi

Cross-Platform Solutions in Visual Studio Eğitimi

Exploring Ionic JavaScript Basics, Layouts, & Navigation Eğitimi

Fundamentals of the Ionic Framework Eğitimi