React Native, Bun ve Expo ile Hızlı Mobil Uygulama Geliştirme Rehberi

Günümüzün rekabetçi mobil uygulama pazarında hız, maliyet etkinliği ve yüksek performans vazgeçilmez unsurlar haline geldi. Peki, hem iOS hem de Android için tek bir kod tabanıyla, geliştirme sürecini maksimum seviyede hızlandırarak, performanstan ödün vermeden nasıl mobil uygulamalar geliştirebiliriz? İşte bu noktada, React Native, Bun ve Expo üçlüsü devreye giriyor ve size eşsiz bir geliştirici deneyimi sunuyor. Bu rehberde, bu güçlü kombinasyonla modern bir React Native projesi oluşturmanın tüm inceliklerini adım adım keşfedeceğiz.

Mobil uygulama geliştirme ekosistemi sürekli evriliyor. Eskiden her platform (iOS ve Android) için ayrı ayrı kod yazmak zorunda kalırken, React Native gibi çapraz platform çözümleri bu durumu kökten değiştirdi. Tek bir JavaScript/TypeScript kod tabanıyla her iki platforma da native görünümlü uygulamalar geliştirebilme yeteneği, geliştiriciler için zaman ve kaynak açısından büyük bir tasarruf sağlıyor. Ancak, bu avantajlara rağmen, büyük projelerde başlangıç kurulumu, paket yönetimi ve derleme süreleri gibi konular bazen geliştirici deneyimini olumsuz etkileyebiliyordu. İşte tam da bu sorunlara çözüm getirmek için Bun ve Expo devreye giriyor.

React Native, Facebook tarafından geliştirilen açık kaynaklı bir framework olup, web geliştiricilerinin React bilgileriyle native mobil uygulamalar oluşturmalarını sağlar. Native komponentler sayesinde uygulamalar, platforma özgü UI öğeleriyle doğal bir his ve performans sunar. Ancak React Native’in saf haliyle bile bazı zorlukları vardır; örneğin, native modül entegrasyonu veya karmaşık derleme süreçleri. Expo, bu zorlukları basitleştiren, React Native üzerine kurulu bir araç ve hizmetler koleksiyonudur. Expo CLI ile hızlıca proje başlatabilir, bir Expo Go uygulamasıyla anında cihazınızda test edebilir ve hatta bulut tabanlı derleme hizmetleriyle uygulamalarınızı kolayca yayınlayabilirsiniz. Expo, özellikle yeni başlayanlar ve hızlı prototipleme yapmak isteyenler için inanılmaz bir kolaylık sunar. Geliştirici deneyimini (DX) merkeze alarak, karmaşık native modül yapılandırmalarını otomatikleştirir ve çoğu durumda manuel müdahaleye gerek bırakmaz.

Son olarak, sahneye çıkan Bun, JavaScript/TypeScript runtime, bundler, test runner ve paket yöneticisi olarak hepsi bir arada bir araçtır. Node.js’e modern ve ultra hızlı bir alternatif olarak tasarlanan Bun, özellikle paket yükleme ve uygulama çalıştırma sürelerinde önemli iyileşmeler vaat ediyor. Zig programlama dilinde yazılmış olması ve performans odaklı tasarımı sayesinde, geliştirme sürecindeki bekleme sürelerini minimuma indirir. Örneğin, npm install veya yarn install komutlarının dakikalar sürdüğü büyük projelerde, bun install ile bu süreler saniyelerle ifade edilebilir. React Native ve Expo ile birleştiğinde, Bun; projenizin başlatılmasından, paket yönetimine, hatta test süreçlerine kadar her aşamada size olağanüstü bir hız avantajı sağlar. Bu sinerji, sadece geliştirme verimliliğini artırmakla kalmaz, aynı zamanda daha akıcı ve keyifli bir geliştirme deneyimi sunar. Kısacası, bu üçlü, modern mobil uygulama geliştirmenin yeni standardını belirliyor. Artık uzun derleme süreleri veya karmaşık kurulumlarla boğuşmak zorunda değilsiniz; sadece kod yazmaya ve yenilikçi uygulamalar geliştirmeye odaklanabilirsiniz. Bu güçlü teknoloji kombinasyonu sayesinde, fikirlerinizi çok daha kısa sürede hayata geçirebilir ve mobil dünyaya hızlı bir giriş yapabilirsiniz.

