Cara Membuat Aplikasi Pengumuman PPDB Online Tanpa Hosting & Database

  


Dalam dunia pendidikan modern, efisiensi informasi adalah kunci utama. Salah satu momen krusial bagi sekolah adalah saat memberikan pengumuman hasil seleksi Penerimaan Peserta Didik Baru (PPDB). Mengirimkan pengumuman satu per satu atau memajang kertas di papan pengumuman sekolah sudah mulai ditinggalkan. Sebagai gantinya, sekolah memerlukan sistem digital yang cepat dan dapat diakses dari mana saja.

Tutorial ini akan membahas secara mendalam cara membuat aplikasi website pengumuman PPDB yang canggih namun sederhana, menggunakan Google Apps Script dan Google Sheets. Keunggulan utama sistem ini adalah Anda tidak memerlukan biaya hosting bulanan atau keahlian database SQL yang rumit. Semuanya berjalan 100% di infrastruktur cloud milik Google secara gratis.

Mengapa Menggunakan Google Apps Script?

Google Apps Script (GAS) adalah platform pengembangan berbasis JavaScript yang memungkinkan Anda mengotomatiskan tugas-tugas di seluruh produk Google. Dalam konteks pengumuman PPDB, GAS berperan sebagai "mesin" yang menghubungkan tampilan website (frontend) dengan data siswa di Google Sheets (backend). Hal ini memungkinkan sinkronisasi data secara real-time; setiap kali panitia mengubah status di Spreadsheet, hasil di website akan langsung berubah.

Langkah 1: Persiapan Lingkungan Kerja di Google Drive

Langkah pertama adalah menyiapkan tempat penyimpanan proyek Anda:

  1. Buka Google Drive Anda.
  2. Buat folder baru dengan nama "Pengumuman PPDB" agar file-file proyek tertata rapi.
  3. Di dalam folder tersebut, buat file Google Sheets baru dan beri nama "Database Pengumuman".

Langkah 2: Mengonfigurasi Google Apps Script

Setelah file Spreadsheet siap, kita akan memasukkan logika programnya:

  1. Buka file Spreadsheet tersebut, lalu klik menu Extensions > Apps Script.
  2. Anda akan diarahkan ke editor script. Secara default, akan ada file bernama Code.gs.
  3. Hapus semua kode yang ada di Code.gs, lalu tempelkan kode backend yang berfungsi menangani permintaan pencarian nomor pendaftaran.
  4. Buat file baru dengan klik ikon plus (+), pilih HTML, dan beri nama "index" (pastikan penulisan hurufnya sesuai, karena sistem ini peka terhadap case-sensitive).
  5. Tempelkan kode antarmuka HTML dan CSS di file index.html. Kode ini akan mengatur tampilan kolom pencarian dan kartu pengumuman (Lulus/Tidak Lulus).

Langkah 3: Setup Database Otomatis

Salah satu fitur cerdas dalam script ini adalah fungsi setupDatabase. Fungsi ini dirancang untuk membuat struktur tabel secara otomatis tanpa Anda perlu mengetiknya secara manual di Spreadsheet.

  1. Pada toolbar editor script, pilih fungsi "setupDatabase".
  2. Klik tombol Run (Jalankan).
  3. Berikan izin akses (otorisasi) yang diperlukan. Karena script ini dibuat sendiri, Anda perlu mengklik Advanced > Go to [Nama Project] > Allow.
  4. Setelah selesai, lihat kembali ke file Google Sheets Anda. Secara otomatis akan muncul kolom seperti Nomor PendaftaranNama SiswaKeterangan, dan Link Berkas.

Langkah 4: Melakukan Deployment Website

Agar script tersebut bisa diakses oleh publik (orang tua siswa), kita harus mengubahnya menjadi aplikasi web:

  1. Klik tombol Deploy di pojok kanan atas, lalu pilih New Deployment.
  2. Pilih jenis Web App.
  3. Pada bagian "Who has access", pastikan Anda memilih "Anyone". Ini sangat penting agar orang tua siswa tidak perlu login akun Google untuk melihat pengumuman.
  4. Klik Deploy dan salin URL yang diberikan. URL inilah yang nantinya akan dibagikan kepada calon siswa.

Langkah 5: Manajemen Data dan Uji Coba

Sekarang sistem Anda sudah online. Mari kita coba cara kerjanya:

  • Input Data: Masukkan data contoh di Spreadsheet. Misalnya, Nomor Pendaftaran 001, Nama Budi, Keterangan LULUS, dan sertakan link PDF untuk daftar ulang di kolom Link Berkas.
  • Pencarian: Buka URL Web App Anda, masukkan nomor 001, lalu klik Cek Hasil.
  • Hasil Real-time: Jika Anda mengubah status Budi di Spreadsheet dari LULUS menjadi TIDAK LULUS, lalu melakukan pengecekan ulang di website, maka hasilnya akan langsung berubah secara otomatis tanpa perlu melakukan deployment ulang.

Kesimpulan dan Tips Tambahan

Sistem pengumuman berbasis Google Apps Script ini adalah solusi cerdas bagi sekolah yang ingin melakukan digitalisasi dengan anggaran terbatas. Beberapa hal yang perlu diperhatikan:

  • Keamanan Data: Pastikan Anda tidak memberikan akses edit Spreadsheet kepada orang lain selain panitia inti.
  • Custom Design: Anda bisa mengubah warna dan logo pada file index.html untuk menyesuaikan dengan identitas visual sekolah Anda.
  • Limitasi: Google Apps Script memiliki kuota harian untuk eksekusi, namun untuk kebutuhan pengumuman sekolah skala menengah, kapasitas gratis ini sudah lebih dari cukup.

Dengan mengikuti panduan ini, sekolah Anda kini memiliki sistem pengumuman yang profesional, transparan, dan sangat mudah dikelola. Selamat mencoba!

Link Source Code : https://shorturl.at/RpLpS

Lebih baru Lebih lama