# Panduan — Formulir Pendaftaran Kursus Konsultan Web3 (Web3 Academi)

Hasil pendaftaran masuk otomatis ke **Google Spreadsheet** dan notifikasi ke **amalsaleh.top@gmail.com**.
Semua file sudah siap di folder ini:

| File | Fungsi |
|---|---|
| `Code.gs` | Backend Google Apps Script (simpan ke Spreadsheet + kirim email) |
| `Form.html` | Formulir pendaftaran (3 langkah, responsif, validasi) |
| `appsscript.json` | Manifest (timezone Asia/Jakarta, akses publik) |
| `build-static.js` | Pembuat versi HTML statis (`dist/index.html`) |
| `dist/index.html` | Versi statis — dipakai kalau mau hosting sendiri (Netlify/Vercel/cPanel) |

> ⚠️ Link website **baru bisa ada setelah kamu deploy** di akun Google `amalsaleh.top@gmail.com`.
> Saya tidak bisa login/deploy ke akunmu, jadi ikuti langkah di bawah (±7 menit) — link-nya muncul di langkah 4.

---

## Bagian A — Bikin link formulir (cara utama, paling cepat)

### 1. Buka Apps Script & buat proyek
Pasang/hubungi dari akun Google **amalsaleh.top@gmail.com**, lalu buka:
👉 https://script.google.com → **New project** (Proyek baru)

Beri nama: `Form Pendaftaran Web3 Academi`.

### 2. Isi code
- Klik file **`Code.gs`** di panel kiri, **hapus semua isinya**, lalu paste seluruh isi `Code.gs` dari folder ini.
- Tambah file HTML: klik **+** di panel kiri → **HTML** → beri nama **`Form`** (tanpa `.html`) → **hapus isinya** → paste seluruh isi `Form.html`.
- (Opsional, kalau editor menampilkan) buka **Project Settings** → centang **Show "appsscript.json"** → paste isi `appsscript.json`.

### 3. Buat Spreadsheet penampung
Di editor, pilih fungsi **`setup`** pada dropdown → klik **Run**.
Akan muncul permintaan izin:
- **Review permissions** → pilih akun amalsaleh.top@gmail.com
- **Advanced** → **Go to Form Pendaftaran Web3 Academi (unsafe)** → **Allow**

Hasilnya: otomatis dibuat Spreadsheet bernama
**"Pendaftaran Kursus Konsultan Web3 — Web3 Academi"** berisi sheet **`Pendaftar`** dengan kolom:
Waktu Daftar · ID Pendaftar · Nama Lengkap · Email · No. WhatsApp · Kota/Domisili · Profesi · Pengalaman Web3 · Paket Kursus · Jadwal · Portfolio · Sumber Info · Kode Referral · Motivasi & Tujuan · Status · Catatan Admin

Cek di **Executions / View → Logs** — URL Spreadsheet-nya tercetak di sana.

### 4. Deploy jadi Web App → **link formulir muncul di sini**
Klik **Deploy** → **New deployment** → ikon gerigi **Select type** → **Web app**, isi:

| Kolom | Isi |
|---|---|
| Description | `Form Pendaftaran v1` |
| **Execute as** | **Me** (amalsaleh.top@gmail.com) |
| **Who has access** | **Anyone** (agar siapa saja bisa daftar tanpa login) |

Klik **Deploy** → **Authorize access** → **Allow**.

### 5. Salin link
Setelah deploy, kamu dapat Web app URL seperti:

```
https://script.google.com/macros/s/AKfycbxxxxxxxxxxxxxxxxxxxxxxxxxxxx/exec
```

**← itulah LINK WEBSITE FORMULIR PENDAFTARAN kamu.**
Bagikan link ini di Instagram/WhatsApp/bio. Untuk HP kamu bisa buat versi pendek dengan
bit.ly atau `short.gy` supaya lebih rapi.

> Setiap kali kamu ubah `Code.gs`/`Form.html`: **Deploy → Manage deployments → ✏️ (Edit) → Version: New version → Deploy**.
> Link tetap sama, tidak perlu ganti.

---

## Bagian B — Alternatif: hosting sendiri (domain sendiri, tampilan lebih bebas)