Geliştirme Ortamınızı Nasıl Kurarsınız?

Yeni bir React Native projesine başlamadan önce, bilgisayarınızda gerekli geliştirme araçlarının kurulu olduğundan emin olmalısınız. Bu bölüm, Bun ve Expo ile sorunsuz bir React Native geliştirme deneyimi için adım adım ortam kurulumunu ele alacaktır. İlk olarak, Bun runtime’ı kurmanız gerekecek. Bun, sadece bir paket yöneticisi değil, aynı zamanda bir JavaScript runtime’ı olduğu için Node.js’e alternatif olarak çalışır. Eğer halihazırda Node.js kuruluysa, Bun’ı kurmak genellikle sorun yaratmaz, çünkü Bun kendi ekosistemini izole bir şekilde yönetebilir.

Bun kurulumu için terminalinizi açın ve aşağıdaki komutu çalıştırın:

curl -fsSL https://bun.sh/install | bash
    

Bu komut, Bun'ı sisteminize indirir ve yükler. Kurulum tamamlandıktan sonra, Bun'ın doğru bir şekilde yüklenip yüklenmediğini kontrol etmek için sürüm bilgisini sorgulayabilirsiniz:

bun --version
    

Eğer sürüm numarasını görüyorsanız, Bun başarıyla kurulmuş demektir. Sıradaki adım, Expo CLI'ı kurmaktır. Expo CLI, Expo projelerini oluşturmak, yönetmek ve çalıştırmak için kullanılan komut satırı aracıdır. Geleneksel olarak npm veya yarn ile kurulurdu, ancak Bun'ı paket yöneticisi olarak kullanacağımız için, onu Bun ile kuracağız. Bu, tüm geliştirme sürecinizin Bun ekosisteminde kalmasını sağlar ve olası uyumluluk sorunlarını minimize eder.

bun add global expo-cli
    

Bu komut, Expo CLI'ı global olarak yükleyecektir. Global kurulum, CLI'ı herhangi bir dizinden doğrudan kullanmanızı sağlar. Kurulumun ardından Expo CLI'ın çalıştığından emin olmak için aşağıdaki komutu kullanabilirsiniz:

expo --version
    

Bu kurulum adımlarıyla birlikte, React Native, Bun ve Expo ile çalışmaya hazır bir geliştirme ortamına sahip olacaksınız. Kurulumun basitliği, bu teknolojilerin geliştirici dostu yaklaşımının bir göstergesidir. Ortamınızın hazır olması, projenizin ilk satır kodunu yazmaya başlamanız için size sağlam bir temel sunar. Unutmayın ki, modern geliştirme süreçlerinde araçların doğru ve etkin kullanımı, projenizin başarısı için kritik öneme sahiptir. Bu bağlamda, Bun'ın sağladığı hız ve Expo'nun sunduğu kolaylıklar, geliştirme deneyiminizi önemli ölçüde iyileştirecektir. Bu sayede, kurulum ve yapılandırma gibi zaman alıcı süreçler yerine, uygulamanızın temel işlevselliğine ve kullanıcı deneyimine odaklanabilirsiniz.

Bun ve Expo ile Yeni Bir React Native Projesi Nasıl Başlatılır?

Geliştirme ortamımızı başarıyla kurduktan sonra, sıra geldi bu güçlü üçlüyü kullanarak yeni bir React Native projesi oluşturmaya. Geleneksel React Native projelerinden farklı olarak, Bun ve Expo ile proje başlatmak hem daha hızlı hem de daha sorunsuz bir deneyim sunar. Expo, projenin temel yapısını ve gerekli tüm bağımlılıkları sizin için otomatik olarak hazırlar, Bun ise bu bağımlılıkların inanılmaz bir hızla yüklenmesini sağlar. Bu kombinasyon, dakikalar süren kurulum işlemlerini saniyelerle sınırlayarak size zaman kazandırır ve anında kod yazmaya başlamanıza olanak tanır.

Yeni bir Expo projesi oluşturmak için terminalinizi açın ve projenizi oluşturmak istediğiniz dizine gidin. Ardından aşağıdaki komutu çalıştırın:

