React Native uygulama geliştirmeye başlamadan önce, çalışma ortamınızı kurmanız gerekmektedir. İşte React Native projeleri geliştirmek için temel adımlar:

Node.js ve npm Kurulumu:

React Native projeleri, Node.js ve npm paket yöneticisi üzerine kuruludur. Resmi Node.js web sitesinden en son sürümü indirip kurabilirsiniz.

React Native CLI Kurulumu:

React Native projelerini oluşturmak ve yönetmek için React Native Command Line Interface (CLI) kullanılır. Terminal veya komut istemcisine şu komutu yazarak React Native CLI'yi yükleyebilirsiniz:

Java Development Kit (JDK) Kurulumu:

Android uygulamalarını geliştirmek için Java Development Kit (JDK) kurulu olmalıdır. Oracle JDK veya OpenJDK'yi tercih edebilirsiniz.

Android Studio Kurulumu:

Android uygulamalarını geliştirmek için Android Studio kullanılır. Android Studio'yu Android Developer adresinden indirebilir ve kurabilirsiniz. Kurulum sırasında SDK (Software Development Kit) ve Virtual Device seçeneklerini de işaretlemeniz gerekebilir.

Xcode Kurulumu (yalnızca macOS için):

iOS uygulamalarını geliştirmek için Xcode kurulu olmalıdır. Xcode'u macOS App Store'dan veya Apple Developer adresinden indirebilirsiniz.

Yerel Emülatör veya Fiziksel Cihaz:

React Native projelerini çalıştırmak için bir emülatör veya fiziksel cihaz kullanmanız gereklidir. Android Studio veya Xcode içinde bir emülatör oluşturabilir veya bir fiziksel cihaz bağlayabilirsiniz.

React Native Projesi Oluşturma:

Terminal veya komut istemcisine giderek bir React Native projesi oluşturabilirsiniz. Örneğin:

Proje Dizin Yapısı ve Ayarlar:

Oluşturulan projenin dizin yapısına giderek, gerekli konfigürasyonları yapabilir ve projeyi çalıştırabilirsiniz.

Bu adımları takip ederek, React Native ile mobil uygulama geliştirmeye başlamak için gerekli olan temel çalışma ortamını oluşturabilirsiniz. Unutmayın ki bu adımlar platforma özgüdür (macOS için iOS geliştirme, Windows için Android geliştirme gibi). Platforma göre gereken ekstra adımları belirtilen kaynaklardan kontrol etmek önemlidir.

Proje Dizin Yapısı:

Oluşturulan proje dizinine giderek, proje dosyalarını ve dizin yapısını inceleyebilirsiniz. Tipik bir React Native proje dizin yapısı şu şekilde olabilir:

  • android/ ve ios/: Android ve iOS platformlarına özgü dosyaları içerir.
  • node_modules/: Projenin bağımlılıklarını içerir. Proje oluşturulduktan sonra bu dizindeki dosyaları ellememeniz önerilir.
  • src/: Uygulama kaynak kodları için kullanılan bir dizindir. Genellikle components/ ve screens/ altında bileşen ve ekran dosyalarını içerir.
  • App.js: Uygulamanın başlangıç noktasıdır. Uygulamanın ana bileşeni burada tanımlanır.
  • .gitignore: Git kullanırken yüklenmeyecek dosya ve dizinleri belirten bir konfigürasyon dosyası.
  • .prettierrc: Prettier ayarlarını içeren bir dosya. Prettier, kod düzenini otomatik olarak düzenlemek için kullanılır.
  • app.json: Uygulama yapılandırma ayarlarını içerir.
  • babel.config.js: Babel ayarlarını içeren dosya. Babel, ECMAScript 6+ kodunu uyumlu ECMAScript 5'e dönüştürmek için kullanılır.
  • index.js: Uygulamanın başlangıç noktasıdır. Genellikle App.js dosyasını içeri aktarır ve uygulamayı başlatır.
  • package.json: Proje bağımlılıklarını ve proje bilgilerini içerir.
  • README.md: Proje ile ilgili genel bilgileri içeren bir dokümantasyon dosyası.

Temel Konfigürasyon Ayarlar:

Bir React Native projesinin temel konfigürasyon ayarları şu dosyalarda yapılır:

  • package.json: Proje bağımlılıklarını ve script ayarlarını içerir.
  • app.json: Uygulama adı, versiyon numarası gibi genel ayarları içerir.

Bu dosyalarda projenizin ihtiyaçlarına göre gerekli konfigürasyonları yapabilirsiniz. Örneğin, uygulama adını, paket adını, sürüm numarasını ve benzeri bilgileri app.json dosyasında düzenleyebilirsiniz. Bağımlılıklarınızı ve scriptlerinizi ise package.json dosyasında yönetebilirsiniz.

Bu adımları takip ederek yeni bir React Native projesi oluşturabilir, proje dizin yapısını inceleyebilir ve temel konfigürasyon ayarlarını düzenleyebilirsiniz. Bu noktadan sonra uygulama geliştirmeye başlamak için src/ dizini altında bileşenler ve ekranlar oluşturabilir ve App.js dosyasını güncelleyerek uygulama akışını yönetebilirsiniz.

Yorum Yap

0 Yorum