Pembuatan Web App “E-Daftar Riwayat Hidup”.

Padangsidimpuan 15 Juli 2026.

Hasil aplikasi E-DRH versi saya dapat anda lihat hingga Halaman “Login” di link ini.

Apa itu “E-DRH”?.

Yang dimaksud dengan “E-DRH” di artikel ini adalah aplikasi berbasis web yang dibangun menggunakan Google Apps Script sebagai backend dan HTML/CSS/JavaScript sebagai frontend. Aplikasi ini dirancang khusus untuk mengelola Daftar Riwayat Hidup (DRH) pegawai secara digital, menggantikan proses manual pengisian formulir kertas. Aplikasi ini memanfaatkan Google Sheets sebagai database dan Google Drive sebagai tempat penyimpanan file (foto dan PDF). Secara khusus, format template sebelum data disusun dan diubah menjadi PDF menggunakan format Keputusan Kepala BKN Nomor 11 Tahun 2002. Sehingga akan ada perbedaan jika Anda menggunakannya untuk kepentingan Calon Pegawai Negeri Sipil dan Pegawai Pemerintah dengan Perjanjian Kerja (P3K). BKN melalui SSCASN sebenarnya sudah menyediakan website dengan fungsi yang sama. So.. bukan barang baru ya…!.

Disclaimer.

Aplikasi ini tidak berafiliasi dengan pemerintah dan/atau perusahaan manapun dan tidak bermaksud meniru fasilitas dan fungsi dari aplikasi berbayar atau aplikasi gratis manapun. Web App ini sengaja dibuat menurut penafsiran penulis untuk kebutuhan pembuatan dokumen Daftar Riwayat Hidup bagi para PNS yang juga disesuaikan dengan kebutuhan penulis.

Fitur Web App “E-DRH”.

Berikut ini adalah daftar fitur-fitur yang saat ini sudah tersedia di dalam code Apps Script Web App “E-DRH”, yakni;

  1. Adanya fungsi Authentication. Anda hanya akan bisa melihat “penampakan” halaman web jika anda memiliki Username dan Password yang sesuai dengan data di dalam File Spreadsheet yang digunakan sebagai tabel data pengguna (Sheet “Users“);
  2. Adanya Dashboard Multi Panel. Maksudnya, halaman akan muncul jika anda meng-klik panel dibagian kiri layar. Sehingga ketika anda berhasil login, anda tidak langsung melihat seluruh tabel yang bisa diisi, melainkan Form yang dibuat berdasarkan kelompok datanya;
  3. Adanya CRUD data Perorangan dan CRUD data Tabular. CRUD adalah singkatan/akronim dari kata Create, Read, Update, dan Delete. Istilah ini dikenal sebagai gambaran adanya proses pengelolaan data dalam suatu sistem. Kemudian, data Perorangan yang dimaksud adalah data yang setiap penggunanya hanya akan disediakan satu Field dan satu Jawaban, seperti; Nama Lengkap, Jenis Kelamin, Tanggal Lahir, dan sebagainya. Sedangkan data Tabular yang dimaksud adalah data yang setiap penggunanya berbeda-beda dan bervariasi, seperti; data “Pendidikan”, data “Keluarga”, data “Organisasi”, dan sejenisnya. Dari segi jumlah item pun bisa bervariasi; ada yang butuh 3 row, ada yang butuh 4 row, dan ada yang tidak butuh row.
  4. Adanya fitur “Upload” Foto. Fitur ini anda lihat di bagian data “Perorangan”.
  5. Adanya fitur “Buat PDF“. Fitur ini anda temukan sebagai tombol di atas tombol “Logout”. Fitur ini juga memberikan anda kesempatan untuk mendownload hasil PDF yang memang menjadi output Final dari Web App ini.
  6. Adanya fitur pengelolaan “Sesi Pengguna“. Tujuan asli dari pembuatan fitur ini adalah bukti tindakan preventif yang mencegah halaman menjadi “logout” karena halaman di refresh atau tanpa sengaja tertutup. Tapi ingat batasan login dalam satu sesi yang sama di fitur GRATIS kita adalah 6 menit/refresh dan 6 jam/hari. Jika melebihi, halaman yang belum disimpan akan dihilangkan oleh browser.
  7. Menggunakan Google Workspace (gratis, mudah diakses).
  8. Arsitektur sederhana dan mudah dipahami.