bun create expo-app my-bun-expo-app
    

Bu komut, my-bun-expo-app adında yeni bir dizin oluşturacak ve içine temel bir Expo projesi iskeleti kuracaktır. bun create komutu, standart npx create-react-app veya yarn create next-app benzeri bir işlev görür ancak Bun'ın kendi paket yöneticisi ve runtime'ı üzerinden çok daha hızlı çalışır. Komutu çalıştırdığınızda, Expo size bir şablon seçeneği sunabilir. Genellikle "Blank (TypeScript)" veya "Blank (JavaScript)" seçeneği ile başlamak en iyisidir, çünkü bu, projenize en yalın haliyle başlamanızı sağlar ve ihtiyaçlarınıza göre şekillendirmenize olanak tanır. Seçiminizi yaptıktan sonra, Bun gerekli tüm Node.js modüllerini ve Expo bağımlılıklarını inanılmaz bir hızla yüklemeye başlayacaktır. Bu adım, özellikle büyük bağımlılıklara sahip projelerde Bun'ın gerçek gücünü gösterir.

Kurulum tamamlandığında, projenin dizinine geçiş yapın:

cd my-bun-expo-app
    

Şimdi, uygulamanızı başlatmak için aşağıdaki komutu kullanabilirsiniz:

bun start
    

Bu komut, Expo geliştirme sunucusunu başlatacaktır. Sunucu başladığında, terminalinizde bir QR kodu göreceksiniz. Bu QR kodunu telefonunuzdaki Expo Go uygulamasıyla tarayarak uygulamanızı anında cihazınızda çalıştırabilirsiniz. Expo Go, sanal bir cihaz veya emülatör kullanmaya gerek kalmadan gerçek cihaz üzerinde uygulamanızı test etmenin en hızlı yoludur. Ayrıca, geliştirme sunucusu bir web arayüzü de sunar; bu arayüzden emülatörleri başlatabilir veya uygulamanızı web tarayıcısında görüntüleyebilirsiniz.

Bu basit adımlarla, Bun ve Expo'nun sunduğu hız ve kolaylıkla tam teşekküllü bir React Native projesini başlatmış olursunuz. Artık karmaşık yapılandırma dosyalarıyla uğraşmak yerine, doğrudan uygulamanızın mantığını ve arayüzünü geliştirmeye odaklanabilirsiniz. Bu, özellikle proje başlangıç aşamasında motivasyonu yüksek tutmak ve hızlıca bir prototip ortaya çıkarmak için çok değerlidir.

Uygulama Geliştirme Temelleri: İlk Komponentler ve Stylingle Nasıl Çalışılır?

Projemizi başarıyla başlattıktan sonra, sıra geldi uygulamanızın temel yapı taşlarını oluşturmaya: Komponentler ve stil. React Native, React felsefesine dayanır ve her şeyin bir komponent olduğu prensibini benimser. Bu bölüm, temel komponentlerin nasıl oluşturulacağını, verilerin nasıl yönetileceğini ve uygulamanıza modern bir görünüm kazandırmak için stillendirmenin nasıl yapılacağını adım adım açıklayacaktır.

React Native'de bir UI öğesi, bir JavaScript fonksiyonu veya sınıfı olarak tanımlanan bir komponenttir. Bu komponentler, kullanıcı arayüzünüzün atomlarıdır ve bir araya gelerek daha karmaşık UI'lar oluştururlar. Projenizin ana giriş noktası genellikle App.js veya App.tsx dosyasıdır. Bu dosya, uygulamanızın kök komponentini içerir. Aşağıda basit bir Hello World komponenti örneği bulunmaktadır:

// App.tsx
import React from 'react';
import { StyleSheet, Text, View } from 'react-native';

export default function App() {
  return (
    
  );
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: '#f0f0f0',
    alignItems: 'center',
    justifyContent: 'center',
  },
  title: {
    fontSize: 28,
    fontWeight: 'bold',
    color: '#333',
    marginBottom: 10,
  },
  subtitle: {
    fontSize: 18,
    color: '#666',
  },
});
    

