bikin cloudflare

# Panduan Lengkap: Bikin & Deploy Cloudflare Worker dari Nol Rangkuman langkah-langkah untuk bikin website statis (HTML, gambar, PDF, dll) dan publish ke Cloudflare Workers, lengkap dengan Git untuk backup & riwayat perubahan. --- ## 1. Persiapan Awal (Sekali Saja per Komputer) ### Install tools yang dibutuhkan - **Git** — dari [git-scm.com](https://git-scm.com) - **Node.js (LTS)** — dari [nodejs.org](https://nodejs.org) Cek berhasil terinstall dengan buka CMD/Terminal: ``` git --version node --version ``` ### Install Wrangler (CLI resmi Cloudflare) ``` npm install -g wrangler ``` - `npm` = tool bawaan Node.js untuk install package - `-g` = install secara global (bisa dipanggil dari folder mana saja) - `wrangler` = nama tool-nya Cek berhasil: ``` wrangler --version ``` ### Login ke akun Cloudflare ``` wrangler login ``` Ini akan buka browser, minta izin akses (klik **Allow**). Biasanya cuma perlu sekali per komputer. --- ## 2. Buat Project Baru Semua langkah ini dijalankan **di komputer lokal kamu** (CMD/Terminal), bukan di dashboard Cloudflare. ### a. Buat folder project ``` cd Documents mkdir nama-project-kamu cd nama-project-kamu ``` ### b. Buat folder `public` Semua file yang mau ditampilkan (HTML, gambar, PDF, dll) ditaruh di sini. ``` mkdir public ``` Struktur akhirnya: ``` nama-project-kamu/ ├── public/ │ └── (isi file di sini) └── wrangler.jsonc ``` ### c. Buat file `wrangler.jsonc` Di folder utama project (sejajar dengan `public`, bukan di dalamnya). Bikin pakai Notepad atau VS Code, isinya: ```json { "name": "nama-worker-kamu", "compatibility_date": "2026-01-01", "assets": { "directory": "./public" } } ``` > **Penting:** `"name"` di sini yang menentukan URL worker kamu (`https://nama-worker-kamu.SUBDOMAIN.workers.dev`), boleh beda dari nama folder di komputer — tidak masalah. ### d. (Opsional) Buat `index.html` Kalau mau ada "halaman utama" saat orang akses domain langsung, taruh `index.html` di dalam folder `public`. Tanpa file ini, akses ke alamat root akan 404 — tapi file lain tetap bisa diakses lewat path-nya masing-masing (misal `.../foto.jpg`). ### e. (Opsional, untuk worker "private"/tidak mau ke-index Google) Buat file `public/robots.txt`: ``` User-agent: * Disallow: / ``` --- ## 3. Tes di Lokal Sebelum Deploy ``` wrangler dev ``` Buka `http://localhost:8787` (atau `http://127.0.0.1:8787`) di browser untuk cek tampilannya. Tekan `Ctrl + C` di terminal untuk menghentikan server lokal. --- ## 4. Setup Git & Backup ke GitHub (Opsional, tapi disarankan) ``` git init git add . git commit -m "Initial commit" ``` Buat repository baru di [github.com](https://github.com) (tombol **New repository**). Kalau isinya sensitif, pilih **Private**. Setelah repo dibuat, GitHub akan kasih perintah seperti ini — jalankan di terminal: ``` git remote add origin https://github.com/USERNAME/NAMA-REPO.git git branch -M main git push -u origin main ``` --- ## 5. Deploy ke Cloudflare ``` wrangler deploy ``` Ini yang **beneran** mempublish file ke internet. Setelah selesai, terminal menampilkan URL worker-nya. --- ## 6. Alur Kerja Selanjutnya (Setiap Ada Perubahan) ``` [edit / tambah / hapus file di folder public] ↓ wrangler deploy → ini yang bikin perubahan muncul online ↓ (opsional, buat backup & riwayat) git add . git commit -m "deskripsi perubahan" git push ``` **Poin penting:** - `wrangler deploy` = yang mempublish perubahan ke internet — **wajib** dijalankan tiap ada perubahan yang mau tampil online. - `git add/commit/push` = cuma backup & catatan riwayat di GitHub — **opsional**, tidak berpengaruh ke tampilan website. - `git push` (ke GitHub) dan `wrangler deploy` (ke Cloudflare) itu **dua sistem terpisah** yang tidak otomatis terhubung, kecuali kamu setup fitur Git Integration resmi Cloudflare secara khusus. --- ## 7. Cara Melihat File yang Sudah Ter-upload Dashboard Cloudflare **tidak** menampilkan daftar file worker berbasis static assets secara visual. Cara ceknya: - Buka link file-nya langsung di browser (`https://nama-worker.workers.dev/namafile.ext`) - Lihat daftar file di output terminal saat `wrangler deploy` (ada baris `Found X new or modified static assets`) - Cek langsung folder `public` di komputer — isinya selalu identik dengan yang ada di Cloudflare setelah deploy --- ## 8. Batas Paket Free Cloudflare Workers (yang relevan) | Batas | Free | |---|---| | Jumlah file statis per worker | 20.000 file | | Ukuran per file | maks 25 MB | | Request per hari | 100.000 | | Jumlah worker per akun | 100 | > Untuk kebutuhan simpan banyak/besar file (ratusan/ribuan file atau di atas 25 MB), pertimbangkan **Cloudflare R2** (object storage terpisah, gratis 10 GB/bulan, tanpa biaya akses/egress). --- ## 9. Soal Privasi Worker Secara default, worker bisa diakses **siapa saja** yang tahu link-nya. Ada 2 level: - **"Rahasia" (obscurity)** — pakai nama worker yang susah ditebak + `robots.txt` untuk blokir indexing Google. Tetap bisa diakses siapa pun yang punya linknya. - **Beneran private (butuh login)** — pakai fitur **Cloudflare Access**, baru ada verifikasi identitas (email/OTP) sebelum bisa akses. >>>>aku mau menambah, kalau buka dari komputer lain, wrangler deploy, itu isi di public ya, kalau begitu isi file tampilannya berubah juga ya Betul, itu logikanya pas. Aku tambahin sedikit detail biar makin jelas ya: Yang menentukan tampilan online itu selalu ISI folder public di komputer manapun kamu jalankan wrangler deploy saat itu — bukan komputer yang mana. Jadi kalau kamu buka di komputer lain terus jalankan wrangler deploy dari situ, ya otomatis tampilan online berubah mengikuti isi folder public di komputer itu. Tapi ada satu langkah yang perlu dilakukan dulu di komputer baru itu, supaya folder public-nya ada isinya: Clone dulu repo dari GitHub (supaya file-filenya "turun" ke komputer baru): git clone https://github.com/USERNAME/NAMA-REPO.git cd NAMA-REPO Install Wrangler & login (kayak setup awal): npm install -g wrangler wrangler login Baru bisa jalankan wrangler deploy seperti biasa dari situ. Poin penting yang perlu kamu waspadai — kasus "isi beda di 2 komputer": Kalau kamu edit file di komputer A, terus wrangler deploy dari komputer A → online ke-update sesuai komputer A. Tapi kalau abis itu kamu buka di komputer B yang folder public-nya belum ada perubahan terbaru (misal lupa git pull dulu buat narik update dari GitHub), terus kamu wrangler deploy dari komputer B → perubahan dari komputer A bisa ke-timpa/hilang, balik ke versi lama yang ada di komputer B. Solusinya, biasakan urutan ini tiap ganti komputer: git pull → tarik dulu versi terbaru dari GitHub → (baru edit kalau perlu) wrangler deploy → baru publish git add . / commit / push → simpan lagi ke GitHub kalau ada perubahan baru Jadi GitHub itu fungsinya jadi "jembatan sinkronisasi" antar komputer — asal kamu disiplin git pull sebelum kerja dan git push setelah kerja, isi public di semua komputer bakal tetap konsisten, dan wrangler deploy dari komputer manapun hasilnya sama.