# Setup di Laragon — CryptoEditorial

> **Catatan jujur**: Laragon dirancang untuk stack **PHP/Laravel + MySQL/PostgreSQL**.
> Stack aplikasi ini adalah **Python (FastAPI) + MongoDB + React** — bukan target utama Laragon.
>
> **Tapi**: Anda tetap bisa pakai Laragon sebagai **launcher / dashboard** untuk start/stop services
> (mirip XAMPP control panel). Caranya ada dua:
>
> - **Cara 1 — Pakai Laragon "Quick App"** (paling cocok): Laragon hanya jadi launcher untuk frontend; backend & MongoDB tetap di-install terpisah.
> - **Cara 2 — Bypass Laragon**: lebih simpel, jalankan dengan `start_all.bat` (lihat `INSTALL_WINDOWS.md`).
>
> Kalau Anda baru mulai, **rekomendasi: pakai Cara 2** dari `INSTALL_WINDOWS.md`. Lebih cepat dan reliable.
> Tapi kalau tetap mau Laragon, ikuti panduan ini.

---

## 1. Pasang Laragon

1. Download Laragon Full dari https://laragon.org/download/
2. Install dengan default settings, ekstrak ke `C:\laragon`
3. Buka Laragon → klik **Start All** → harus jalan tanpa error

---

## 2. Pasang Komponen Tambahan (yang Laragon TIDAK punya)

### a. Python 3.11+
1. Download dari https://python.org → centang **Add to PATH**
2. Verifikasi: buka cmd di Laragon (klik kanan ikon Laragon → **Laragon Terminal** atau **Cmder**)
   ```
   python --version
   pip --version
   ```

### b. Node.js & Yarn
1. Laragon biasanya **sudah include Node.js**. Cek:
   ```
   node --version
   npm --version
   ```
2. Install Yarn:
   ```
   npm install -g yarn
   ```

### c. MongoDB Community
Laragon tidak punya MongoDB native. Install terpisah:
1. Download MongoDB Community 7.x dari https://www.mongodb.com/try/download/community
2. Saat install, centang **"Install as Service"** ← penting
3. Verifikasi: `mongosh` di cmd harus masuk

---

## 3. Tempatkan Source Code

Extract source ke folder `www` Laragon:
```
C:\laragon\www\crypto-editorial-local\
```

Setelah itu, struktur:
```
C:\laragon\www\crypto-editorial-local\
├── backend\
├── frontend\
├── start_all.bat
└── ...
```

---

## 4. Setup Environment Variables

1. Masuk ke `backend/`, copy `.env.example` → `.env`
2. Edit `backend/.env` (lihat `INSTALL_WINDOWS.md` Section 3 untuk detail isi key)
3. Masuk ke `frontend/`, copy `.env.example` → `.env` (default sudah benar)

---

## 5. Cara Menjalankan via Laragon

### Opsi A — Pakai launcher native (paling reliable)

Ini cara paling bersih. Laragon cuma jadi tempat parkir code, tapi launching pakai batch script.

1. Buka Windows Explorer ke `C:\laragon\www\crypto-editorial-local\`
2. Klik 2x **`start_all.bat`**
3. Browser otomatis buka http://localhost:3000

Semua dependency diinstall otomatis pada first-run (~5-10 menit).

### Opsi B — Add Quick App di Laragon (untuk auto-detect URL)

Laragon punya fitur "Quick App" yang otomatis bikin pretty URL `http://crypto-editorial.test`. Tapi karena React app di-serve oleh `yarn start` (bukan static), kita perlu trik:

1. Edit `frontend/.env`, set port frontend ke 80 (kalau Apache Laragon di-stop), atau gunakan reverse-proxy
2. Atau cukup edit Hosts file (`C:\Windows\System32\drivers\etc\hosts`):
   ```
   127.0.0.1   crypto.test
   ```
3. Buka `http://crypto.test:3000`

**Honestly**: untuk dev local, http://localhost:3000 sudah cukup. Tidak perlu pretty URL.

### Opsi C — Build Production & Serve via Apache Laragon

Kalau Anda ingin Laragon Apache serve frontend (mode production):

1. Build frontend:
   ```cmd
   cd C:\laragon\www\crypto-editorial-local\frontend
   yarn build
   ```
   Hasilnya di folder `build/`