Bu örnekte, View bir div'e benzerken, Text bir paragraf veya metin öğesine benzer. StyleSheet.create yöntemi, stilleri tanımlamak için kullanılır ve performans optimizasyonu sağlar. React Native'in stil sistemi, CSS'e benzer ancak bazı farklılıkları vardır; örneğin, tüm özellikler camelCase olarak yazılır ve birim belirtmeye gerek yoktur (varsayılan olarak pikseldir). flex: 1 özelliği, komponentin mevcut alanı tamamen kaplamasını sağlar, bu da responsive tasarımlar için temel bir yaklaşımdır. alignItems ve justifyContent ise Flexbox modelini kullanarak içeriklerin yatay ve dikey hizalanmasını kontrol eder.

Şimdi daha dinamik bir örnekle devam edelim. Bir state kullanarak metni değiştiren basit bir sayıcı komponenti oluşturalım:

// components/Counter.tsx
import React, { useState } from 'react';
import { StyleSheet, Text, View, TouchableOpacity } from 'react-native';

interface CounterProps {
  initialValue?: number;
}

export function Counter({ initialValue = 0 }: CounterProps) {
  const [count, setCount] = useState(initialValue);

  const increment = () => setCount(prevCount => prevCount + 1);
  const decrement = () => setCount(prevCount => prevCount - 1);

  return (
    
  );
}

const counterStyles = StyleSheet.create({
  container: {
    marginTop: 20,
    alignItems: 'center',
    padding: 20,
    backgroundColor: '#fff',
    borderRadius: 10,
    shadowColor: '#000',
    shadowOffset: { width: 0, height: 2 },
    shadowOpacity: 0.1,
    shadowRadius: 3.84,
    elevation: 5,
  },
  countText: {
    fontSize: 36,
    fontWeight: 'bold',
    color: '#4a4a4a',
    marginBottom: 15,
  },
  buttonContainer: {
    flexDirection: 'row',
    gap: 15, // Bun'ın modern JS desteği ile artık gap kullanabiliriz!
  },
  button: {
    backgroundColor: '#007bff',
    paddingVertical: 12,
    paddingHorizontal: 25,
    borderRadius: 8,
  },
  buttonText: {
    color: '#fff',
    fontSize: 18,
    fontWeight: '600',
  },
});
    

Bu Counter komponenti, useState hook'unu kullanarak count adında bir state değişkeni tanımlar. TouchableOpacity ise dokunma olaylarını algılayan ve basıldığında görsel bir geri bildirim sağlayan bir butondur. Bu komponenti App.tsx içine import edip kullanabiliriz:

// App.tsx
import React from 'react';
import { StyleSheet, Text, View } from 'react-native';
import { Counter } from './components/Counter'; // Counter komponentini import ettik

export default function App() {
  return (
    
  );
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: '#f0f0f0',
    alignItems: 'center',
    justifyContent: 'center',
    padding: 20, // Kenarlardan boşluk bırakmak için
  },
  title: {
    fontSize: 28,
    fontWeight: 'bold',
    color: '#333',
    marginBottom: 10,
    textAlign: 'center',
  },
  subtitle: {
    fontSize: 18,
    color: '#666',
    marginBottom: 30, // Sayıcıdan önce daha fazla boşluk
    textAlign: 'center',
  },
});
    

Bu adımlarla, temel React Native komponentlerini oluşturma, state yönetimi ve stillendirme hakkında güçlü bir başlangıç yapmış olursunuz. Projenizin bu temel yapı taşları üzerinde yükseldiğini göreceksiniz. Expo'nun hızlı yeniden yükleme özelliği sayesinde, yaptığınız her değişikliği anında cihazınızda veya emülatörünüzde gözlemleyebilirsiniz, bu da geliştirme sürecini son derece akıcı hale getirir.

Gelişmiş Geliştirme Teknikleri: Performans, Native Modüller ve Dağıtım

Temel bir React Native uygulaması oluşturmayı öğrendikten sonra, sıra daha karmaşık konulara ve uygulamanızın gerçek dünya senaryolarında nasıl daha verimli çalışacağına odaklanmaya gelir. Bu bölümde, performans optimizasyonundan, Expo'nun sağladığı esnek native modül entegrasyonuna ve uygulamanızın dağıtım süreçlerine kadar ileri düzey konuları ele alacağız. Bu bilgiler, uygulamanızın sadece çalışmasını sağlamakla kalmayacak, aynı zamanda kullanıcılarınıza üst düzey bir deneyim sunmasına yardımcı olacaktır.

