Retribusi/SETUP_LOCAL.md

Setup Lokal Development (Laragon/XAMPP)

Masalah: "Failed to fetch" di Localhost

Jika Anda mendapat error "Failed to fetch" saat mengakses:

http://localhost/retribusi_bapenda/retribusi%20(frontend)/public/index.html

Solusi

Opsi 1: Akses Langsung ke Public Folder (Recommended)

Karena document root seharusnya di folder public/, akses langsung ke:

http://localhost/retribusi_bapenda/retribusi%20(frontend)/public/index.html

Atau jika folder public/ sudah di-set sebagai document root:

http://localhost/index.html

Opsi 2: Setup Virtual Host di Laragon

1. Buka Laragon
2. Klik kanan pada folder project → Add Virtual Host
3. Set document root ke: C:\laragon\www\RETRIBUSI_BAPENDA\retribusi (frontend)\public
4. Set domain: retribusi.local (atau sesuai keinginan)
5. Restart Laragon
6. Akses: http://retribusi.local/index.html

Opsi 3: Gunakan PHP Built-in Server

Frontend:

cd "C:\laragon\www\RETRIBUSI_BAPENDA\retribusi (frontend)\public"
php -S localhost:8080

Backend API (PENTING - harus dengan router.php):

cd "C:\laragon\www\RETRIBUSI_BAPENDA\api-btekno\public"
php -S localhost:8000 router.php

Akses:

• Frontend: http://localhost:8080/index.html
• Backend API: http://localhost:8000 (dengan router.php)

Konfigurasi API

Pastikan file public/dashboard/js/config.js sudah benar untuk lokal:

// Untuk Laragon/Apache (path-based)
return 'http://localhost/api-btekno/public';

// ATAU untuk PHP built-in server
return 'http://localhost:8000';

Troubleshooting

Error: "Failed to fetch"

1. Cek path file: Pastikan file public/index.html ada
2. Cek document root: Pastikan server mengarah ke folder public/
3. Cek CORS: Pastikan backend API sudah allow origin http://localhost
4. Cek browser console: Lihat error detail di Developer Tools (F12)

Error: "Module not found"

1. Pastikan menggunakan ES6 modules (type="module" di script tag)
2. Pastikan path import benar (relative path dari file HTML)
3. Pastikan file JavaScript ada di lokasi yang benar

Error: "CORS policy"

1. Pastikan backend API sudah setup CORS untuk http://localhost
2. Cek file api/cors_handler.php atau api/cors-handler.php
3. Pastikan header Access-Control-Allow-Origin sudah di-set

Struktur Path yang Benar

retribusi (frontend)/
└── public/                    ← Document root
    ├── index.html            ← Login page
    └── dashboard/
        ├── dashboard.html
        ├── event.html
        └── js/
            ├── config.js
            ├── api.js
            └── auth.js

Quick Test

1. Buka browser
2. Akses: http://localhost/retribusi_bapenda/retribusi%20(frontend)/public/index.html
3. Atau setup virtual host dan akses: http://retribusi.local/index.html
4. Cek browser console (F12) untuk error detail