Tips Bekerja dengan React Native

Efisiensi proses dan waktu pengembangan aplikasi

Imam Sutono
PasuruanDev
3 min readJul 27, 2019

--

Ada beberapa keuntungan yang akan kamu dapatkan ketika membangun aplikasi mobile menggunakan framework yang lagi hits ini. Buat kamu yang biasanya pake native, mungkin kamu akan ngerasain lamanya proses pengembangan karena setiap ada perubahan kode, kamu harus running ulang aplikasi kamu di Android Studio, dan buat yang pake laptop dengan spesifikasi biasa, bakal kerasa banget nunggu aplikasi ke-install di perangkat yang rasanya udah kayak nunggu doi bisa peka ke kita :’D

React Native hadir menawarkan pendekatan baru yang bikin proses pengembangan aplikasi mobile menjadi lebih cepat dan mudah. Update tampilan dan logika aplikasi tanpa harus Run and Build jadi salah satu kunci. Tentunya masih ada banyak lagi fitur lain yang disediakan.

Jadi teman-teman, aku mau berbagi sedikit tips nih yang bisa kita lakukan untuk optimasi proses pengembangan aplikasi React Native agar supaya lebih cepat dan efisien.

Oke, terus gimana caranya gimana?

Pertama yang harus kamu lakukan adalah goyang hp kamu (iya goyang). Kemudian akan muncul beberapa opsi menu, pilih menu Dev Settings.

Dev Settings

Lalu, akan muncul halaman baru dengan beberapa menu yang berkaitan dengan pengaturan development aplikasi. Gulir ke bawah dan pilih menu Debug server host & port for device.

Debug server host & port for device
Debug server host & port for device

Selanjutnya, kamu akan diminta untuk memasukkan alamat IP dari laptop atau komputer yang kamu gunakan untuk coding, dan jangan lupa untuk memberi :port dibelakang alamat IP yang kamu masukkan. Contohnya:

Penjelasan:

192.168.1.29 adalah alamat IP dari laptop

8081 adalah port yang digunakan untuk menjalankan React Native packager

Tentunya, kedua perangkat (ponsel dan laptop) harus terkoneksi pada jaringan yang sama ya.

Daaan, selamat. Sekarang kamu bisa koding React Native tanpa harus nyambungin ponsel mu ke laptop dengan kabel data. Eits, tapi ada lagi loh yang bikin proses development jadi lebih cepat. Yaitu, adanya fitur Live Reload di React Native.

Maksudnya gimana? Fitur ini memungkinkan aplikasi untuk me-reload kode terbaru yang tersimpan tanpa harus kita goyang hp kemudian klik Reload terlebih dahulu. Jadi, begitu kita simpan kode kita, maka aplikasi akan otomatis memperbarui dirinya dengan kode yang baru kita simpan tadi.

Cara aktifinnya gimana? Kembali kamu harus goyang ponsel kamu lagi, terus pada opsi menu, pilih Enable Live Reload.

Enable Live Reload

Nah, saya memakai fitur Debug server host & port for device dan juga Live Reload untuk koding aplikasi React Native. Dari yang saya rasakan, hal sederhana ini mampu membuat proses development jadi lebih cepat dan efisien.

Jadi, boleh banget loh tips sederhana ini kamu implementasikan di proses kerja kamu. Semoga bisa mempermudah proses kamu dalam ngode dan bikin si bos makin kesemsem sama hasil kerja kamu yang makin cepet dan oke tentunya.

Btw tanya dong, kamu punya cara lain untuk optimasi proses development di React Native? Cerita di komen dong ;D

--

--

Imam Sutono
PasuruanDev

Web Dev @detikcom | PasuruanDev Community Manager | Photography Enthusiast