Performans Optimizasyonu ve Bun'ın Katkısı

Mobil uygulamalarda performans kritik öneme sahiptir. Yavaş açılan, takılan veya pil ömrünü hızla tüketen uygulamalar kullanıcılar tarafından hızla terk edilir. React Native uygulamalarının performansını artırmak için birkaç temel strateji vardır:

• Gereksiz Yeniden Renderlamaları Önleme: React.memo, useCallback ve useMemo gibi React hook'larını kullanarak komponentlerin sadece ihtiyaç duyduklarında yeniden render edilmesini sağlayın. Bu, CPU döngülerinden tasarruf etmenizi sağlar.
• Büyük Listeler İçin Sanallaştırma: FlatList veya SectionList gibi komponentler, sadece ekranda görünen öğeleri render ederek binlerce öğe içeren listelerde bile akıcı bir performans sunar.
• Görsel Varlıkların Optimizasyonu: Resim ve videoları optimize edin, doğru formatları kullanın (örneğin WebP) ve büyük resimleri lazy load edin.
• Native Modüller ve JSI (JavaScript Interface): Performans açısından kritik operasyonlar için JavaScript'ten native koda geçiş yapmak bazen gerekli olabilir. Expo, bu süreci kolaylaştırır.

Bun ise bu performans tablosuna doğrudan geliştirme sürecinin hızıyla katkıda bulunur. Daha hızlı paket yükleme, daha hızlı test çalıştırma ve daha hızlı geliştirme sunucusu başlatma süreleri sayesinde, geliştirici döngünüz kısalır ve performansa odaklanacak daha fazla zamanınız kalır. Bun'ın kendisi de optimize edilmiş bir runtime olduğu için, JavaScript kodunuzu daha verimli çalıştırabilir, bu da uygulamanızın genel performansına dolaylı olarak etki edebilir. Özellikle CI/CD süreçlerinde Bun'ın hızı, test ve derleme aşamalarını dramatik bir şekilde kısaltabilir.

Native Modüller ve Expo Development Builds

Expo'nun en büyük avantajlarından biri, çoğu yaygın native modülü (kamera, konum, bildirimler vb.) "managed workflow" adı verilen yöntemle kolayca kullanmanızı sağlamasıdır. Ancak bazen, özel bir donanım entegrasyonu veya belirli bir üçüncü taraf SDK'sı gibi Expo'nun kapsamadığı native özelliklere ihtiyaç duyabilirsiniz. İşte bu noktada "development builds" ve "custom native modules" devreye girer.

Expo development build'leri, Expo Go'nun aksine, projenizin özel native modüllerini içerebilen, kendi özel geliştirme uygulamanızı oluşturmanıza olanak tanır. Bu, Expo'nun esnekliğini kaybetmeden, native özelliklere tam erişim sağlamanıza olanak tanır. Bir development build oluşturmak için eas build komutunu kullanmanız gerekir:

bun add eas-cli
eas build --platform android --profile development
eas build --platform ios --profile development
    

Bu komutlar, Expo Application Services (EAS) kullanarak uygulamanızın özel bir geliştirme sürümünü derler. Bu sürüm, projenizde tanımladığınız tüm native modülleri içerir ve Expo Go'da bulunmayan özellikleri test etmenizi sağlar. Daha sonra bu derlenmiş uygulamayı cihazınıza yükleyebilir ve geliştirme sunucusuna bağlanarak test edebilirsiniz.

Kendi native modüllerinizi oluşturmanız gerektiğinde, Expo'nun "config plugins" ve "modules" sistemi size yardımcı olur. Bu, native kod yazma yeteneğine sahip olsanız bile, bu modülleri kolayca bir Expo projesine entegre etmenizi sağlar. Karmaşık native kod yazmak yerine, React Native'in native bridge'ini kullanarak JavaScript'ten native fonksiyonları çağırabilir veya tam tersini yapabilirsiniz.

Uygulamanın Dağıtımı (Deployment)

