MENU

React Native ve Expo: Mobil Uygulama Geliştirmede İki Önemli Rota

Mobil uygulama geliştirirken, React Native'in esnekliğini mi tercih edersiniz yoksa Expo'nun kullanıcı dostu yaklaşımını mı? Bu yazıda, her iki platformun sunduğu avantajları ve dezavantajları derinlemesine ele alacağız.

September 11, 2023

Türkçe

Giriş

React Native ile mobil uygulama geliştirmede, Expo veya React Native CLI kullanma kararı önemlidir. Her ikisi de farklı avantajlar ve dezavantajlar sunar. Özellikle son yıllarda Expo’nun popülerliği artmıştır. Bu yazıda, Expo ve React Native CLI’nin öne çıkan yönlerini ve ne zaman hangisini tercih etmeniz gerektiğini ele alacağız. Dahili uygulama kullanım durumlarına özgü alternatif yaklaşımları da değerlendireceğiz. Hangi seviyede olursanız olun, bu kıyaslama size değerli bir perspektif sunar..

Expo Nedir?

Basitleştirilmiş Geliştirme Deneyimi Expo, React Native uygulamaları oluşturmak için bir çerçeve ve platformdur. Bir React Native projesinin kurulumu ve yapılandırılmasıyla ilgili bazı karmaşıklıkları soyutlayarak basitleştirilmiş bir geliştirme deneyimi sağlamayı amaçlamaktadır.

Expo nasıl çalışır?

Expo, derleme, dağıtım ve test süreçlerini değiştirerek React Native geliştirme sürecini tersine çevirdi. Expo özellikle dört ana bileşene sahiptir:

Expo: Hem iOS hem de Android için birleştirilmiş mantığa sahip React Native uygulamaları oluşturmaya yönelik açık kaynaklı bir çerçeve.

Expo Go: App Store ve Play Store’da herkese açık olarak bulunan ve taranabilir bir QR kodu aracılığıyla uygulamaları test etmeyi kolaylaştıran açık kaynaklı bir uygulama.

Expo Dev Clients: Expo Go’nun belirli mobil özelliklerle uyumsuz hale gelmesi durumunda kişiselleştirilmiş bir Expo Go uygulaması oluşturmak için açık kaynaklı bir çerçeve.

EAS ya da Expo Uygulama Hizmetleri: Expo Inc’in Expo tarafından yönetilen cihazlarda uygulama geliştiren ve bunları uygulama mağazasına gönderen bir dizi ücretsiz hizmet. EAS açık kaynak değildir ve Expo’nun birincil iş modelidir.

Expo’nun Avantajları

Hızlı Başlangıç: Birçok yazılım geliştirme çerçevesinin aksine, Expo, projenize başlamak için yerel kod bağımlılıklarına veya platforma özgü kurulumlara ihtiyaç duymaz. Bu, uygulamanızı kodlamaya hızlı bir şekilde başlamanıza izin verir ve daha hızlı bir geliştirme süreci sunar. Herhangi bir yerel kurulum veya bağımlılıkla uğraşmanıza gerek kalmaz, bu da özellikle geliştirme sürecinin başında çok zaman kazandırır.

Güncellemeler: Expo, uygulamanızın kullanıcılarınıza daha düzgün ve hızlı bir şekilde güncellemeler sağlama kabiliyetine sahiptir. Bu özellik sayesinde, kullanıcılarınız uygulamanın son versiyonunu almak için uygulama mağazasından indirmek zorunda kalmazlar. Bu, kullanıcıların uygulamanızı sürekli güncel tutmasını ve yeni özelliklerden yararlanmasını kolaylaştırır.

Önceden Oluşturulmuş Kütüphanelere Erişim: Expo, size geniş bir önceden oluşturulmuş kütüphane ve API yelpazesi sunar. Bu özellikler, anlık bildirimler, uygulama içi satın alımlar ve haritalar gibi uygulamanızın işlevselliğini genişletmek için kritik öneme sahip olabilir. Bu sayede, bu tür özellikleri kendiniz sıfırdan kodlamak zorunda kalmadan uygulamanızı geliştirebilirsiniz.

