Introduction to React Native Eğitimi

Eğitim Hakkında

Bileşen temellerinden navigasyona, veri erişiminden yayına React Native yolculuğu

Introduction to React Native Eğitimi, JavaScript ve React mantığını bilen geliştiricilere tek kod tabanıyla iOS ve Android için uygulama geliştirmeyi öğretir. Katılımcılar JSX söz dizimini, çekirdek bileşenleri, props ve state yönetimini öğrenir; useState ve useEffect Hook'larıyla durum ve yan etkileri yönetir. Program Flexbox ile stil, React Navigation ile gezinme, FlatList ile listeler, fetch ile ağ erişimi ve native API'lerle cihaz yeteneklerini kapsar.

Süre ve Format

4 Gün. Her gün dört modül; tek bir örnek uygulama dört gün boyunca bileşenlerden navigasyona ve 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 öğ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?

🎯Tek kod iki platform

Aynı JavaScript kod tabanıyla hem iOS hem Android için çalışan, native görünümlü mobil uygulamalar geliştirmeyi öğrenirsiniz.

🧩React bilgisi avantajı

Bileşen, props ve Hook gibi React kavramları doğrudan geçerlidir; web bilginizi hızla mobil geliştirmeye taşırsınız.

🚀Hızlı geliştirme

Fast Refresh ile anında geri bildirim ve zengin kütüphane ekosistemiyle fikirlerinizi çok hızlı uygulamaya dönüştürürsünüz.

Anahtar Konular

react native eğitimireact native kursumobil uygulama geliştirme eğitimiçapraz platform mobil geliştirmereact native expojavascript mobil uygulamareact navigation eğitimiios android tek kodreact native başlangıçmobil geliştirme kursu

“React bilgisini cebinize taşıyan en kısa yol React Native'tir; bu eğitim tek kod tabanıyla iki platforma ulaşmayı öğretir.”

Ön Koşullar

Eğitimden en iyi verimi almak için faydalı bilgi ve kurulum

1

JavaScript bilgisi

Değişken, fonksiyon, dizi metotları ve ES6 ok fonksiyonları gibi modern JavaScript kavramlarına aşinalık gerekir.

2

Temel React mantığı

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

3

Node.js kurulumu

Node.js ve npm'in kurulu, Expo ya da React Native CLI ile proje çalıştırabilir durumda olması gerekir.

4

Test ortamı

Android emülatörü, iOS simülatörü veya Expo Go yüklü fiziksel bir cihaz test için yeterlidir.

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, Expo veya CLI ile proje kurar, JSX söz dizimini öğrenir ve çekirdek bileşenlerle ilk ekranı oluşturur.

Modül 1

React Native Mimarisi

JavaScript ile native köprü çalışma mantığı
Hibrit yerine gerçek native bileşen üretimi
iOS ve Android ortak kod tabanı yaklaşımı
Yeni mimari ve Fabric motoruna kısa bakış
React Native ve React farkının kavranması
Metro paketleyicinin rolü ve çalışması

Modül 2

Proje Kurulumu: Expo ve CLI

Expo ile hızlı proje başlatma ve avantajları
React Native CLI ile çıplak proje kurulumu
Expo Go ile cihazda anlık çalıştırma
Fast Refresh ile anında kod geri bildirimi
Proje klasör yapısının tanınması
Emülatör ve simülatör ile çalıştırma

Modül 3

JSX ve Söz Dizimi

JSX ile arayüzü JavaScript içinde tanımlama
İfade gömme ve koşullu render mantığı
Bileşenlerin fonksiyon olarak tanımlanması
props ile bileşene veri aktarımı
Liste render için map ile öğe üretimi
Liste öğeleri için key kullanımı ve önemi

Modül 4

Ç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
Button ve Pressable ile dokunma olayları

Günün hedefiKatılımcı yeniden kullanılabilir bileşenler yazar, useState ve useEffect ile durumu ve yan etkileri yönetir ve Flexbox ile platformlar arası tutarlı arayüz tasarlar.

Modül 1

Bileşen Tasarımı ve props

Yeniden kullanılabilir bileşen oluşturma
props ile veri ve davranış aktarımı
children ile iç içe bileşen yerleşimi
Bileşenleri küçük parçalara ayırma
props doğrulama ve varsayılan değerler
Sunum ve kapsayıcı bileşen ayrımı

Modül 2

State ve useState

useState ile bileşen içi durum tutma
Durum güncellemede değişmezlik ilkesi
Olaylara bağlı durum değişimi yönetimi
Form girdisini state ile kontrol etme
Birden fazla durum değişkeni yönetimi
Durum değişiminde yeniden render mantığı

Modül 3

useEffect ve Yaşam Döngüsü

useEffect ile yan etkilerin yönetimi
Bağımlılık dizisi ile tetiklenme kontrolü
Bileşen monte ve sökülme anlarını yakalama
Temizleme fonksiyonu ile kaynak bırakma
Veri çekmeyi effect içinde başlatma
Gereksiz effect tetiklemesinden kaçınma

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, FlatList ile verimli listeler oluşturur, fetch ile API'den veri çeker ve AsyncStorage ile veriyi yerelde saklar.

Modül 1

React Navigation

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

Modül 2

FlatList ile Listeler

FlatList ile büyük verinin verimli gösterimi
renderItem ve keyExtractor kullanımı
ScrollView yerine FlatList tercih sebebi
Aşağı çekerek yenileme desteği ekleme
Sona gelince sayfalı veri yükleme
Ayraç ve boş liste durumu tasarımı

Modül 3

fetch ile Ağ Erişimi

fetch ile REST API'den veri çekme
async ve await ile eşzamansız istek
JSON yanıtını ayrıştırıp state'e yazma
Yükleniyor ve hata durumu yönetimi
POST ile veri gönderme ve başlıklar
Zaman aşımı ve ağ hatası ele alma