Kelemahan Web App ini.

Meski sudah disediakan fitur-fitur penting dan Web App ini berfungsi dengan baik, tidak ada jaminan bahwa web app ini hadir tanpa kekurangan atau kelemahan di dalam sistemnya. Jadi, Web App kita ini juga akan memiliki kelemahan/kekurangan dalam hal;

  1. Tingkat keamanan yang dikategorikan masih rendah. Data yang menyimpan Username dan Password disimpan dalam bentuk teks biasa (plaintext) tanpa adanya logika pengamanan data di sheet “Users”, data sensitif tidak tersimpan tanpa inkripsi, tidak ada session timeout sehingga sesi pada dasarnya tetap aktif sampai logout manual atau browser ditutup.
  2. Tidak ada fitur “Proteksi CSRF” dan rate limiting. Tanpa proteksi CSRF, web app akan rentan terhadap serangan cross-site request. Tanpa adanya rate limiting, potensi brute force attack pada login akan meningkat.
  3. Faktor penggunaan Google Spreadsheet sebagai database. Penggunaan sejenis ini menunjukkan tingkat integritas data yang rendah. Karena tidak support relational query, tidak ada validasi unik (yang mencegah duplikasi data antar user), rendahnya relasi antar tabel, dan tingginya resiko kehilangan data karena kosongya fitur backup data otomatis. Adanya pembatasan quota harian di 20.000 calls/day dan hanya menyediakan runtime sebanyak 6 menit runtime.
  4. Faktor Kinerja dan Skalabilitas yang kompleks. Saat ini Google Apps Script berjalan single-thread dan semua data user dimuat dalam satu panggilan fungsi. Web App tidak ada memiliki proses caching, sehingga setiap navigasi reload ulang data dari server. Tidak ada pagination, sehingga Ketika data membesar, performa rendering akan menurun. Hal-hal tersebut membutuhkan pengaturan lanjutan yang juga akan berdampak pada kinerja dan skalabilitasnya sendiri. Seperti lingkaran setan.
  5. Model UIX yang belum mengejar kebutuhan pengalaman pengguna. Web app ini tidak responsive sempurna, sidebar collapse di tablet/mobile masih kurang optimal. Tidak ada progress indicator, saat generate PDF, user tidak tahu estimasi waktu. Tidak ada auto-save, perubahan data perorangan hanya tersimpan saat klik tombol. Tidak ada undo/redo, penghapusan data permanen tanpa recovery. Tidak ada export data, karena data hanya akan diolah menjadi file PDF.
  6. Banyaknya fitur yang tidak disediakan. Seperti; tidak menyediakan fitur Multi Peran (peran admin, user biasa, just viewer); tidak menyediakan Riwayat perubahan (Audit Log); tidak menyediakan fitur Pencarian & Filtering; tidak menyediakan fitur validasi data otomatis, tidak menyediakan notifikasi Real Time.