Basitleştirilmiş Oluşturma Süreci: Derleme süreci, uygulama geliştirme işleminin genellikle karmaşık ve zaman alıcı bir parçasıdır. Ancak, Expo bu süreci sizin için yönetir. Expo, uygulamanızı oluştururken derleme araçlarını yapılandırma ve yerel kodları derleme görevini sizin üzerinizden alır. Bu, geliştirme sürecini önemli ölçüde hızlandırır ve karmaşıklığı azaltır.

Kolaylık: Expo’nun bir başka büyük avantajı, iOS uygulamalarını oluşturmak için bir Mac’e ihtiyaç duymamanızdır. Kodunuzu oluşturabilir ve buluttaki Expo Application Services (EAS)’a dağıtabilirsiniz. Daha sonra bu kodu doğrudan uygulama mağazasına dağıtabilirsiniz. Bu, farklı platformlar için uygulama geliştirmeyi çok daha kolay ve erişilebilir kılar.

Yerel Fiziksel Cihaz: Expo, uygulamalarınızı herhangi bir fiziksel cihazda test etme yeteneği sunar. Expo Go uygulamasını cep telefonunuza yükleyebilir ve aynı ağ üzerinden bağlanarak uygulamanızı hem Android hem de iOS cihazlarda test edebilirsiniz. Bu, uygulamanızın farklı cihazlarda nasıl performans gösterdiğini görmek için harika bir yol sağlar.

Expo’nun Dezavantajları

Güncel Native Sürümler: Expo genellikle React Native ve belirli diğer kütüphanelerin en son sürümlerini desteklemede geride kalır. Bu gecikme, Expo’nun uyumluluğu ve stabiliteyi sağlama süresinden kaynaklanmaktadır. Bu, geliştiricilerin bu kütüphanelerin en son sürümlerindeki yeni özelliklerden ve iyileştirmelerden faydalanamayabileceği anlamına gelir, ta ki Expo kendi SDK’sini güncelleyene kadar.

Yükseltme Yolu: Bir geliştirici Expo’dan çıkmak (yani, standart bir React Native projesine geçmek) istiyorsa, bu süreç oldukça karmaşık ve zaman alıcı olabilir, özellikle de uygulama Expo’nun API’lerine ve hizmetlerine ağırlıklı olarak dayanıyorsa.

Daha Uzun App Store İnceleme Süreci: Expo ile oluşturulan uygulamalar, Expo platformunun getirdiği ek karmaşıklık nedeniyle genellikle App Store inceleme sürecinden daha uzun sürer.

Sınırlı Arka Plan Çalıştırma: Sandbox’lu çevresi nedeniyle, Expo’nun arka plan görevlerinde bazı kısıtlamaları vardır. Daha gelişmiş arka plan işleme ihtiyacı olan uygulamalar için bu önemli bir dezavantaj olabilir, örneğin ses çalma veya konum güncellemeleri gibi.

React Native CLI

React Native Command Line Interface (CLI), React Native uygulamalarını başlatmak, çalıştırmak ve oluşturmak için kullanılan bir araçtır. Expo’nun aksine, bu araç doğrudan React Native’in yerel API’lerine ve platform özelliklerine tam erişim sağlar.

React Native CLI nasıl çalışır?

React Native CLI, React Native uygulamalarını başlatmak için kullanılan standart bir araçtır. Yeni bir uygulama başlatmak için, geliştiricinin komut satırından ilgili komutları çalıştırması yeterlidir. Projenin başlatılmasının ardından, geliştirici yerel ortamını, iOS ve Android için SDK’ları da içerecek şekilde yapılandırmalıdır.

React Native CLI’nin Avantajları

Tam Kontrol: React Native CLI, geliştiricilere React Native’in yerel koduna doğrudan erişim imkanı sunar. Bu, daha özelleştirilebilir uygulamalar oluşturmanıza ve platforma özgü özellikleri tam olarak kullanmanıza olanak tanır.

Güncellemeler: Geliştiriciler, React Native’in en son sürümünün özelliklerini, iyileştirmelerini ve yamalarını hemen kullanabilirler.

Daha Geniş Kütüphane Desteği: Geliştiriciler, yerel modülleri doğrudan entegre edebilir ve React Native ile uyumlu olan herhangi bir üçüncü taraf kütüphanesini kullanabilirler.