Modül 4

AsyncStorage ile Yerel Veri

AsyncStorage ile anahtar değer saklama
Oturum ve kullanıcı tercihi tutma
Veriyi JSON olarak saklama ve okuma
Uygulama açılışında yerel veriyi yükleme
Veri silme ve güncelleme işlemleri
Yerel saklamanın sınırlarının kavranması

Günün hedefiKatılımcı izin yönetimini öğrenir, kamera ve konum gibi cihaz API'lerini kullanır, uygulamayı hata ayıklar ve iki platform için derleyip yayınlamayı uygular.

Modül 1

İzinler ve Cihaz API'leri

Çalışma zamanı izin isteme akışı
Expo veya native kamera erişimi
Konum bilgisi alma ve izin yönetimi
Cihaz depolamasından dosya seçme
Bildirim gönderme ve izin onayı
İzin reddi durumunun ele alınması

Modül 2

Native Modüller ve Paketler

Hazır native modül kütüphaneleri kullanımı
npm ile native paket kurulum süreci
iOS ve Android bağımlılık kurulum farkı
Köprü üzerinden native fonksiyon çağırma
Platforma özel kod yazma mantığı
Native modül seçerken dikkat edilecekler

Modül 3

Hata Ayıklama ve Performans

React Native Debugger ile hata ayıklama
console log ve Flipper ile inceleme
Yeniden render kaynaklı yavaşlığı bulma
useMemo ve useCallback ile iyileştirme
Liste performansını ölçme ve geliştirme
Yaygın hata ve çökme nedenlerinin çözümü

Modül 4

Derleme ve Mağaza Yayını

Expo EAS Build ile derleme alma
Android App Bundle oluşturma süreci
iOS için imzalama ve sertifika mantığı
Uygulama ikonu ve açılış ekranı ayarı
Play Store ve App Store listesi hazırlığı
Sürüm numarası ve güncelleme yönetimi

Eğitim Kazanımları

Program sonunda katılımcılar:

✅

Mimariyi kavrama

React Native'in native köprü mimarisini anlar, Expo ve CLI arasındaki farkı bilerek doğru proje kurulumu yaparsınız.

✅

Bileşen geliştirme

JSX ve çekirdek bileşenlerle yeniden kullanılabilir, temiz ve okunabilir arayüz bileşenleri yazabilirsiniz.

✅

Durum yönetimi

useState ve useEffect Hook'larıyla bileşen durumunu ve yan etkileri doğru ve verimli biçimde yönetirsiniz.

✅

Esnek tasarım

Flexbox ile farklı ekran boyutlarına uyum sağlayan, platformlar arası tutarlı arayüzler tasarlayabilirsiniz.

✅

Navigasyon kurma

React Navigation ile stack, tab ve drawer gezinmeyi kurar, ekranlar arası parametre aktarımını uygularsınız.

✅

Veri ve listeler

fetch ile API'den veri çeker, FlatList ile verimli listeler oluşturur ve AsyncStorage ile veriyi yerelde saklarsınız.

✅

Cihaz yetenekleri

İzin yönetimini uygular, kamera ve konum gibi native cihaz API'lerini uygulamanıza entegre edebilirsiniz.

✅

Derleme ve yayın

Uygulamayı hata ayıklar, iki platform için derler ve Play Store ile App Store'da yayınlamayı öğrenirsiniz.

Kimler İçin Uygundur?

JavaScript ve React temeline sahip olup mobil uygulama geliştirmeye geçmek isteyen web geliştiricileri
tek kod tabanıyla iki platforma uygulama yayınlamak isteyen yazılımcılar
bilgisayar bölümü öğrencileri için uygundur

Sıkça Sorulan Sorular

Bu eğitim kimler için uygundur?

JavaScript ve temel React bilgisi olup mobil uygulama geliştirmeye geçmek isteyen web geliştiricileri, tek kod tabanıyla iki platforma yayın yapmak isteyen yazılımcılar ve öğrenciler için uygundur. React ayrıntıları ve Hook'lar eğitimde yeniden ele alınır.

React Native ile hangi platformlara uygulama yapılır?

React Native ile tek bir JavaScript kod tabanından hem iOS hem Android için uygulama geliştirilir. Eğitimde çekirdek bileşenler, navigasyon ve cihaz API'leri her iki platformu da kapsayacak şekilde işlenir; derleme ve yayın süreçleri iki platform için ayrı ayrı anlatılır.

Expo mu yoksa React Native CLI mı kullanılıyor?

Eğitim öncelikle Expo ile hızlı başlangıcı gösterir; ardından React Native CLI ile çıplak proje kurulumu ve native modül entegrasyonu da ele alınır. Böylece hem hızlı prototipleme hem de ileride tam native erişim gereken durumlar için temel oluşur.

React Native ile Flutter arasındaki fark nedir?

React Native JavaScript ve React mantığıyla native bileşenler üretirken Flutter Dart diliyle kendi render motorunu kullanır. Bu eğitim React Native odaklıdır ve özellikle JavaScript ya da web geliştirme deneyimi olanlar için daha kısa bir öğrenme eğrisi sunar.

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 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

INTRODUCTION TO 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

Proje Kurulumu: Expo ve CLI

JSX ve Söz Dizimi

Çekirdek Bileşenler

Bileşen Tasarımı ve props

State ve useState

useEffect ve Yaşam Döngüsü

Flexbox ile Stil

React Navigation

FlatList ile Listeler

fetch ile Ağ Erişimi

AsyncStorage ile Yerel Veri

İzinler ve Cihaz API'leri

Native Modüller ve Paketler

Hata Ayıklama ve Performans

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