Panduan Deploy ke rezaprama.github.io/infraimpact

Untuk Reza — diasumsikan sangat awam GitHub. Tiga opsi tersedia: pilih satu. Target hasil akhir: dashboard live di https://rezaprama.github.io/infraimpact.

🟢 OPSI A — Web Browser saja (paling mudah, tanpa instal apa pun)

Cocok kalau Anda belum pernah pakai Git/terminal. Semua dilakukan di browser di github.com.

A1. Buka repo rezaprama.github.io Anda

Login ke https://github.com, lalu buka repo: https://github.com/rezaprama/rezaprama.github.io

A2. Buat folder infraimpact dan upload file pertama

1. Klik tombol Add file (kanan atas, sebelah tombol hijau Code) → Create new file.

2. Di kolom “Name your file…”, ketik persis:

   infraimpact/.nojekyll
   

   Tanda / akan otomatis membuat folder infraimpact/. File .nojekyll ini boleh kosong.

3. Biarkan isi file kosong. Scroll ke bawah → klik Commit changes… → Commit changes (hijau).

Sekarang folder infraimpact/ sudah ada di repo Anda.

A3. Upload sisa file (drag & drop)

1. Klik folder infraimpact di daftar file repo.
2. Klik Add file → Upload files.
3. Buka File Explorer Windows, buka folder E:\00 Claude\infraimpact-dashboard.
4. Pilih SEMUA file dan folder di dalamnya (Ctrl+A), lalu drag ke area “Drag files here” di browser.
   • Termasuk subfolder: assets/, data/, geo/, docs/, scripts/.
   • Termasuk file root: index.html, README.md, LICENSE, CITATION.cff, .nojekyll, dst.
5. Tunggu sampai semua file ter-upload (progress bar selesai). Untuk 571 aset, ada ~50 file kecil dan 1 file besar (yearly_observations.json ~1 MB) — sekitar 30 detik sampai 2 menit tergantung koneksi.
6. Scroll ke bawah → kolom “Commit changes” → tulis:

   Deploy INFRAIMPACT Dashboard MVP 1 (571 assets, 34 provinces)
   

7. Klik Commit changes (hijau).

A4. Pastikan GitHub Pages aktif

1. Di repo, klik tab Settings (paling kanan).
2. Sidebar kiri → klik Pages.
3. Section “Build and deployment”:
   • Source: Deploy from a branch
   • Branch: main / / (root) → klik Save kalau perlu.

4. Tunggu 30–90 detik. Bagian atas halaman Pages akan menampilkan:

   Your site is live at https://rezaprama.github.io/

   Karena ini repo user-site, semua subfolder otomatis ter-serve.

A5. Buka dashboard

Buka tab baru → https://rezaprama.github.io/infraimpact/

Selesai. Untuk update di kemudian hari, ulangi langkah A3 (drag & drop file yang berubah).

🟡 OPSI B — GitHub Desktop (aplikasi GUI, lebih cepat untuk update rutin)

B1. Instal GitHub Desktop

Download dari https://desktop.github.com → instal → login dengan akun GitHub Anda.

B2. Clone repo Anda

1. Di GitHub Desktop: File → Clone repository.
2. Pilih tab GitHub.com → cari rezaprama/rezaprama.github.io → pilih.
3. Local path: misalnya D:\github\rezaprama.github.io.
4. Klik Clone.

B3. Copy folder dashboard

1. Buka File Explorer.
2. Salin seluruh isi E:\00 Claude\infraimpact-dashboard\ (semua file + folder).
3. Tempel ke D:\github\rezaprama.github.io\infraimpact\ (buat folder infraimpact di sana).

Struktur akhir harus seperti ini:

D:\github\rezaprama.github.io\
├── (file akademik Anda yang sudah ada)
└── infraimpact\
    ├── .nojekyll
    ├── index.html
    ├── README.md
    ├── assets\
    ├── data\
    ├── geo\
    ├── docs\
    └── scripts\

B4. Commit & push lewat GitHub Desktop

1. Buka GitHub Desktop. Anda akan lihat ratusan file “changed” di kolom kiri.
2. Di kotak Summary kiri-bawah, tulis:

   Add INFRAIMPACT Dashboard MVP 1
   

3. Klik Commit to main.
4. Klik tombol Push origin (atas).

B5. Tunggu deploy + buka