React Native CLI’nin Dezavantajları

Kurulum Karmaşıklığı: React Native CLI kullanarak bir proje başlatma, özellikle yerel ortam ayarları ve platform özellikleri için gereksinimleri karşılamak adına daha karmaşık bir süreçtir.

Daha Fazla Bakım: React Native’in standart sürümünü kullanarak uygulama geliştirdiğinizde, kütüphanelerin uyumluluğunu ve uygulamanın genel sağlamlığını manuel olarak yönetmeniz gerekebilir.

Daha Yüksek Öğrenme Eğrisi: Yeni başlayanlar için, React Native’in doğrudan kullanımı, Expo’nun sunduğu basitleştirilmiş deneyime kıyasla daha dik bir öğrenme eğrisi sunabilir.

Platforma Özgü Kod: React Native CLI ile geliştirilen uygulamalar bazen platforma özgü kod içerebilir. Bu, aynı kod tabanı üzerinde hem iOS hem de Android için uygulama geliştirirken bazen sorunlara yol açabilir.

Expo’nun Native Tarafta Çalışma Mekanizması

1. Expo SDK:

Expo, kendi SDK’sına sahiptir. Bu SDK, birçok popüler native modülü içerir. Örneğin; kamera erişimi, hızlanmaölçer, dosya sistemi ve daha fazlası. Ancak, Expo’nun sunduğu modüllerin dışında bir modüle ihtiyaç duyarsanız, doğrudan Expo ile bu modülü kullanamazsınız.

2. Standalone Uygulama:

Expo ile oluşturulan projeler, Expo Go uygulaması içinde hızla test edilebilir. Uygulamanızı yayınlamak istediğinizde ise “standalone” bir uygulama olarak derleyebilirsiniz. Bu, hem Android APK’sı hem de iOS IPA’sı oluşturmanıza olanak tanır.

3. Limitasyonlar:

Expo ile geliştirme yaparken, sadece Expo SDK’sında bulunan modülleri kullanabilirsiniz. Bu, belirli özelleştirmelere veya derinlemesine native özelliklere ihtiyaç duyduğunuzda bir kısıtlama olabilir.

4. Eject Mekanizması:

Eğer Expo’nun sınırlamaları sizin için problem oluşturuyorsa, projenizi “eject” ederek normal bir React Native CLI projesine dönüştürebilirsiniz.

React Native CLI’nin Native Tarafta Çalışma Mekanizması

1. Tam Kontrol:

React Native CLI, React Native’in saf formudur ve geliştiricilere native kod üzerinde tam kontrole sahip olma imkanı sunar. Bu, her iki platform (iOS ve Android) için özelleştirilmiş kod eklemenizi sağlar.

2. Native Modüller:

React Native CLI ile çalışırken, herhangi bir üçüncü taraf native modülünü doğrudan ekleyebilirsiniz. Bu, özellikle topluluk tarafından geliştirilen veya özel iş gereksinimleriniz için yazılmış modülleri kullanmak istediğinizde faydalıdır.

3. Platform Özgü Derlemeler:

React Native CLI, platform özgü derleme araçlarıyla (Xcode ve Android Studio) doğrudan entegre olur. Bu, platforma özgü özelliklerin, yapılandırmaların ve optimizasyonların derinlemesine yönetilmesine olanak tanır.

4. Boyut ve Performans Optimizasyonları:

Mobil uygulama geliştirmede performans ve uygulama boyutu, kullanıcı deneyimi için oldukça kritik faktörlerdir. Expo ve React Native CLI kullanarak oluşturulan uygulamaların optimizasyonunda izlenebilecek bazı yönergeler şunlardır:

Expo:

  1. Minify ve Uglify: Expo, projenizi oluştururken otomatik olarak kodunuzu minify ve uglify eder. Ancak, bu işlemi özelleştirmek isterseniz, app.json dosyanızda bazı ayarları değiştirebilirsiniz.

  2. Gereksiz Modülleri Kaldırın: Expo, birçok yerleşik modülle birlikte gelir. Eğer bu modüllerin hepsini kullanmıyorsanız, SDK’nın eski sürümlerini kaldırarak uygulamanızın boyutunu azaltabilirsiniz.

  3. Resim Optimizasyonu: Resimleri sıkıştırarak ve gerektiğinde SVG formatını kullanarak uygulamanızın genel boyutunu önemli ölçüde azaltabilirsiniz.

