Hosting React App to Heroku

ReactJS adalah salah satu framework JavaScript yang sangat populer di kalangan developer saat ini. Dalam membangun sebuah aplikasi web dengan React, kita memerlukan tempat untuk menjalankannya. Salah satu opsi hosting yang populer adalah Heroku. Berikut adalah panduan untuk hosting React App di Heroku.

Persiapan

Sebelum kita mulai hosting React App, pastikan kamu sudah melakukan beberapa persiapan diantaranya:

Pertama, pastikan kamu sudah memiliki akun Heroku. Kamu bisa mendaftar di website resminya secara gratis. Setelah mendaftar, pastikan kamu sudah memasang Heroku CLI di komputer kamu. Heroku CLI adalah command line interface untuk Heroku yang memungkinkan kamu untuk melakukan deployment dari komputer kamu.

Kedua, pastikan kamu sudah memiliki aplikasi React yang siap untuk dihosting. Pastikan kamu sudah mengelola dependencies menggunakan npm atau yarn. Jika kamu belum memiliki aplikasi React, kamu bisa membuatnya dengan menggunakan create-react-app.

Ketiga, pastikan kamu sudah mengelola source code kamu dengan Git. Git memungkinkan kamu untuk melakukan deployment dengan mudah dan aman.

Deployment

Setelah kamu selesai melakukan persiapan, kamu bisa mulai melakukan deployment React App kamu dengan Heroku. Berikut adalah langkah-langkahnya:

Pertama, buka terminal atau command prompt di komputer kamu. Masuk ke dalam folder aplikasi React kamu dengan menggunakan command cd.

Kedua, jalankan command heroku login untuk melakukan login ke Heroku CLI.

Ketiga, jalankan command heroku create untuk membuat aplikasi baru di Heroku. Heroku akan memberikan URL baru untuk aplikasi kamu. Simpan URL ini untuk digunakan nanti.

Keempat, jalankan command git add . untuk menambahkan semua file aplikasi kamu ke dalam Git. Jalankan command git commit -m “Initial Commit” untuk melakukan commit.

Kelima, jalankan command git push heroku master untuk melakukan deployment aplikasi kamu di Heroku. Proses ini akan memakan waktu beberapa menit tergantung ukuran aplikasi kamu.

Penyesuaian

Setelah proses deployment selesai, kamu bisa menyesuaikan aplikasi kamu dengan Heroku. Berikut adalah beberapa penyesuaian yang bisa kamu lakukan:

Pertama, kamu bisa menyesuaikan environment variabel kamu di Heroku. Environment variabel adalah variabel yang digunakan dalam aplikasi kamu. Kamu bisa mengubah environment variabel di Heroku dengan menggunakan command heroku config:set.

Kedua, kamu bisa menyesuaikan domain kamu di Heroku. Heroku memberikan subdomain secara gratis untuk aplikasi kamu. Namun, jika kamu ingin menggunakan domain kamu sendiri, kamu bisa membelinya di Heroku atau menggunakan domain yang sudah kamu miliki dengan cara menyesuaikan DNS record.

Ketiga, kamu bisa menyesuaikan scaling di Heroku. Scaling adalah proses menyesuaikan jumlah dyno yang digunakan oleh aplikasi kamu. Dyno adalah unit pemrosesan yang digunakan oleh Heroku. Kamu bisa menyesuaikan scaling di dashboard Heroku atau dengan menggunakan Heroku CLI.

Kesimpulan

Hosting React App di Heroku relatif mudah dan cepat. Dengan melakukan beberapa persiapan dan mengikuti langkah-langkah di atas, kamu bisa melakukan deployment aplikasi React kamu dengan mudah. Selain itu, kamu juga bisa menyesuaikan aplikasi kamu dengan Heroku dengan mengubah environment variabel, domain, dan scaling.