2. Buat virtual host di Laragon:
   - Klik kanan ikon Laragon → **Apache** → **sites-enabled** → **Auto VirtualHost**
   - Atau manual: buat file `C:\laragon\etc\apache2\sites-enabled\auto.crypto-editorial.conf`:
     ```
     <VirtualHost *:80>
         DocumentRoot "C:/laragon/www/crypto-editorial-local/frontend/build"
         ServerName crypto.test
         <Directory "C:/laragon/www/crypto-editorial-local/frontend/build">
             AllowOverride All
             Require all granted
             # SPA fallback
             FallbackResource /index.html
         </Directory>
     </VirtualHost>
     ```

3. Tambah ke Hosts:
   ```
   127.0.0.1   crypto.test
   ```

4. Update `frontend/.env` (sebelum build):
   ```
   REACT_APP_BACKEND_URL=http://localhost:8001
   ```
   Rebuild: `yarn build`

5. Restart Apache di Laragon. Buka http://crypto.test

6. Backend tetap dijalankan terpisah (lewat `start_backend.bat`).

⚠️ **Catatan**: Mode production ini **tidak hot-reload**. Cocok untuk deploy ke server, kurang nyaman untuk development.

---

## 6. Mulai & Stop Services

### Start (urutan):
1. **MongoDB** → Buka `services.msc` → cari "MongoDB Server" → Start (atau aktif otomatis kalau install as service)
2. **Backend** → Klik 2x `backend/start_backend.bat` → tunggu sampai muncul "Application startup complete"
3. **Frontend** → Klik 2x `frontend/start_frontend.bat` → tunggu sampai muncul "Compiled successfully"

Atau cukup klik `start_all.bat` → semuanya bareng.

### Stop:
- Tutup semua jendela cmd, ATAU
- Klik 2x `stop_all.bat`

---

## 7. Tips Pakai Laragon

- **Laragon Terminal** (Cmder): klik kanan icon Laragon → **Laragon Terminal**. Lebih nyaman daripada cmd biasa.
- **Auto-start di boot**: Settings Laragon → centang "Auto run when Windows starts"
- **Tail log backend**: jendela cmd backend sudah live-show log
- **MongoDB Compass**: GUI bagus untuk lihat data MongoDB. Connect ke `mongodb://localhost:27017`

---

## 8. Kenapa Tidak Pakai PHP-style Laragon?

Singkatnya: aplikasi ini bukan PHP. Stack-nya:
- Backend = Python FastAPI (perlu uvicorn / gunicorn server)
- Database = MongoDB (NoSQL, bukan MySQL)
- Frontend = React (Single Page App)

Laragon dirancang untuk PHP-Apache yang serve file langsung. Untuk Python, **harus ada process Python yang running terus** (uvicorn) — Laragon tidak punya manager built-in untuk ini.

Solusi terbaik: pakai `start_all.bat` yang Anda kelola sendiri (mirip XAMPP control panel manual).

---

## 9. Mau Lebih Pro? Pakai NSSM (jadikan Service Windows)

Kalau Anda mau backend & frontend auto-start saat Windows boot (tanpa harus klik bat tiap kali), pakai **NSSM**:

1. Download dari https://nssm.cc/download
2. Extract ke `C:\nssm\`
3. Install backend sebagai service:
   ```cmd
   cd C:\nssm\win64
   nssm install CryptoEditorialBackend
   ```
   GUI muncul → isi:
   - Path: `C:\Python311\python.exe`
   - Startup directory: `C:\laragon\www\crypto-editorial-local\backend`
   - Arguments: `-m uvicorn server:app --host 0.0.0.0 --port 8001`
4. Install service-nya, lalu start: `nssm start CryptoEditorialBackend`

Sama untuk frontend (path = `C:\Program Files\nodejs\yarn.cmd`, args = `start`).

Setelah ini, backend & frontend muncul di **services.msc** dan auto-start saat Windows boot.

---

## 10. Bantuan Lebih Lanjut

- **Troubleshooting umum**: lihat `INSTALL_WINDOWS.md` Section 6
- **README umum**: lihat `README.md`
- **Issue di GitHub** (kalau ada repo): buat issue dengan log error

Selamat ngulik di Laragon! 🚀