React Native CLI:

  1. ProGuard: Android için, ProGuard’ı kullanarak kodunuzu obfuscate edebilir ve gereksiz Java kodunu kaldırabilirsiniz. Bu, uygulamanızın boyutunu azaltırken aynı zamanda kodunuzu daha güvende tutar.

  2. Hermes: Facebook tarafından geliştirilen Hermes JavaScript motorunu kullanarak React Native uygulamanızın başlangıç süresini ve paket boyutunu azaltabilirsiniz.

  3. Gereksiz Kütüphaneleri Kaldırın: node_modules klasörünü düzenli olarak gözden geçirin ve projenizde kullanmadığınız kütüphaneleri kaldırarak hem uygulama boyutunu hem de bellek kullanımını optimize edin.

  4. Asetleri Sıkıştırın: Uygulamanızda kullanılan resimler, videolar ve diğer medya dosyalarını sıkıştırarak uygulama boyutunu azaltabilirsiniz.

Genel Öneriler:

  1. Lazy Loading: Sadece ihtiyaç duyulan bileşenleri ve kütüphaneleri yüklemek için “lazy loading” tekniğini kullanarak uygulamanızın başlangıç hızını optimize edin.

  2. Derinlemesine Profil Analizi: React Native’in yerleşik profil analizi araçlarını kullanarak uygulamanızdaki darboğazları tespit edin ve performans sorunlarını giderin.

  3. Güncel Tutun: Hem Expo hem de React Native CLI sürekli olarak güncellenmektedir. En son sürümleri kullanarak en iyi performans ve en düşük uygulama boyutunu elde edin.

Expo ve React Native CLI, React Native uygulamaları oluşturmak için iki popüler yaklaşımdır. Expo, kurulumu kolay ve hızlı başlangıç için idealdir, ancak native kod üzerinde tam kontrol sağlamaz. Diğer yandan, React Native CLI, geliştiricilere native kod üzerinde tam kontrole sahip olma avantajı sunar. Bu, özellikle platforma özgü gereksinimleri olan projeler için yararlıdır.

Optimizasyon açısından, hem Expo hem de React Native CLI, uygulama boyutunu ve performansını iyileştirmek için farklı yönergeler ve araçlar sunar. Bu yönergeler, uygulamanın hızını artırmak, boyutunu azaltmak ve genel kullanıcı deneyimini optimize etmek için kritiktir.

Sonuç olarak

React Native ile mobil uygulama geliştirme süreci, kullanılan araçlara (Expo veya React Native CLI) bağlı olarak farklı avantajlar ve sınırlamalar sunar. Geliştiricilerin, projelerinin özel gereksinimlerine en uygun yaklaşımı seçmeleri önerilir. Umarım React Native CLI ve Expo hakkında daha fazla bilgi edinmişsinizdir. Okuduğunuz için teşekkür ederim.

Bir sonraki yazıda görüşene kadar, hoşça kalın 🙂

React Native

React

Expo

Mobile App Development

Ömer Esmer

Front-End Developer

HQ

Maslak Mah. AOS 55. Sok.
B Blok Apt. No: 4 / 542
Sarıyer / İstanbul 34475

R&D

Üniversite Mah. Sarıgül Sok.
No: 37 / 1 İç Kapı No: 91
Avcılar / İstanbul 34320

© 2024 - All rights reserved

HQ

Maslak Mah. AOS 55. Sok.
B Blok Apt. No: 4 / 542
Sarıyer / İstanbul 34475

R&D

Üniversite Mah. Sarıgül Sok.
No: 37 / 1 İç Kapı No: 91
Avcılar / İstanbul 34320

© 2024 - All rights reserved

HQ

Maslak Mah. AOS 55. Sok. B Blok Apt. No: 4 / 542
Sarıyer / İstanbul 34475

R&D

Üniversite Mah. Sarıgül Sok. No: 37 / 1 İç Kapı No: 91 Avcılar / İstanbul 34320

© 2024 - All rights reserved