# 🚀 Panduan Lengkap Deploy Aplikasi React.js + Backend (CI3 / CI4 / Express) + MySQL di cPanel Hosting

Panduan ini merinci langkah-langkah profesional untuk men-deploy aplikasi **React.js Frontend** yang terhubung dengan **Backend (CodeIgniter CI3/CI4 atau Node.js)** dan **Database MySQL** di **cPanel Hosting**.

---

## 📋 Ringkasan Arsitektur Deployment di cPanel
1. **Frontend (React.js):** Di-build di komputer lokal menjadi file statis (`index.html`, bundle JS, CSS) yang diletakkan di direktori publik cPanel (`public_html` atau folder sub-domain).
2. **Backend (CodeIgniter / Express API):** Ditempatkan di direktori server untuk menyediakan REST API endpoint.
3. **Database (MySQL):** Dibuat melalui **MySQL Database Wizard** dan di-import menggunakan **phpMyAdmin** berdasarkan file `database.sql` atau struktur tabel Anda.

---

## 🛠️ Langkah 1: Build Frontend React.js di Komputer Lokal
Sebelum di-upload ke cPanel, Anda perlu melakukan build agar React terkompilasi ke format statis:
1. Buka terminal di folder project Anda.
2. Jalankan perintah instalasi dan build:
   ```bash
   npm install
   npm run build
   ```
3. Folder `dist/` (atau `build/`) akan tergenerate berisi file siap produksi.

---

## 🗄️ Langkah 2: Setup Database MySQL di cPanel
1. Login ke **cPanel** hosting Anda.
2. Buka **MySQL Database Wizard**:
   - Buat nama database (contoh: `namadb_hotel`).
   - Buat user database dan password.
   - Berikan hak akses **ALL PRIVILEGES** kepada user tersebut.
3. Buka **phpMyAdmin** di cPanel:
   - Pilih database yang baru dibuat.
   - Klik tab **Import**, lalu pilih file `database.sql` dari project Anda.
   - Klik **Go** untuk mengimpor seluruh tabel (kamar, unit, reservasi, pengguna, dll).

---

## ⚙️ Langkah 3: Konfigurasi Backend (CodeIgniter / API)
1. Jika menggunakan CodeIgniter (CI3/CI4):
   - Sesuaikan konfigurasi koneksi database di file `.env` (untuk CI4) atau `application/config/database.php` (untuk CI3) dengan kredensial MySQL cPanel yang baru dibuat (`hostname = localhost`, `database`, `username`, `password`).
2. Pastikan file `.htaccess` aktif untuk mendukung URL rewriting di CodeIgniter dan React Router.

---

## 📂 Langkah 4: Upload File ke File Manager cPanel
1. Buka **File Manager** di cPanel, lalu akses direktori publik Anda (`public_html` atau folder sub-domain).
2. **Upload Frontend:**
   - Upload seluruh file dan folder yang ada di dalam folder `dist/` hasil build React langsung ke root `public_html`.
3. **Upload Backend & Database:**
   - Upload folder backend Anda (misal folder `sewabeli-ci3` atau file API Express) ke direktori server sesuai konfigurasi server.

---

## 🌐 Langkah 5: Konfigurasi `.htaccess` untuk React SPA Router
Karena aplikasi React menggunakan *Client-Side Routing*, agar tidak terjadi error **404 Not Found** saat halaman di-refresh, buat file `.htaccess` di dalam folder `public_html` dengan isi berikut:

```apache
<IfModule mod_rewrite.c>
  RewriteEngine On
  RewriteBase /
  RewriteRule ^index\.html$ - [L]
  RewriteCond %{REQUEST_FILENAME} !-f
  RewriteCond %{REQUEST_FILENAME} !-d
  RewriteRule . /index.html [L]
</IfModule>
```

---

## ✅ Langkah 6: Pengujian
Buka domain Anda di browser (`https://domainanda.com`). Sistem hotel management, manajemen kamar/unit, data pemesanan, dan sinkronisasi real-time kini sudah aktif berjalan di cPanel!