WiFi Card Generator: Buat Kartu Akses WiFi Instan

Selamat datang! Di tutorial ini kamu akan belajar cara membuat WiFi Card Generator interaktif, lengkap dengan demo langsung dan tombol “View Code” untuk setiap file. Semua ada di satu halaman!

📂 Source Code

index.html

File index.html berisi struktur halaman utama, form input untuk SSID, password, dan tipe enkripsi, container untuk menampilkan QR code, serta tombol aksi untuk generate, copy, download, dan clear.

style.css

File style.css mengatur tema warna menggunakan CSS Variables, layout kartu, styling form, tombol, responsif, dan efek visual seperti box-shadow serta gradient background.

script.js

File script.js berisi logika validasi form (validateForm()), pembuatan QR code via library QRious (generateQRCode()), fungsi copy credentials (copyCredentials()), download QR (downloadQRCode()), dan reset form (clearForm()).

🛠️ Cara Menggunakan WiFi Card Generator

1. Buka Demo atau Halaman: Klik tombol “Coba Demo Langsung” di atas untuk mencoba aplikasi di browser kamu.
2. Isi Form WiFi: Masukkan SSID (nama jaringan), Password (jika menggunakan WPA/WPA2 atau WEP), dan pilih tipe enkripsi.
3. Generate QR Code: Tekan tombol Generate QR Code. Tunggu beberapa saat hingga QR code muncul di bawah form.
4. Scan QR Code: Gunakan smartphone atau perangkat lain untuk memindai kode QR dan otomatis terhubung ke jaringan WiFi.
5. Copy & Download: Gunakan tombol Copy Credentials untuk menyalin detail SSID dan password. Klik Download QR Code untuk menyimpan gambar QR dalam format PNG.
6. Reset Form: Jika ingin membuat kartu WiFi baru, tekan tombol Clear Form untuk mereset semua input.

🔗 GitHub Repository

⭐ Jangan lupa beri stars di GitHub jika kamu menyukai kode ini dan bagikan postingan ini ke teman-temanmu!