Uygulamanız hazır olduğunda, onu son kullanıcılara ulaştırmanız gerekir. Expo ve Bun bu süreci de basitleştirir. EAS Build hizmeti, uygulamanızı hem iOS App Store hem de Google Play Store için derleyebilir ve yayınlayabilir.

eas build --platform android --profile production
eas build --platform ios --profile production
    

Bu komutlar, uygulamanızın yayınlanmaya hazır üretim sürümlerini oluşturur. EAS, sertifika yönetimi ve imzalama gibi karmaşık süreçleri otomatikleştirerek sizin için büyük bir yükü ortadan kaldırır. Derleme tamamlandıktan sonra, EAS paneli aracılığıyla uygulamanızın APK veya IPA dosyalarını indirebilir ve ilgili uygulama mağazalarına yükleyebilirsiniz. Bun'ın bu süreçteki rolü, eğer projenizde custom build script'ler veya otomasyonlar kullanıyorsanız, bunları çok daha hızlı çalıştırmasıdır. Ayrıca, Bun'ın entegre test runner'ı sayesinde, dağıtımdan önce tüm testlerin hızlıca koşulmasını sağlayarak güvenliği artırabilirsiniz. Bu entegre ve hızlı dağıtım süreci, uygulamanızın pazara sürülme süresini (time-to-market) önemli ölçüde kısaltır.

Özetle, Bun ve Expo ile geliştirme, sadece başlangıçtaki hızıyla değil, aynı zamanda projenizin tüm yaşam döngüsü boyunca sağladığı performans avantajları, esnek native entegrasyon seçenekleri ve kolaylaştırılmış dağıtım süreçleriyle de öne çıkar. Bu, modern mobil uygulama geliştirmenin geleceği için güçlü bir kombinasyondur.

Vaka Analizi: Küçük Bir İşletme İçin Etkinlik Yönetimi Uygulaması

Gerçek dünya senaryolarında Bun ve Expo'nun gücünü daha iyi anlamak için, hayali bir vaka analizine dalalım. Diyelim ki "Etkinlik Düzenleyici" adında küçük bir etkinlik planlama şirketi, müşterileri ve katılımcıları için modern bir mobil uygulama geliştirmek istiyor. Bu uygulama, etkinliklerin listelenmesi, detaylarının görüntülenmesi, bilet alımı, konum bilgileri ve bildirimler gibi temel özelliklere sahip olacak. Şirketin bütçesi sınırlı ve zaman çizelgesi dar. Bu durumda, React Native, Bun ve Expo kombinasyonu nasıl bir çözüm sunabilir?

Problemler:

1. Çapraz Platform İhtiyacı: Hem iOS hem de Android kullanıcılarına ulaşılması gerekiyor, ancak ayrı ayrı native uygulama geliştirme için yeterli kaynak yok.
2. Hızlı Pazara Giriş: Yaklaşan bir festival sezonu için uygulamanın mümkün olan en kısa sürede yayınlanması şart.
3. Performans: Uygulamanın akıcı çalışması, etkinlik detaylarını hızlı yüklemesi ve kullanıcı deneyimini olumsuz etkilememesi gerekiyor.
4. Geliştirici Deneyimi: Geliştirme ekibi küçük ve karmaşık kurulumlarla zaman kaybetmek istemiyor.
5. Native Özellikler: Konum (etkinlik mekanları için), bildirimler (etkinlik hatırlatıcıları), kamera (bilet QR kod taraması) gibi native özelliklerin entegrasyonu.

Bun + Expo + React Native Çözümü:

• Hızlı Proje Başlangıcı ve Geliştirme:

  Geliştirme ekibi, bun create expo-app etkinlik-app komutuyla projeyi anında başlattı. Bun'ın hızlı paket yüklemesi sayesinde bağımlılıklar saniyeler içinde kuruldu. Expo Go uygulaması ile, kodlama başlar başlamaz ilk ekranlar gerçek cihazlarda test edildi. Bu, feedback döngüsünü inanılmaz kısalttı ve tasarım kararlarının hızla alınmasını sağladı.

  
  bun create expo-app EtkinlikAPP
  cd EtkinlikAPP
  bun add expo-router react-native-safe-area-context react-native-screens expo-linking expo-constants
  bun start
              

  Bu adımlarla, temel navigasyon ve UI kütüphaneleri hızlıca eklendi.

