Initiating
← Back to Projects

Portal Data Siswa (SIA Mini)

2025

Aplikasi web responsif yang berfungsi sebagai Sistem Informasi Akademik Mini (SIA Mini) menggunakan ekosistem Google Workspace tanpa biaya hosting.

View Repository
Portal Data Siswa (SIA Mini)

Tech Stack

Google Apps Script (GAS) Google Sheets Google Drive HTML5, CSS3 & JavaScript

The Problem

Sekolah atau instansi pendidikan seringkali membutuhkan cara yang cepat, mudah, dan murah untuk menyampaikan informasi akademik seperti rekapitulasi nilai kepada siswa dan orang tua. Membangun dan memelihara server khusus untuk Sistem Informasi Akademik (SIA) seringkali memakan biaya yang besar dan memerlukan keahlian teknis yang kompleks.

The Solution

Portal Data Siswa hadir sebagai Sistem Informasi Akademik Mini (SIA Mini) yang sepenuhnya mengadopsi arsitektur serverless dengan memanfaatkan ekosistem Google Workspace. Proyek ini didesain untuk menyediakan akses langsung, aman, dan real-time bagi siswa dan orang tua untuk mengecek profil dan rekapitulasi nilai akademik hanya dengan memasukkan NISN (Nomor Induk Siswa Nasional). Model ini menghasilkan solusi yang efisien tanpa biaya hosting, memiliki skalabilitas tinggi, dan kecepatan pengembangan yang optimal.

Tech Stack & Features

Sistem ini dibangun menggunakan kombinasi komponen berikut:

  • Google Sheets: Berfungsi sebagai database utama untuk penyimpanan data tabular (nama, kelas, nilai).
  • Google Drive: Digunakan secara spesifik sebagai media penyimpanan foto profil siswa.
  • Google Apps Script (GAS): Bertindak sebagai middleware yang memproses permintaan pencarian dari frontend dan mengintegrasikan data dari Sheets dan Drive.
  • HTML, CSS, JavaScript: Digunakan untuk membangun antarmuka frontend yang responsif dan intuitif.

Fitur Utama

  • Pencarian Fleksibel: Algoritma pencarian cerdas yang mampu memproses input NISN, baik dengan maupun tanpa angka nol di depan.
  • Integrasi Penyimpanan Media: Memanfaatkan Google Drive untuk menyimpan dan menampilkan foto profil siswa dengan konversi tautan otomatis oleh skrip.
  • Mode Gelap: Pengguna dapat mengubah tema tampilan aplikasi ke dark mode.
  • Keamanan Input: Implementasi validasi di sisi klien dan server untuk memastikan hanya data numerik yang diproses.

Demo dan Struktur Data

Anda dapat mencoba langsung aplikasi ini dan melihat struktur datanya melalui tautan berikut:

Instalasi

  1. Buat salinan dari Contoh Database yang tersedia.
  2. Siapkan folder di Google Drive untuk menyimpan semua foto siswa, lalu pastikan tautan foto dicantumkan pada kolom yang sesuai di Google Sheets.
  3. Buka menu Ekstensi > Apps Script pada salinan Sheet Anda.
  4. Salin file Code.gs dan Index.html dari repository ke editor script.
  5. Klik Deploy > New Deployment dan atur akses Web App ke “Anyone”.

Dikembangkan oleh Muhammad Rifai