Membuat Aplikasi Android Sistem Informasi DesaKu - Part 4

Aplikasi Android Sistem Informasi Desaku ini merupakan tutorial Part 4, jadi jika anda belum mengikuti Part 3 diharapkan anda untuk mengikuti tutorial Part 3 terlebih dahulu untuk memudahkan anda dalam memahami tutorial Part 4 ini.

Pada  Part 1 dibagian langkah terakhir kita telah membuat sebuah project React Native menggunakan react-native ini namafolder jadi jika anda belum mengikuti tutorial Part 1  diharapkan anda mengikuti tutorial Part 1 terlebih dahulu.

Dibagian tutorial Part 4 ini saya menganggap anda telah mengikuti tutorial - tutorial part sebelum. Jadi karena pada Part 1 kita telah membuat project react native dengan nama folder DesaKu. Sekarang kita akan mencoba run project kita ke devices hp android langsung jadi ada beberapa hal yang perlu diperhatikan dan siapkan, seperti berikut ini.

• Pertama pastikan laptop atau komputer dan HP Android terhubung dengan satu jaringan internet, dalam pembuatan tutorial ini saya menggunakan wifi untuk koneksi internetnya, jadi intinya laptop atau komputer dan HP Android nya terhubung ke Satu Jaringan Wifi.
• Kemudian Siapkan Kabel USB Android, hubungkan HP Android dengan Laptop atau Komputer menggunakan Kabel USB.
• Setelah kabel USB kita hubungkan dengan Laptop atau Komputer agar HP Android bisa kita gunakan testing Aplikasinya maka kita perlu mengaktifkan Debugging USB di HP Android nya. Saya menggunakan HP Android Vivo mungkin untuk HP Merek Lain Sedikit Berbeda. Untuk mengaktifkan Debbugging USB melalui Pengaturan kemudian masuk ke menu Pengaturan Lainya kemudian masukan ke menu Tentang Ponsel, berikut tampilan nya.

Tentang Ponsel

• Kemudian cari Versi perangkat Lunak setelah ketemu, maka tekan beberapa kali sehingga muncul popup di bagian bawah Tidak perlu, Anda sudah ada dalam mode pengembang.

Mengaktifkan Opsi Developer / Pengembang

• Setelah Opsi Developer di Aktifkan, dan kita telah back ke menu Pengaturan Lainnya dan cari menu dan masuk ke opsi developer

Opsi Developer

• Selanjutnya akan masuk ke tampilan menu Opsi Developer cari dan enable Debugging USB

Mengaktifkan Debugging USB

• Setelah mengaktifkan Debugging USB, sekarang jalankan perintah ini  Untuk Mengecek HP Android nya apakah sudah siap digunakan atau belum untuk di Install Aplikasi Android dari project DesaKu.

adb devices

Cek Android

adb devices

• Sekarang masuk folder project DesaKu

cd DesaKu/

Folder Desaku

cd DesaKu

• Kemudian jalankan perintah berikut ini, perintah ini berfungsi untuk menginstal aplikasi Debug ke HP Android . Aplikasi Debug adalah merupakan aplikasi android yang dalam mode masih dalam pengembangan baik penambahan atau penghapusan sebuah fitur diaplikasi tersebut.

react-native run-android

Run Android

Run Android

• Tunggu proses install selesai dan perlu diingat proses install ini perlu koneksi internet untuk mengdownload package yang diperlukan untuk projectnya, jadi pastikan komputer atau laptop anda terkoneksi dengan internet.

Proses Instalasi

• Jika proses install selesai dan tidak ada kesalahan atau error, maka di HP Android akan otomatis terbuka aplikasi namun mungkin anda akan menemukan Error seperti ini.

Error

• Untuk mengatasinya dengan cara menjalankan server debug menggunakan perintah berikut npm start

npm start

Perintah Menjalankan Server Debug

Perintah Menjalankan Server Debug

Loading Server Done

• Sekarang pastikan Laptop atau Komputer dan HP Android nya terhubung atau terkoneksi dengan jaringan Wifi. Setelah itu buat Tab Baru dengan cara Klik File kemudian Klik New Tab .

Tab Baru

• Selanjutkan kita akan mengecek IP Address Laptop atau komputer kita. IP Address adalah sebuah alamat pada setiap perangkat yang terhubung atau terkoneksi ke jaringan internet agar dapat berkomunikasi dengan perangkat lainnya. Perintah untuk mengecek IP Address di Linux Ubuntu yaitu dengan menjalankan perintah berikut ifconfig.

ifconfig

Mengecek IP Address 

Mengecek IP Address 

• Berikut Detail Hasil dari menjalankan perintah ifconfig

Detail Hasil Ifconfig

• Setelah tampilnya detail hasil perintah ifconfig , maka kita cara nama adapter card wifi laptop atau komputer kita. Untuk nama Adapter Card Wifi Laptop saya adalaj wlp3s0. Nah di wlp3s0 terdapat inet 192.168.7.7 inilah yang dinamakan dengan IP Address yang terdiri dari angka saja dan perlu diingat IP Address ia bersifat dinamis jadi ketika laptop atau komputer di restart maka IP Address akan berubah. Kemudian anda hanya perlu mengecek dan mengingat IP Address tersebut.

IP Address

Kemudian kita kembali ke aplikasi yang telah kita install Aplikasi Debug di HP Android kita, Goyang Goyangkan HP Android maka akan tampil beberapa menu.

Menu

• Setelah Tampil Menu Tersebut, sekarang klik Settings

Pilih Settings

• Setelah anda memiliki Settings akan tampil beberapa menu, silakan anda ikuti petujuk digambar berikut.

Debug server host & port for device

• Kemudian akan tampil Pop Up maka masukan IP Address sesuai Laptop atau Komputer Anda dan Untuk Port disama saja.

Masukan IP Address dan Port

• Back dari Menu, kemudian Goyang - Goyangkan lagi HP Android nya ketika tampil Menu maka anda pilih Reload.

Reload Aplikasi

• Proses Loading Server Debug dan Tunggu Hinga Proses 100% selesai

server

• Berikut Tampilan Aplikasi Secara Default

Tampilan Default Aplikasi Android

Demkian Tutorial Part 4 ikuti juga tutorial Part 5 ya.

Catatan: tulisan ini dipindahkan dari cloudborneo.com, terbit pertama 11 Desember 2019.