• Çapraz Platform Geliştirme:

  Tek bir TypeScript kod tabanı kullanılarak hem iOS hem de Android için arayüzler ve iş mantığı geliştirildi. React Native'in Platform modülü sayesinde, gerekirse platforma özgü küçük ayarlamalar kolayca yapıldı, ancak genel olarak aynı kod her iki platformda da sorunsuz çalıştı. Bu, geliştirme maliyetlerini yarıya indirdi.

• Native Özellik Entegrasyonu:

  Expo'nun yönetilen iş akışı (managed workflow) sayesinde, konum, bildirimler ve kamera gibi native özellikler için hazır Expo modülleri (expo-location, expo-notifications, expo-camera) doğrudan projeye entegre edildi. Bu modüller, karmaşık native kod yazmaya veya platforma özgü izin yapılandırmalarıyla uğraşmaya gerek kalmadan çalıştı. Örneğin, konum izni almak ve kullanıcının mevcut konumunu çekmek birkaç satır kodla mümkün oldu.

  
  // Konum izni isteme ve alma örneği
  import * as Location from 'expo-location';
  
  async function getLocation() {
    let { status } = await Location.requestForegroundPermissionsAsync();
    if (status !== 'granted') {
      console.error('Konum izni reddedildi!');
      return;
    }
    let location = await Location.getCurrentPositionAsync({});
    console.log('Kullanıcı Konumu:', location);
  }
              

• Performans ve Kullanıcı Deneyimi:

  Etkinlik listeleri için FlatList kullanılarak sanallaştırma uygulandı, böylece binlerce etkinliği içeren listeler bile akıcı bir şekilde kaydırılabildi. Bun'ın hızlı runtime'ı, uygulamanın genel yanıt verme hızına katkıda bulundu. Resimler optimize edildi ve lazy loading stratejileri uygulandı.

• Kolay Dağıtım:

  Uygulama hazır olduğunda, EAS Build kullanılarak hem iOS hem de Android için üretim paketleri oluşturuldu. EAS'in otomatik imzalama ve bulut tabanlı derleme hizmetleri sayesinde, geliştirme ekibi karmaşık yayınlama süreçleriyle uğraşmak yerine doğrudan mağazalara yüklemeye odaklandı.

  
  eas build --platform all --profile production
              

  Bu komut, her iki platform için de dağıtıma hazır paketleri oluşturdu.

Sonuç:

"Etkinlik Düzenleyici" şirketi, Bun, Expo ve React Native kombinasyonu sayesinde uygulamasını rekor sürede (planlanandan %30 daha hızlı) ve bütçe dahilinde geliştirmeyi başardı. Uygulama, hem iOS hem de Android kullanıcıları tarafından büyük beğeni topladı ve festival sezonunda başarılı bir şekilde kullanıldı. Bu vaka analizi, bu teknolojilerin küçük ve orta ölçekli işletmeler için nasıl bir devrim niteliğinde olabileceğini açıkça göstermektedir. Geliştirme hızını artırırken, kaliteden ödün vermeden, modern ve işlevsel mobil uygulamalar sunmak artık hayal değil.

Sonuç: Mobil Gelişimin Yeni Hız Motoru

Mobil uygulama geliştirme dünyası, teknolojik ilerlemelerle her geçen gün daha da dinamik bir hal alıyor. Bu makalede ele aldığımız React Native, Bun ve Expo üçlüsü, bu dinamizme ayak uydurmakla kalmayıp, adeta yeni bir hız motoru görevi görerek geliştirici deneyimini ve proje teslim sürelerini radikal bir şekilde dönüştürüyor. React Native'in tek kod tabanıyla çapraz platform geliştirme yeteneği, Expo'nun bu süreci inanılmaz derecede kolaylaştıran araç ve hizmetleri, ve Bun'ın getirdiği benzersiz performans artışları bir araya geldiğinde, ortaya gerçekten etkileyici bir sinerji çıkıyor.