Sama seperti A4 + A5 — tunggu 30–90 detik, lalu buka https://rezaprama.github.io/infraimpact/.

🔵 OPSI C — Git command line (paling cepat untuk developer)

Pre-req: Git terinstal (https://git-scm.com/download/win).

# 1. Clone (sekali saja)
cd D:\github
git clone https://github.com/rezaprama/rezaprama.github.io.git
cd rezaprama.github.io

# 2. Copy folder dashboard
robocopy "E:\00 Claude\infraimpact-dashboard" .\infraimpact /E

# 3. Commit & push
git add infraimpact
git commit -m "Add INFRAIMPACT Dashboard MVP 1 (571 assets, 34 provinces)"
git push origin main

Buka https://rezaprama.github.io/infraimpact/ setelah 30–90 detik.

✅ Smoke test setelah live

Buka https://rezaprama.github.io/infraimpact/ dan cek:

• Peta Indonesia tampil dengan 34 provinsi berwarna (Cividis palette per kuadran dominan).
• KPI atas menampilkan: Total aset 571 · % idle/failed sekitar 21% · APBN ≈85%.
• Hover provinsi → tooltip muncul.
• Klik provinsi → drill ke kab/kota dengan circle marker.
• Klik kab/kota → cluster marker aset muncul.
• Klik 1 marker aset → modal terbuka, 5 tab populated.
• Slider tahun 2015→2024 mengubah peta + KPI.
• Mode Compare Years: pilih Tahun A 2016, Tahun B 2024 → matriks 2×2 menampilkan panah dari posisi 2016 ke posisi 2024 per aset. KPI menampilkan delta dengan panah ▲/▼.
• Mode Year Range: pilih 2018–2024 + Agregasi “Mean” → semua metrik adalah rata-rata periode.
• Mode Compare Periods: pilih 2015–2017 vs 2022–2024 → KPI menunjukkan perubahan rata-rata.
• Story Mode (7 slide) jalan.
• Footer menampilkan: scoring_method_version v1.0 · rev-2026-05-12-v2 · cut-off 2026-05-12.

Jika ada yang belum jalan: hard refresh (Ctrl+Shift+R), buka DevTools (F12) → tab Console, copy error apa pun → lapor ke saya.

🔧 Update data tahun berikutnya

Saat data 2025 masuk:

1. Edit data/yearly_observations.json (tambah baris baru, satu obs per aset).
2. Update data/metadata.json:
   • cut_off_date → tanggal baru
   • data_revision_number → naikkan (rev-2027-XX-YY-v3)
   • year_span → [2015, 2025]
3. Edit index.html: cari min="2015" max="2024" (3 tempat: slider, range start, range end) → ubah max ke 2025.
4. Edit assets/js/app.js: cari for (let y = 2015; y <= 2024; y++) → ubah ke 2025.
5. Edit assets/js/store.js: ubah default year: 2024 → 2025, yearB: 2024 → 2025, periodBEnd: 2024 → 2025.
6. Commit & push (sama dengan langkah deploy di atas).

⚠️ Hal yang TIDAK boleh dilupakan

• File .nojekyll di dalam folder infraimpact/ harus ada. Tanpa file ini, GitHub Pages akan menjalankan Jekyll yang menghapus folder berawalan underscore dan kadang mengacaukan path. Sudah disertakan di paket file Anda.
• Jangan rename folder data/, assets/, atau geo/ di dalam infraimpact/. Path di-hardcode di JS.
• Jangan upload via file:// — selalu buka via URL https://rezaprama.github.io/infraimpact/.
• CDN GeoJSON Indonesia di-load dari jsDelivr. Jika jaringan kantor memblokir CDN, dashboard fallback ke geo/indonesia_provinces.geojson (rough rectangle). Untuk produksi akademik, ganti geo/indonesia_provinces.geojson dengan TopoJSON resmi BPS.

❓ Kalau ada masalah deploy

📞 Setelah deploy berhasil

Jika ingin laporan dasbor live untuk seminar/sidang:

1. Screenshot URL aktif di browser.
2. Sertakan DOI Zenodo (opsional, untuk publikasi Q1) — caranya: connect repo ke Zenodo via https://zenodo.org/account/settings/github/.
3. Update CITATION.cff dengan DOI yang Anda dapat.

URL final: https://rezaprama.github.io/infraimpact/