Sunday, March 19, 2017

Membuat Mobile Apps dengan React Native

Introduction:
React Native adalah framework yang dikembangkan oleh Facebook untuk mengembangkan mobile apps (Android dan iOS) dengan menggunakan JavaScript. Library JavaScript yang digunakan dalam React Native based on React.js

Beberapa kelebihan dari React Native adalah aplikasi yang dibuat sama dengan native apps dalam penggunaannya. Kita hanya perlu mempelajari satu bahasa pemrograman, yaitu JavaScript untuk membuat aplikasi Android dan iOS. Selain itu, kita tidak perlu menghabiskan waktu banyak untuk melakukan compile ulang ketika pengembangan aplikasi. Dalam Android Studio dinamakan "instant run", namun hanya untuk pengembangan Android versi lolipop keatas.

Kekurangannya React Native masih relatif baru (rilis tahun 2015) sehingga masih sedikit tutorial React Native. Beberapa API native dari Android dan iOS belum semuanya supported, namun perkembangan React Native sangat cepat jadi mungkin kedepannya semua API akan supported.

Getting Started:

1. Windows
Untuk platform Windows, React Native hanya dapat mengembangkan aplikasi Android saja. Berikut adalah hal-hal yang diperlukan untuk melakukan instalasi:
  • Java, Android Studio, Genymotion (atau emulator Android lainnya)
  • Install chocholatey
  • buka cmd, lalu jalankan
choco install nodejs.install
choco install python2npm install -g react-native-cli 
  • setelah itu untuk membuat project jalankan:
react-native init NamaProject 
  • Untuk menjalankan aplikasinya, jalankan:

    cd NamaProject
    react-native run-android
2. MacOS
Berikut adalah hal-hal yang diperlukan untuk melakukan instalasi dalam platform MacOS:
  • iOS: XCode
  • Android: Java, Android Studio, Genymotion (atau emulator Android lainnya)
  • Install Homebrew
  • buka cmd, lalu jalankan
brew install node
brew install watchman
npm install -g react-native-cli
  •  Setelah itu untuk membuat project jalankan:
react-native init NamaProject
  • Untuk menjalankan aplikasinya, jalankan:
cd NamaProject
react-native run-android (untuk Android)
react-native run-ios (untuk iOS) 
Selanjutnya akan muncul aplikasi tersebut dalam emulator seperti ini,



Untuk membuat apps dengan React Native juga bisa mengunakan Visual Studio Code , cukup install extention "React Native Tools" nantinya akan ada pilihan untuk menjalankan code untuk Android atau iOS. Berikut adalah contoh isi dari direktori project React Native.





Kita hanya perlu edit file "index.ios.js" untuk membuat aplikasi iOS dan "index.android.js" untuk membuat aplikasi Android. Setelah edit code dalam file tersebut, jalankan command+R (MacOS) atau ctrl+R (Windows) untuk reload aplikasi pada emulator dengan instant.

Selamat mencoba dan Happy Coding :)

Referensi:

No comments:

Post a Comment