Özellikle projenin başlangıç aşamalarındaki kurulum hızından, günlük geliştirme döngüsündeki Fast Refresh avantajlarına, özel native modül entegrasyonu esnekliğinden, bulut tabanlı ve sorunsuz dağıtım süreçlerine kadar, bu kombinasyon her adımda geliştiricilere değerli katkılar sunuyor. Daha az karmaşık yapılandırma, daha az bekleme süresi ve daha fazla kodlama zamanı, Bun ve Expo'nun vaat ettikleri temel faydalardır. Bu sayede ekipler, altyapısal engellerle uğraşmak yerine, doğrudan kullanıcıların ihtiyaçlarına odaklanabilir, yenilikçi özellikler geliştirebilir ve piyasaya sürüm sürelerini önemli ölçüde kısaltabilirler. Gerek küçük startup'lar gerekse büyük ölçekli işletmeler için, bu teknoloji yığını, modern mobil uygulama geliştirmenin geleceği için güçlü bir yol haritası sunuyor. Artık, mobil dünyaya hızlı, performanslı ve sürdürülebilir uygulamalar kazandırmak her zamankinden daha erişilebilir durumda.

Sıkça Sorulan Sorular

• Bun, React Native projelerinde Node.js'in tamamen yerini alabilir mi?

  Evet, Bun, JavaScript runtime, paket yöneticisi ve bundler özellikleriyle React Native projelerinde Node.js'in birçok işlevinin yerini alabilir. Expo CLI gibi araçları bile Bun ile kurabilir ve çalıştırabilirsiniz. Ancak, bazı özel senaryolarda veya eski kütüphanelerde uyumluluk sorunları yaşanabileceğini unutmamak gerekir. Geniş çaplı projelerde geçiş yapmadan önce dikkatli testler yapılması önerilir.

• Expo Go uygulaması ile geliştirme yaparken native modül kısıtlamaları var mı?

  Evet, Expo Go uygulaması, sadece Expo SDK'sının içerdiği belirli native modülleri destekler. Eğer projeniz Expo SDK'sında bulunmayan veya kendi özel native modüllerinizi gerektiren bir özellik kullanıyorsa, Expo Go yerine "development build" veya "ejected" (prebuild) bir React Native projesi kullanmanız gerekecektir. Expo'nun managed workflow'u çoğu yaygın ihtiyacı karşılasa da, belirli native API'ler için özel bir build'e ihtiyaç duyulabilir.

• Bun'ın performans avantajları sadece paket yüklemede mi geçerli?

  Hayır, Bun'ın performans avantajları sadece paket yüklemeyle sınırlı değildir. Bun, aynı zamanda daha hızlı bir JavaScript runtime'ıdır ve kodunuzu Node.js'ten daha hızlı çalıştırabilir. Ayrıca, entegre bir bundler ve test runner sunar. Bu, uygulama başlatma süreleri, test çalıştırma süreleri ve genel geliştirme döngüsü üzerinde de olumlu etkilere sahiptir. Bu sayede, geliştirme süreci genel olarak hızlanır ve daha verimli hale gelir.

• Expo Development Build ile geleneksel "eject" işlemi arasındaki fark nedir?

  Geleneksel "eject" işlemi (şimdiki adıyla expo prebuild), Expo'nun yönetilen iş akışından çıkarak, projenizi standart bir React Native projesine dönüştürmenizi sağlar. Bu, native kod üzerinde tam kontrol sağlar ancak Expo'nun kolaylıklarından (bulut derleme, Expo Go desteği) vazgeçmenizi gerektirir. Development build ise, Expo'nun yönetilen iş akışının bir parçası olarak kalmanızı sağlar ancak kendi native modüllerinizi içerebilen özel bir geliştirme uygulaması oluşturmanıza olanak tanır. Yani, Expo'nun avantajlarından faydalanmaya devam ederken native esneklik kazanırsınız.

• Bu teknoloji yığını ile geliştirdiğim bir uygulamayı web'de de yayınlayabilir miyim?

  Evet, Expo, React Native uygulamanızı tek bir komutla web'e dönüştürme yeteneğine sahiptir. expo start --web komutu, uygulamanızı bir web uygulamasında çalıştırır. Bu, aynı kod tabanını kullanarak hem mobil hem de web platformları için uygulama geliştirmenizi sağlar (platforma özgü bazı uyarlamalar gerekebilir). Bu özellik, uygulamanızın erişimini genişletmek ve kullanıcı tabanınızı büyütmek için mükemmel bir fırsat sunar.