Kembali ke Suite Akreditasi
â„šī¸
Mengapa perlu di-deploy? Browser memblokir pemuatan file HTML antar-file ketika dibuka langsung dari komputer (file://). Dengan Cloudflare Pages, aplikasi berjalan di server sungguhan sehingga semua sub-halaman terbuka normal.
1

Pastikan Struktur File Sudah Benar

Semua file HTML harus berada dalam satu folder yang sama

Folder proyek Anda harus berisi file-file berikut. Pastikan tidak ada subfolder yang memisahkan file:

📁 Persiapan Akreditasi 2028/
  â”œâ”€â”€ index.html← Halaman utama (Suite)
  â”œâ”€â”€ dashboard-todo.html
  â”œâ”€â”€ checklist-direktur.html
  â”œâ”€â”€ 01-daftar-dokumen-template.html
  â”œâ”€â”€ 02-tracker-temuan-capa.html
  â”œâ”€â”€ 03-indikator-mutu-keselamatan-pasien.html
  â”œâ”€â”€ 04-paket-bukti-index.html
  â””── akreditasi-2028.html
✅
File Anda sudah menggunakan nama yang benar dan URL-friendly — siap untuk di-upload!
2

Pilih Metode Deploy

Dua cara mudah tersedia — pilih sesuai preferensi Anda

Via GitHub + Auto Deploy

Hubungkan repositori GitHub ke Cloudflare. Setiap push otomatis ter-deploy. Cocok untuk tim.

Panduan ini menggunakan Metode Drag & Drop yang paling mudah.

3

Daftar / Masuk ke Cloudflare

Akun gratis sudah cukup — tidak perlu kartu kredit

Buka browser dan kunjungi:

https://dash.cloudflare.com

Klik "Sign Up" untuk daftar akun baru dengan email, atau "Log In" jika sudah punya akun. Setelah masuk, Anda akan melihat dashboard Cloudflare.

💡
Gunakan email aktif yang bisa Anda akses — verifikasi email diperlukan untuk mengaktifkan akun.
4

Buka Menu "Workers & Pages"

Temukan fitur Cloudflare Pages di sidebar dashboard

Di dashboard Cloudflare, pada menu sebelah kiri cari dan klik "Workers & Pages".

đŸ–Ĩī¸ Sidebar Cloudflare Dashboard → Klik "Workers & Pages"

Kemudian klik tombol biru "Create application" → pilih tab "Pages" → klik "Upload assets".

5

Beri Nama Proyek

Nama ini akan menjadi URL publik Anda

Isi nama proyek di kolom yang tersedia. Nama ini akan menjadi bagian dari URL publik Anda. Gunakan nama yang mudah diingat, misalnya:

akreditasi-klinik-2028

URL yang akan Anda dapatkan:

https://akreditasi-klinik-2028.pages.dev
âš ī¸
Perhatian: Gunakan hanya huruf kecil, angka, dan tanda hubung (-). Jangan gunakan spasi atau karakter khusus lainnya.
6

Upload Folder (Drag & Drop)

Seret seluruh folder proyek ke area upload

Di halaman upload, Anda akan melihat area besar bertuliskan "Drag and drop your assets here".

đŸ“‚âžĄī¸â˜ī¸ Buka File Explorer → Temukan folder "Persiapan Akreditasi 2028" → Seret seluruh isinya ke area upload di Cloudflare
â„šī¸
Penting: Upload isi folder (semua file HTML di dalamnya), bukan folder itu sendiri. Pilih semua file (Ctrl+A) di dalam folder, lalu seret ke area upload.

Cloudflare akan menampilkan daftar file yang berhasil diupload. Pastikan index.html ada dalam daftar tersebut.

7

Klik "Deploy Site" dan Tunggu

Proses deployment biasanya hanya 30–60 detik

Setelah semua file terupload, klik tombol "Deploy site". Cloudflare akan memproses file Anda secara otomatis.

Setelah selesai, Anda akan melihat halaman sukses dengan URL publik seperti:

https://akreditasi-klinik-2028.pages.dev

Klik URL tersebut untuk membuka aplikasi Suite Akreditasi Anda yang sudah online! 🎉

✅
Berhasil! Semua tombol navigasi sidebar (Dashboard, Checklist, Dokumen, dll.) kini akan berfungsi dengan sempurna.
8

Update File di Masa Mendatang

Cara mengupdate konten setelah perubahan

Jika ada file yang diperbarui, buka kembali proyek Anda di Cloudflare Pages:

Dashboard → Workers & Pages → [nama proyek Anda] → Deployments → "Upload assets"

Upload kembali semua file (atau hanya file yang berubah). Cloudflare akan otomatis memperbarui deployment dan URL publik Anda tetap sama.

💡
Cloudflare Pages menyimpan riwayat semua deployment, sehingga Anda bisa rollback ke versi sebelumnya kapanpun dibutuhkan.

đŸ–Ĩī¸ Alternatif: Uji Coba Lokal Sebelum Deploy

Jika ingin menguji aplikasi di komputer sendiri sebelum deploy ke Cloudflare:

Cara 1 — npx (jika Node.js tersedia):

# Buka Command Prompt / Terminal di folder proyek, lalu:
npx http-server -p 8080 -o

Cara 2 — VS Code Live Server Extension:

Buka folder di VS Code → klik kanan index.html → "Open with Live Server"

🎉 Aplikasi Siap Online!

Setelah deploy selesai, Suite Akreditasi Klinik 2028 Anda akan dapat diakses dari mana saja melalui browser — laptop, tablet, maupun smartphone — tanpa perlu install apapun.

https://[nama-proyek-anda].pages.dev