1. Deploy Apps Script seperti Bagian A, lalu salin URL `…/exec`.
2. Di terminal, di folder ini jalankan:
   ```powershell
   node build-static.js "https://script.google.com/macros/s/XXXX/exec"
   ```
   Perintah ini menghasilkan `dist/index.html` yang mengirim data ke Apps Script lewat `fetch`
   (tanpa `google.script.run`), jadi bisa di-host di mana saja.
3. Upload `dist/index.html` (rename boleh jadi `index.html` saja) ke:
   - **Netlify Drag & Drop**: https://app.netlify.com/drop → tarik foldernya → dapat link `https://nama-kamu.netlify.app`
   - atau Vercel / GitHub Pages / cPanel hosting biasa.
4. **Tes sekali**: kirim pendaftaran dari link tersebut, pastikan baris baru muncul di Spreadsheet dan email masuk.

---

## Fitur formulir

- 3 langkah: Data diri → Pengalaman & Program → Konfirmasi (ada progress bar + ringkasan).
- Validasi: nama (min 3 huruf), format email, nomor WhatsApp 9–15 digit, motivasi min 20 karakter.
- Pilihan program: Starter (4 sesi), Profesional (8 sesi), Konsultan Bisnis (12 sesi + mentoring 1:1), Belum memutuskan.
- Kartu pilihan paket bisa diklik, tampilan gelap/neon, 100% responsif (HP & desktop).
- Anti-duplikat ganda: pakai `LockService`, jadi 2 pendaftar bersamaan tetap tercatat rapi.
- Nomor pendaftaran otomatis: `WEB3-YYMMDD-NNN`.
- Email otomatis:
  - Ke admin (amalsaleh.top@gmail.com): ringkasan data pendaftar baru.
  - Ke peserta: email "pendaftaran diterima" berisi nomor pendaftaran & langkah berikutnya.
- Setelah kirim, muncul kartu sukses berisi nomor pendaftaran + tombol "Daftarkan peserta lain".

### Hal yang mudah diubah (di `Code.gs`, bagian `CONFIG`)
```js
SPREADSHEET_ID: '',                  // isi kalau mau menampung ke spreadsheet yang SUDAH ada
SPREADSHEET_TITLE: '…',              // nama spreadsheet baru
SHEET_NAME: 'Pendaftar',             // nama sheet
NOTIFY_EMAIL: 'amalsaleh.top@gmail.com',
SEND_ADMIN_NOTIF: true,              // notifikasi ke admin
SEND_AUTOREPLY: true,                // email balasan ke peserta
ADMIN_KEY: 'web3academi-2025'        // kunci untuk lihat data (JSON)
```
**Pakai Spreadsheet yang sudah ada** (misalnya punya sheet khusus): buat spreadsheet baru → salin ID dari URL
(`docs.google.com/spreadsheets/d/**ID_INI**/edit`) → tempel ke `SPREADSHEET_ID` → Run `setup` sekali lagi.
Pastikan spreadsheet tersebut boleh diedit oleh akun amalsaleh.top@gmail.com.

### Cek data pendaftar lewat API (opsional)
```
https://script.google.com/macros/s/XXXX/exec?action=data&key=web3academi-2025
```
Menghasilkan JSON seluruh pendaftar (ganti `web3academi-2025` dengan `ADMIN_KEY` milikmu, dan **jangan dibagikan** ke publik).

---

## Tampilan kolom Spreadsheet
Baris 1 dibekukan (header tebal), kolom Waktu diformat `dd/MM/yyyy HH:mm:ss`,
nomor WhatsApp disimpan sebagai teks (apostrof `'`) supaya `08…` tidak berubah jadi `8.12E+11`.

## Kalau ada masalah
| Gejala | Penyebab & solusi |
|---|---|
| Muncul "Script function not found: doGet" | File HTML belum diberi nama **`Form`** tepat, atau `Code.gs` belum di-paste utuh |
| Halaman minta login saat dibuka orang lain | Deploy ulang, **Who has access = Anyone** |
| Data tidak masuk Spreadsheet | Cek menu **Executions** di Apps Script untuk melihat error-nya |
| Email tidak terkirim | Kuota email harian akun gratis ±100 email/hari; cek folder Spam |
| Link berubah-ubah | Pakai **Manage deployments**, jangan buat deployment baru setiap revisi |
| Ingin tampil versi baru | Edit → Deploy → Manage deployments → Edit → **New version** |