React Native Dünyasına Genel Bakış

Merhabalar, bugün sizlere geleceğin mobil geliştirim yöntemi olabileceğini düşündüğüm React Native ve bununla ilgili genel kavramlardan bahsedeceğim.

Öncelikle React Native kavramını açıklamam gerekli tabiki de, React Native facebook tarafından geliştirilen bir mobil uygulama geliştirme platformudur. Aynı anda IOS ve Android uygulama geliştirme gibi mükemmel bir olanak sunmaktadır. Daha öncesinde Android uygulama geliştiren birisi olarak oldukça kullanışlı olduğunu söyleyebilirim. Aynı anda hem Android hem Ios platformda çalışabilecek mobil uygulama yazmak isteyenler rahatlıkla kullanabilirler.

React Native, facebook’un web tarafında kullandığı react sistemi üzerine inşaa edilmiş, javascriptin her zaman programlama hatası gibi görülen tarafına farklı bir yaklaşım göstermiş bir kütüphanedir aynı zamanda. Sanılanın aksine react native hybrid mobil uygulama geliştirme değildir. React javascriptini kullanarak geliştirilen has native mobile uygulamadır.

React Native kurulum için ihtiyaç duyulanları şöyle sıralayabilirim.

  • Nodejs
  • Android Studio
  • Android Sdk
  • Eslint
  • Front-end Ide.

Node js: Uygulama geliştirirken çok fazla kullanılan yardım aracıdır. Kullanılma amacı javascript kodunu makine koduna çevirmektir.

Android Studio:  Çok mecbur kalmadığım sürece kullanmayı pek sevmediğim ide’dir kendileri. Uygulamanın android kısmını ayrı olarak düzenlemek istediğimizde kullanabiliriz.

Android Sdk: En önemli kısımlardan birisidir. React Native, Android 6.0 (Marshmallow) sürümünü istemektedir.

Eslint: Uygulama geliştirme aşamasında çok fazla ihtiyaç duyulan eklentidir. Hataları derleme yapmadan yazım aşamasında görmemizi ve hız kazanmamızı sağlar.

Front-end Ide: Uygulama geliştirmek için ide olmazsa olmazlardandır. Ancak özel bir ide mevcut değildir. Öneri olarak Windows için Sublime Text ve Atom’u Mac için ise Xcode’u örnek olarak verebilirim.

React Native neden öğrenmeliyim diyenler için:

  1. React Native gerçekten ‘Native’ dir.
  2. Uygulamalarınızı uzaktan güncelleyebilirsiniz.
  3. Uygulama geliştirme hızını katlayabilirsiniz.
  4. Facebook gibi çok büyük bir firma React Native’i geliştiriyor. Daha da iyisi birçok uygulamasında bunu kullanıyor.
  5. Bir kere öğrenip pek çok platformda uygulama geliştirmeye imkan veriyor.
  6. React Native öğrenmesi gerçekten kolaydır.

gibi maddeler sıralayabilirim. Öğrenip öğrenmemek size kalmış tabiki de.

Kurulum için cmd üzerine aşağıdaki komutu yazmamız yeterlidir.

npm install -g react-native-cli

Yeni proje oluşturmak için ise aşağıdaki komutu yazmamız yeterlidir.

react-native init projeadi

Yukarıdaki komutu çalıştırdığımızda aşağıdaki gibi bir ekran ile karşılaşırız. Bu ekranda zaten bize bir sonraki run adımının nasıl olacağını söylemektedir.

Oluşturulan proje klasörüne girip aşağıdaki komutlardan birisini çalıştırdıktan sonra emülatör veya telefon üzerinde uygulama çıktısını görebiliriz.

react-native run-android

react-native run-ios

Yukarıdaki komutlardan android için olanı çalıştırıldığında aşağıdaki gibi bir ekran ile karşılaşırız. Uygulamanın sorunsuz bir şekilde çalıştığı ve emülatör bilgileri görünmektedir. Herhangi bir hata olursa o da burada görülebilecektir.

Uygulama run edilirken node js kısmı otomatik olarak çalışmaktadır. Bu ekran da aşağıda yer almaktadır. Bu node js üzerinden, uygulama dosyaları ile ilgili bilgiler görünmekte ve herhangi bir hata alır isekte bu hatanın kaynağı ile ilgili bilgilere erişebilmekteyiz.

Ben uygulama çıktısını genymotion üzerinde test ettim. Aşağıdaki gibi bir standart yeni proje ekranı ile karşılaşmaktayız. Yine bu ekranda da yapılabilecek işlemler hakkında bilgi verilmektedir. Bu bilgi verme işlemi de React Native’in güzel yanlarındandır.

İlk proje ile ilgili kaynak kodlarına bu GitHub linkinden ulaşabilirsiniz.

9 Comments
  • Posted at 19:48, 09/01/2018

    React-Native’in kendi websitesinin anasayfasına göremeyeceğim hiçbir şey göremiyorum yazınızda. Son derece yüzeysel, boşbeleş yazılmış.

  • Posted at 02:22, 07/02/2018

    React-Native’in kendi websitesinin anasayfasına göremeyeceğim hiçbir şey göremiyorum yazınızda. Son derece yüzeysel, boşbeleş yazılmış.

  • Posted at 02:23, 07/02/2018

    React-Native’in kendi websitesinin anasayfasına göremeyeceğim hiçbir şey göremiyorum yazınızda. Son derece yüzeysel, boşbeleş yazılmış.

  • Posted at 01:18, 08/02/2018

    React-Native’in kendi websitesinin anasayfasına göremeyeceğim hiçbir şey göremiyorum yazınızda. Son derece yüzeysel, boşbeleş yazılmış.

  • Sezen Aksu
    Posted at 14:54, 12/02/2018

    Emeğe her zaman saygılı olmak lazım, teşekkür etmesini bilmek lazım.
    Çok güzel olmuş teşkkür ediyorum.

  • Yurtseven Kardeşler
    Posted at 12:09, 25/02/2018

    Güzel ve anlaşılır bir yazı teşekkür ederim.

  • Haydar Dümen
    Posted at 02:46, 04/03/2018

    Güzel ve anlaşılır bir yazı teşekkür ederim.

  • Memati Baş
    Posted at 16:13, 12/08/2018

    React-Native’in kendi websitesinin anasayfasına gördüğüm şeyler fakat ingilizcem iyi olmadığı için pek anlayamamıştım. Bu döküman faydalı oldu. Teşekkürler.

  • Binali Yıldırım
    Posted at 16:22, 12/08/2018

    Fatih Portakal gibi lavuklara itibar etmeyiniz. Bazen büyük projelerde bile bir satır insanı günlerce uğraştırabilir. İhtiyaç duyduğumuz bilgi yüzeysel görünen bir dökümanın içinde de bulunabilir. Bir bit bile yazılımı çalışmaz hale getirebiliyorsa her doğru bilgi kırıntısı değerlidir.

Post a Comment

Comment
Name
Email
Website