Pembuatan Web App “E-DRH”.

  1. Buatlah File Spreadsheet baru yang akan menjadi database dan sebuah Google Document yang menjadi template Daftar Riwayat Hidup.
  2. Karena ada 15 Sheet dan banyak kolom, juga halaman dan tag di google document-nya, silahkan lihat link Spreadsheet berikut dan copy untuk anda sendiri. Jangan lupa copy juga model “Template” Daftar Riwayat Hidup-nya dari link di bawah ini.
    • Link Spreadsheet : disini.
    • Link Template Document : disini.
  3. Di Spreadsheet, cari menu Ekstensi, klik dan kemudian pilih Apps Script. Anda akan dibukakan Tab baru / Halaman baru yang merupakan halaman pengalihan ke Aplikasi Google Apps Script Editor.
  4. Di Apps Script, klik Kode.gs (sebagian akan melihat Code.gs di bagian kiri, tergantung bahasa akun google Anda). Hapus semua kode bawaan yang ada di dalam Kode.gs dan ganti dengan code dari file Kode.gs. Jangan lupa ganti SPREADSHEET_ID_ANDA dan TEMPLATE_ dengan data yang sesuai.
  5. Masih di Apps Script, buatlah File baru dengan mengklik tanda “+” dan pilih HTML, kemudian beri nama Login (jangan tambahkan “.html” karena akan otomatis dibuatkan google, cukup “Index”). Pada halaman Login.html yang muncul, hapus seluruh kode bawaan yang sudah ada di dalamnya dan ganti dengan code dari file Login.html.
  6. Jangan lupa simpan seluruh kode yang telah Anda copy-paste.
  7. Sebelum anda mendeploy, jangan lupa buatkan Folder bernama “DRH_Foto_Uploads” dan “DRH_PDF_Results” di Direktori Utama Drive Google Anda.
  8. Kembali ke tampilan Apps Script, klik tombol Terapkan (Deploy) di kanan atas, kemudian pilih Terapkan baru (New Deployment).
  9. Klik ikon roda gigi (Jenis konfigurasi), kemudian pilih Aplikasi web. Lakukan pengisian dan pengaturan di jendela yang muncul sebagai berikut.
    • Deskripsi : versi 1.0 (bisa anda namai secara bebas).
    • Jalankan sebagai: Diri Anda sendiri (Email Anda).
    • Yang memiliki akses: Pilih Siapa saja / Anyone (agar pengguna lain/HP lain bisa membuka tautan login).
  10. Klik Terapkan. Sistem akan meminta otorisasi akses data spreadsheet Anda pertama kali. Pilih akun Google Anda, klik Advanced / Lanjutan, Klik Go to… (unsafe) / Buka… (tidak aman), lalu klik Allow / Izinkan.
  11. Setelah sukses, Anda akan mendapatkan URL Aplikasi Web (Bukan Library yang di copy ya..!). Salin URL Aplikasi Web tersebut dan jalankan di browser laptop atau PC Anda.

Pengujian.

Kegiatan pengujian dimaksudkan untuk memastikan code yang Anda copy-paste benar-benar dapat dieksekusi sebagaimana mestinya. Juga untuk memastikan Spreadsheet dan Document yang ada sama dengan yang saya gunakan di artikel ini. Sehingga, ketika anda membuka link dan diarahkan ke halaman web app, web app berjalan lancar dan menampilkan data sebagaimana direncanakan dalam code. Lakukan pengujian di PC Anda untuk pengalaman yang lebih baik.

Penutup.

  1. Silahkan gunakan dan modifikasi code yang ada sesuai kebutuhan jika Anda memiliki kemampuan Google Apps Script Developer. Seluruh code yang ada di dalam dan/atau dikaitkan dengan tulisan ini bersifat gratis dan tidak mengikat. Oleh sebab itu, segala KEUNTUNGAN DAN KERUGIAN penggunaan, pemanfaatan dan sebagainya di luar tanggung jawab saya selaku penulis.
  2. Jika Anda tidak mengisi Spreasheet Anda dengan data yang sesuai dan/atau Anda tidak membuat document template yang sesuai, maka web app mungkin tidak berfungsi sebagaimana tujuannya.
  3. Selaku penulis, saya dibebaskan dari segala tuntutan terkait seluruh tulisan saya di artikel ini dan seluruh artikel saya di web ini, sebagaimana Anda dibebaskan dari segala tuntutan karena belajar atau tidak dari seluruh tulisan saya.
Scroll to Top