Tutorial - Cara membuat halaman Github dengan ReactJS | Deploy React App ke Github-Page

Cara membuat sebuah website statis (untuk resume atau portfolio), Kamu hanya perlu yang Gratis dan simpel, yaitu dengan menggunakan Github-Page dan ReactJS. (Tutorial lengkap)

Langkah demi langkah:

1. Pastikan Kamu sudah membuat Halaman Utama Github!
Example: https://USERNAME.github.io

2. Buatlah Repository baru untuk menampung kode deploy ReactJS

3. Clone Repository yang dibuat tersebut!
▶️ git clone https://github.com/USERNAME/my-repo-reactjs.git
* pastikan Kamu sudah meng-install Git dan mengatur Git-nya!

4. Buatlah APP React baru, ketik perintah berikut ini di CMD (pada path yang sudah ditentukan)
▶️ npx create-react-app my-name-app
* pastikan Kamu sudah meng-install NodeJS dan NPM sebelumnya!

5. Pindahkan folder .git dari folder my-repo-reactjs ke folder my-name-app
*(sebelumnya HAPUS folder .git yang ada di folder my-name-app jika ada)

6. Setelah membuat APP React baru, silakan masuk ke folder my-name-app via terminal/cmd:
▶️ cd my-name-app

7. Atur Config Git terlebih dahulu jika BELUM mengaturnya:
** ▶️ git config user.name "John Doe"
** ▶️ git config user.email [email protected]
* pastikan Kamu sudah meng-install Git dan mengatur Git-nya!

8. Lalu eksekusi perintah berikut ini:
...\my-name-app▶️ npm install gh-pages

9. Pada APP React, silakan Kamu buka file package.json, lalu tambah kan baris berikut ini:
"homepage": "your-custom-domain"*

Example:
{
"name": " my-name-app",
"version": "1.0.0",
"private": true,
"homepage": "https://USERNAME.github.io/my-repo-reactjs",
...
}

10. Lalu pada bagian "scripts" di file package.json, silakan tambahkan baris berikut ini:

"scripts": {
...
"predeploy": "npm run build",
"deploy": "gh-pages -d build"
}

11. Setelah itu silakan simpan, dan lanjutkan dengan mengeksekusi perintah berikut ini via terminal/cmd:
...\my-name-app▶️ npm run deploy

12. Secara otomatis pada menu Source (Settings▶️Options▶️GitHub Pages▶️Source) akan terpilih menjadi gh-pages branch.

13. Selesai, silakan buka link Repository yang sudah dibuat sebelumnya "https://USERNAME.github.io/my-repo-reactjs"

======================================================

- Github.com
- artikel sedang dibuat

======================================================

Social Media:
- Facebook: https://www.facebook.com/romadhon.byar
- Twitter: https://twitter.com/Romadhonbyar
- Instagram: https://www.instagram.com/romadhonbyar/

======================================================

Thanks for subscribe, like and share ?: https://goo.gl/D4hQqM