Install & Setup React Native di Mac OS

Install package manager Homebrew brew

Paste perintah berikut pada Terminal prompt.

/usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"

Install Xpre IDE

Download menggunakan link berikut atau mencarinya langsung melalui App Store Mac
https://developer.apple.com/download/

Catatan: Jika Anda sudah menginstal Xpre-beta.app bersama dengan versi production Xpre.app, pastikan Anda menggunakan versi production xprebuild tool. Anda dapat mengaturnya dengan menjalankan perintah berikut:

sudo xpre-select -switch /Applications/Xpre.app/Contents/Developer/

Install Android environment

  • Git git
    *Jika Anda telah menginstal Xpre, Git otomatis akan terinstal, jika tidak jalankan yang berikut ini:

    brew install git
  • JDK Versi terbaru
  • Android Studio
    Pilih Custom installation

    Pilih Performance dan Android Virtual Device

    Setalah proses install selesai, pilih Configure -> SDK Manager pada jendela “welcome” Android Studio.

    Pada jendela SDK Platforms, klik checkbox disamping Show Package Details dan di bawah pilihan Android 6.0 (Marshmallow), pastikan bahwa Google APIs, Intel x86 Atom System Image, Intel x86 Atom_64 System Image, dan Google APIs Intel x86 Atom_64 System Image sudah dicentang.

    Pada “tab menu” SDK Tools, klik checkbox disamping Show Package Details dan di bawah pilihan Android SDK Build Tools, pastikan bahwa Android SDK Build-Tools 23.0.1 sudah dicentang.
  • Environment Variable
    ANDROID_HOME

    Pastikan environment variable ANDROID_HOME sudah mengarah ke “path” folder Android SDK di komputer anda. Untuk melakukan itu, tambahkan ini ke ~/.bashrc, ~/.bash_profile anda (atau apa pun yang digunakan oleh shell komputer anda) kemudian re-open terminal anda:
    Jika anda sudah menginstall SDK tanpa Android Studio, mungkin “path” SDK anda akan seperti ini: /usr/local/opt/android-sdk

    export ANDROID_HOME=~/Library/Android/sdk

Dependency untuk Mac

Anda akan membutuhkan Xpre untuk compile ke iOS dan Android Studio untuk compile ke android, node.js, React Native CLI / command line tools, dan Watchman.
Saya merekomendasikan untuk menginstall node dan watchman menggunakan Homebrew.

brew install node
brew install watchman

Watchman adalah sebuah tool yang dibuat oleh Facebook untuk mengamati perubahan pada filesystem. Ini adalah opsional namun sangat disarankan agar anda menginstalnya untu efisiensi dalam pengembangan.

Di dalam Node sudah tersedia npm, sebuah tools yang digunakan untuk menginstall React Native CLI (command line interface).

npm install -g react-native-cli

Jika anda melihat terjadi permission error, coba dengan mode sudo:

sudo npm install -g react-native-cli.

Untuk iOS, cara termudah untuk menginstal Xpre adalah melalui App Store Mac. Dan untuk android download dan install Android Studio.
Jika Anda berencana untuk merubahan Java pre, kami merekomendasikan Gradle Daemon yang mempercepat proses “build”.

Testing instalasi React Native anda

Gunakan React Native command line tools membuat sebuah project React Native baru contoh “AwesomeProject”, kemudian jalankan react-native run-ios didalam folder baru yang tercreate secara otomatis.

react-native init AwesomeProject
cd AwesomeProject
react-native run-ios

Anda akan segera melihat aplikasi baru Anda berjalan di iOS Simulator. react-native run-ios hanyalah salah satu cara untuk menjalankan aplikasi anda, anda juga dapat menjalankannya langsung dari dalam Xpre atau Nuclide.

Modifikasi Aplikasi Anda

Sekarang Anda telah berhasil menjalankan aplikasi, mari kita modifikasi.

  • Buka index.ios.js atau index.android.js menggunakan text editor yang anda miliki dan edit beberapa baris code.
  • Klik Command ⌘ + R pada iOS Simulator anda untuk “me-reload” aplikasi anda dan lihatlah perubahan yang terjadi

Selamat! Anda berhasi menjalankan dan modifikasi aplikasi React Native pertama anda.

source: Getting Started – React-Native

Add a Comment

Your email address will not be published. Required fields are marked *