Minggu telah tiba kembali, saatnya membagikan ilmu yang sudah penulis praktikan dan sangat membantu proses pengerjaan aplikasi penulis, terutama saat sedang berhadapan dengan pengembangan aplikasi lintas platform yaitu Laravel dari PHP dan React Native dari Javascript, tunggu… kasus apa yang sedang penulis hadapi akhir-akhir ini?
Sedikit bercerita, saat ini penulis sedang mengembangkan aplikasi absensi yang tentunya sudah sangat pasti tidak lepas dari Authentication (tahu login dan logout? that’s it!), memang banyak tutorial yang tampil dan yang paling populer adalah mengintegrasikannya dengan Firebase, atau layanan luar lainnya. Juga kita tahu Firebase dan sejenisnya adalah layanan yang menyediakan kebutuhan pengembang aplikasi agar dapat fokus pada alur proses bisnisnya dan tidak usah pusing dengan proses backend yang ada pada modul Authentication. Tetapi teradapat persoalan disini, ialah bagaimana agar Aplikasi yang sudah kita buat dapat berjalan pada sistem yang kita buat rancang sendiri tanpa harus menggunakan layanan luar cakupan sistem buatan kita?, analoginya begini, dengan menaruh data diluar, berarti kita patuh terhadap Syarat dan Ketentuan pemanfaatan layanan yang disediakan, sementara calon client yang akan menggunakan aplikasi kita meminta data hanya pada lokasi yang mereka tentukan, kita tidak tahu apa yang terjadi pada data yang disimpan diluar, dan kalian tidak perlu berfikir sampai kesitu karena ada momennya tersendiri, untuk mencegah hal tersebut, penulis membuat backend yang memiliki skema database tersendiri serta penggunaan endpoint API yang menggebu-gebu didalamnya, dan juga jangan patah semangat hanya karena membuat Authentication di bahasa pemrograman favorit kalian tidak bisa (penulis juga siap tutor bila perlu hehe)
REST API Tutorial dimana-mana
Masih tidak terlepas dari konteks pengembangan, maka berdasarkan kesimpulan dari cerita diatas, tidak jarang perbedaan stack bahasa pemrograman kadang terpikirkan dan dianggap menjadi penghalang bagaimana aplikasi seharusnya dapat bekerja, gunakan layanan luar hanya pada saat pengujian sendiri yang notabene tidak banyak melibatkan pengguna, dan selalu ingat! gunakan data dummy yang selaras dengan data nyata ya. Dari yang penulis ketahui hingga sekarang, Ngrok dapat menjembatani komunikasi antar aplikasi yang memiliki perbedaan stack technology dan pada artikel ini penulis akan beritahu bagaimana cara install.
Penulis menggunakan sistem operasi Windows 11, tetapi kalian yang melihat artikel ini tidak perlu merasa sia-sia begitu karena konsep instalasinya mirip persis
Kita ketahui dulu apa itu Ngrok, Ngrok adalah sebuah tool yang sangat berguna untuk membuat tunnel atau terowongan ke dalam jaringan pribadi (local network). Dengan Ngrok, kita dapat dengan mudah mengakses aplikasi lokal dari server Ngrok melalui internet, kerennya lagi Ngrok dapat tetap beroperasi dengan keadaan firewall atau jaringan yang terproteksi.
Kasus seperti apa Ngrok digunakan? selain yang penulis jelaskan diatas yaitu uji Backend untuk aplikasi mobile, antara lain
- Preview Project Lokal, jika kalian punya project berbasis website, mau itu pakai framework atau plain HTML sekalipun bisa kalian tampilkan ke orang lain secara langsung tanpa harus stress upload project ke hosting atau panel
- Debug API pada lingkungan pengembangan, sebenarnya tidak harus harus ada unsur mobile atau web aplikasi didalamnya, penggunaan API dapat dilakukan oleh banyak perangkat sekarang, sampai perangkat yang diluar nalar pun perlu itu. Karena terdapat banyak “sesuatu” itu, Ngrok dapat membantu menjembatani komunikasi antar teknologi sama halnya pada kasus penulis diatas.
- Sebagai Solusi API Gateway, aplikasi yang jalan di production stage tentunya wajib memiliki skema keamanan, Ngrok dapat berperan pada bagian keamanan tersebut dengan teknologi mereka yang tentunya dapat berkontribusi efektif pada pengurangan anggaran perusahaan kalian bila perlu.
- Load Balancer, Secara konsep Ngrok dapat dijadikan titik alih jalur cadangan jika terjadi overload pada jalur utama, kalian bisa baca pada dokumentasi berikut, tentunya penggunaan Ngrok untuk hal tersebut tergantung situasi ya.
Langkah 1: Unduh Ngrok
Langkah pertama yang perlu kalian lakukan adalah mengunduh Ngrok dari situs resminya. Kalian bisa mendapatkan versi sesuai dengan sistem operasi yang Anda gunakan, baik Windows, macOS, atau Linux.
Halaman download Ngrok per Februari 2024
Lelah mencari link downloadnya? berikut penulis bantu dengan link berikut agar diarahkan ke halaman download seperti gambar diatas.
Langkah 2: Ekstrak File
Setelah selesai mengunduh, ekstrak file Ngrok ke dalam folder yang kalian inginkan. Penulis sarankan untuk meletakkannya di folder yang mudah diakses, seperti folder “Documents” atau “Desktop”.
Cara Melakukannya
Seharusnya untuk sistem operasi lain tidak rumit, gunakan unzip untuk linux, untuk yang MacOS (maaf tidak bermaksud lain-lain) silahkan baca di panduan berikut.
Hanya gambaran momen dimana ternyata yang dibutuhin sudah terinstall
Langkah 3: Buka Terminal
Buka terminal atau command prompt di komputer kalian. Pastikan kalian berada di direktori tempat kalian mengekstrak file Ngrok.
Menguji Ngrok dapat dijalankan
Dengan mengetik ngrok di lokasi tersebut, maka seharusnya muncul seperti diatas, sebagai informasi tambahan saja, keahlian khusus yang dibutuhkan untuk melakukan tindakan diatas adalah mengetahui perintah untuk pindah direktori dan konsepnya, sebagai bahan bacaan tambahan, silahkan merujuk kesini.
Langkah 4: Jalankan Perintah
Ketik perintah berikut ini untuk menjalankan Ngrok:
ngrok config add-authtoken TOKEN_AUTH
Ganti TOKEN_AUTH
dengan token otentikasi pribadi kalian, token tersebut kalian dapatkan dari akun Ngrok.
Instruksi untuk menambahkan auth token
Jika kalian belum menutup tab tadi saat membuka halaman Ngrok karena Google Chrome belum error kehabisan memory, bisa di scroll kebawah sedikit dan lihat instruksi seperti pada gambar diatas, silahkan registrasi di sana. Biasanya setelah registrasi, kalian akan dibawa ke halaman Setup & Installation, scroll kebawah sedikit token kalian akan tampil disitu dengan pola acak.
Langkah 5: Mulai Tunnel
Untuk memulai tunnel, jalankan perintah berikut:
ngrok http PORT
sesuaikan PORT
dengan situasi sekarang, misalkan ada aplikasi Laravel kalian yang berjalan pada port 8000 atau Codeigniter yang jalan pada port 8080, isi dengan ngrok http 8000
atau ngrok http 8080
.
Langkah 6: Akses Melalui URL Ngrok
Setelah tunnel aktif, Ngrok akan memberikan URL yang bisa gunakan untuk mengakses aplikasi yang jalan pada port tersebut melalui internet. Salin URL tersebut dan buka browser untuk mengaksesnya.
Tunggu, ada lagi…
Perlu diketahui juga bahwa penulis sangat menggebu-gebu menjelaskan tentang Laragon (Full Version, bukan Portable ya) di artikel sebelumnya, maka dari itu penulis tampilkan meme pada Langkah 2, sebenarnya Ngrok sudah ada pada Laragon jika kalian menggunakan terminal yang disediakan Laragon (Cmder), tetapi Ngrok yang ada pada Laragon adalah versi lama, kalian bisa cek pesan dengan kode error ERR_NGROK_121 yang tampil pada screenshot dibawah jika mencoba mengeksekusi nya.
Kalian yang merupakan pengguna Ngrok dari dulu pasti akan mendapatkan email berikut
Silahkan kalian lakukan Langkah 2, hanya saja destinasi ekstraksi tidak sebebas yang dikatakan kalimat diatas, taruh file ngrok tersebut ke direktori laragon > bin > ngrok
, timpa saja ngrok.exe
yang ada pada folder tersebut, lalu jalankan ngrok pada cmder.
Apakah Ada Alternatif lain?
Penulis berharap kalian tidak berfikir “buat apa sih ini author maunya nyuruh pakai Ngrok banget sampai artikel panjang lebar begini?” karena sebenarnya dari Laragon kemarin sudah terlampir Ngrok yang seharusnya tidak perlu repot melakukan pemasangan lagi untuk urusan yang menjadi fokus kali ini, tetapi selera tetap selera ya kan? dan masih banyak sebenarnya alternatif lain, berikut rekomendasi penulis yaitu
- localtunnel, menggunakan NodeJS sebagai “main” prosesnya, beruntung laragon memilki NodeJS yang bisa kalian integrasikan langsung ke Cmder
- LocalXpose, hadir dengan tampilan GUI dan CLI yang keren dan intuitif, banyak tindakan yang dapat dilakukan dalam satu jendela dan banyak OS yang support.
- Localhost.run, sesuai judulnya, jalankan localhost tapi jangan berharap fitur lebih, sebagai contoh menggunakan domain sendiri tidak akan bisa dilakukan, tapi menggunakan localhost.run adalah hal paling ter-simple yang pernah penulis coba
Kesimpulan
Berbagi lokal server keluar saat ini adalah hal yang lumrah dilakukan, melihat dari bagaimana Ngrok masih dikembangkan hingga saat ini dan terus menerus kelihatan terawat dan semakin baik, maka dari itu Penulis membuat artikel ini sekarang juga yang mana situasi seperti pengembangan aplikasi lintas platform membutuhkan Ngrok, dengan menggunakan kasus authentication dan penggunaan Ngrok untuk tunneling jaringan lokal. Juga sudah dibahas terkait tantangan dan solusi untuk menjalankan aplikasi tanpa bergantung pada layanan eksternal (luar). Penulis juga memberikan panduan langkah demi langkah tentang cara menginstal dan menggunakan Ngrok, dengan menekankan berbagai kasus penggunaannya, tetapi selalu ingat bahwa jangan sampai bocor alamat yang digenerate untuk menghindari hal yang tidak diinginkan tentunya, Happy Exploring anyone!