Inspiration

Alokasi Dana Desa di Indonesia sering kali diputuskan secara elitis dalam musyawarah tertutup tanpa keterlibatan langsung mayoritas warga. Akibatnya, pembangunan fisik kerap tidak tepat sasaran dan mengabaikan urgensi riil di lapangan. Selain itu, banyak warga yang bertempat tinggal di luar alamat KTP kehilangan hak suara dalam pembangunan lingkungannya.

Terinspirasi dari urgensi tersebut, kami membangun Pantau Desa—sebuah platform civic technology partisipatif yang menggabungkan pemetaan spasial interaktif dengan demokrasi anggaran modern.

What it does

  • Peta Aspirasi Spasial (WebGIS): Warga dapat meletakkan pin lokasi langsung di atas peta wilayah Indonesia untuk melaporkan infrastruktur bermasalah (jalan rusak, jembatan rapuh, drainase mampet) lengkap dengan foto autentik dan koordinat presisi.
  • Geofencing Teritorial Indonesia: Peta dikunci secara teritorial pada batas koordinat NKRI dengan validasi otomatis agar penandaan usulan hanya dapat dilakukan di wilayah kedaulatan Indonesia.
  • Token-Based / Quadratic Budgeting: Setiap warga terverifikasi memiliki kuota token tahunan untuk memberikan bobot dukungan pada usulan pembangunan. Menggunakan prinsip quadratic voting: $$\text{Token yang Dibutuhkan} = (\text{Jumlah Suara})^2$$ Mekanisme ini mencegah dominasi segelintir pihak pada usulan berbiaya rendah dan menonjolkan proyek yang paling berdampak bagi warga luas.
  • Transparansi & Pelacakan Proyek Real-Time: Menampilkan linimasa status setiap usulan secara terbuka mulai dari tahap verifikasi musyawarah, masa voting, pengerjaan fisik di lapangan, hingga audit selesai.

How we built it

  • Frontend & App Architecture: Next.js 16 (App Router) dengan optimasi kompilasi Turbopack, diintegrasikan dengan next/dynamic untuk mengisolasi komponen peta sisi peramban (client-side).
  • Styling: Tailwind CSS v4 untuk antarmuka yang modern, responsif, dan ringan.
  • WebGIS Engine: Leaflet.js dan React-Leaflet yang dikonfigurasi dengan bounding box NKRI, penanganan custom markers, serta DOM popup lifecycle.
  • Database & Geospasial: Supabase (PostgreSQL) yang dipadukan dengan ekstensi PostGIS untuk menangani geometri koordinat spasial POINT(longitude latitude).
  • Cloud Storage: Supabase Storage (proposal-images) untuk penampungan foto bukti dokumentasi warga secara publik.
  • User Feedback: React Hot Toast untuk notifikasi interaktif proses unggah asinkron dan validasi wilayah.
  • Deployment & CI/CD: GitHub dan Vercel.

Challenges we ran into

  • Isolasi Server-Side Rendering (SSR): Leaflet memerlukan objek window yang tidak tersedia saat pra-render Next.js di server, yang kami selesaikan melalui isolasi dynamic import.
  • Manajemen Event Bubbling pada WebGIS: Penanganan propagasi klik mouse (event bubbling) pada peta di mana interaksi penutupan atau pembatalan popup sempat menembus kanvas dan meletakkan pin baru tanpa sengaja. Kami mengatasinya dengan e.stopPropagation() dan sinkronisasi jeda lifecycle render DOM.
  • Konversi Geometri PostGIS: Menjembatani format data spasial PostgreSQL POINT(lng lat) agar dapat dipetakan secara dua arah ke koordinat [lat, lng] Leaflet secara presisi.

Accomplishments that we're proud of

  • Berhasil mengunci navigasi peta secara ketat di wilayah Indonesia (maxBounds viscosity) dengan validasi klik teritorial instan.
  • Alur end-to-end yang mulus mulai dari penandaan peta spasial, unggah foto bukti ke cloud storage, hingga penyimpanan koordinat ke PostGIS dan render pin otomatis tanpa memuat ulang halaman.
  • Performa aplikasi yang cepat dan siap diakses langsung di berbagai perangkat melalui Vercel.

What we learned

Kami mendalami integrasi data geospasial relasional menggunakan PostGIS di Next.js App Router, penanganan siklus hidup library mapping berbasis manipulasi DOM langsung dalam kerangka kerja modern, serta pemodelan matematis quadratic voting untuk tata kelola pemerintahan partisipatif.

What's next for Pantau Desa

  • Integrasi verifikasi kependudukan NIK berbasis DPT desa dan OTP WhatsApp.
  • Fitur pengajuan hak suara domisili perantau secara kolektif berbasis Kartu Keluarga (KK).
  • Dasbor leaderboard prioritas anggaran desa dengan simulasi garis batas pagu dana (budget cut-off line).

Built With

  • nextjs
  • supabase
  • vercel
Share this project:

Updates

Submission history