Deploy aplikasi reactjs kamu ke github pages dalam 5 menit

Salam, pada artikel kali ini kita akan men-deploy aplikasi react yang kamu punya ke github page agar kita dapat mengakses aplikasi yang sudah dibuat darimana saja kita berada..hehehe. bagi yang belum tahu apa itu github page silahkan lihat-lihat dulu disini. baiklah langsung saja ke inti topik nya:

Tahap 1: install gh-pages package sebagai "dev-dependency"

menggunakan npm: npm install gh-pages --save-dev

                        yarn: yarn add gh-pages --save-dev

Tahap 2: tambahkan properti "homepage" pada file "package.json"

Buka file "package.json"

"homepage": "https://{Github-username}.github.io/{Github-repo-name}"

file "package.json" setalah ditambahkan properti "homepage"

Tahap 3: menambahkan script deploy  pada file "package.json"

Pada properti "scripts" yang sudah ada tambahkan properti predeploy dan deploy properti

"scripts": {

//...

"predeploy": "npm run build",

"deploy": "gh-pages -d build",

//...

}

Perintah predeploy membantu memaketkan aplikasi react sementara perintah deploy mengaktifkan file yang dibundel.

Tahap 4: Membuat repository di github

(Lewati proses ini jika repository kamu sudah di inisialisasi)

Initialisasi: git init

Menambahkan sebagai remote: git remote add origin your-github-repo-url.git

Tahap 5: Men-deploy aplikasi react ke GitHub pages

npm: npm run deploy

yarn: yarn run deploy

Screenshot halaman terminal ketika proses deploy

Perintah di atas akan membuat sebut branch dengan nama gh-pages pada repositori github kamu. Branch ini menghostingkan aplikasi kamu dan sesuai properti homepage yang ditambahkan sebelum ke file "package.json", kemudian tunggu beberasa saat untuk melihat link kamu live.

Daaaaannnn eng ing engggg SELAMAT kamu telah berhasil men-deploy aplikasi kamu ke website URL yang sudah didefinisikan pada step 2....