Cover Website Resmi Desa Bajawali
Kembali ke Beranda

Website Resmi Desa Bajawali

Portal digital Desa Bajawali untuk informasi profil, statistik, potensi, berita, galeri, dan layanan desa.

Kategori

web

Dipublikasikan

28 September 2026

Teknologi

Next.jsReact .jsTypeScriptTailwind CSSSupabaseChart.jsGSAPTiptapLucide React

Website Resmi Desa Bajawali

Tentang Proyek

Website Resmi Desa Bajawali adalah portal informasi digital untuk Desa Bajawali, Kecamatan Lariang, Kabupaten Pasangkayu, Sulawesi Barat. Website ini dikembangkan untuk menyatukan berbagai informasi desa yang sebelumnya tersebar ke dalam satu platform digital yang terstruktur, responsif, dan mudah dikelola.

Platform mencakup informasi profil desa, sejarah, geografis, demografi, struktur pemerintahan, potensi wilayah, berita dan kegiatan, galeri dokumentasi, statistik, kontak, serta sistem administrasi untuk pengelolaan konten.

Proyek ini dikembangkan oleh Posko Desa Bajawali — Universitas Muhammadiyah Mamuju.


Masalah

Informasi desa membutuhkan sebuah media digital yang dapat menyajikan data secara terstruktur sekaligus memudahkan masyarakat memperoleh informasi tanpa harus mencari melalui berbagai sumber.

Beberapa kebutuhan utama yang ditemukan dalam pengembangan:

- Informasi profil, pemerintahan, potensi, berita, dan kontak perlu disatukan dalam satu portal.

- Data desa perlu disajikan dalam bentuk yang lebih mudah dipahami masyarakat.

- Dokumentasi kegiatan membutuhkan media publikasi yang terstruktur.

- Konten website perlu dapat dikelola oleh administrator tanpa melakukan perubahan langsung pada source code.

- Informasi publik perlu memiliki struktur navigasi yang jelas dan responsif pada desktop maupun mobile.

- Data yang berasal dari sumber lokal dan database perlu tetap dapat ditampilkan melalui mekanisme fallback.


Tujuan Pengembangan

Website dikembangkan dengan tujuan:

1. Menyediakan pusat informasi digital resmi Desa Bajawali.

2. Mengintegrasikan berbagai informasi desa dalam satu platform.

3. Menyajikan data statistik melalui visualisasi yang lebih mudah dipahami.

4. Menyediakan CMS untuk pengelolaan konten website.

5. Membangun pengalaman pengguna yang responsif dan konsisten.

6. Menyiapkan arsitektur yang dapat dikembangkan menuju sistem informasi desa yang lebih lengkap.


Pendekatan Kuantitatif

Pengembangan dilakukan dengan menggunakan indikator kuantitatif untuk menggambarkan cakupan sistem yang berhasil dibangun.

Cakupan Sistem

- 18 rute publik telah dibangun.

- 6 halaman profil desa tersedia.

- 6 halaman potensi desa tersedia.

- 6 visualisasi data menggunakan Chart.js.

- 13 foto dokumentasi tersedia pada galeri.

- 3 berita kegiatan telah diintegrasikan.

- 4 role/menu utama tersedia pada navigasi mobile.

- Sistem admin memiliki modul untuk profil, pengguna, data desa, pemerintahan, potensi, website, berita, dan galeri.

- Validasi TypeScript, linting, dan production build berhasil dijalankan.

Data publik juga mencakup statistik dasar Desa Bajawali seperti 835 penduduk, 257 kepala keluarga, 4 dusun, dan 8 RT berdasarkan data Profil Desa Bajawali 2026.


STAR Method

Situation — Situasi

Desa Bajawali membutuhkan media digital yang mampu menyajikan informasi desa secara terpusat. Informasi seperti profil, sejarah, struktur pemerintahan, potensi desa, statistik, berita, dokumentasi kegiatan, dan kontak perlu tersedia dalam sebuah platform yang mudah diakses masyarakat.

Selain kebutuhan informasi publik, terdapat kebutuhan internal agar administrator dapat mengelola konten website tanpa harus mengubah source code secara langsung.

Task — Tugas

Tugas pengembangan adalah membangun website desa yang:

- Responsif pada desktop dan mobile.

- Memiliki struktur informasi yang jelas.

- Menampilkan data desa secara informatif.

- Memiliki sistem berita dan galeri.

- Memiliki autentikasi administrator.

- Memiliki CMS untuk pengelolaan konten.

- Menggunakan database untuk menyimpan data domain.

- Tetap memiliki fallback data lokal ketika data dari database belum tersedia.

- Memiliki desain visual yang konsisten dengan karakter Desa Bajawali.

Action — Tindakan

Website dibangun menggunakan Next.js 16 App Router, React 19, TypeScript, dan Tailwind CSS v4 sebagai fondasi utama.

Untuk pengelolaan data dan autentikasi digunakan Supabase, sementara Chart.js digunakan untuk membuat enam jenis visualisasi statistik desa.

Beberapa implementasi utama yang dilakukan:

- Membangun arsitektur 18 rute publik.

- Membuat halaman profil desa, potensi, berita, galeri, data desa, dan kontak.

- Membuat sistem berita berbasis slug dengan halaman detail dinamis.

- Membuat galeri dengan filter kategori.

- Membuat enam visualisasi statistik menggunakan Chart.js.

- Membuat autentikasi dan route protection untuk administrator.

- Membuat dashboard CMS dengan modul konten dan ringkasan data.

- Mengintegrasikan Supabase sebagai sumber data utama dengan fallback ke data lokal.

- Menggunakan GSAP ScrollTrigger untuk animasi halaman.

- Membuat lightbox untuk diagram struktur pemerintahan.

- Membuat navigasi desktop dan mobile yang berbeda sesuai kebutuhan perangkat.

- Menggunakan design system Civic Editorial / Rural Modern untuk menjaga konsistensi visual.

Result — Hasil

Hasil pengembangan berupa portal digital desa yang mencakup informasi publik dan sistem pengelolaan konten dalam satu platform.

Website berhasil menyediakan 18 rute publik, 6 halaman profil, 6 halaman potensi, 6 visualisasi statistik, serta sistem berita, galeri, kontak, autentikasi, dan CMS.

Data desa juga dapat ditampilkan dalam bentuk statistik dan grafik sehingga informasi tidak hanya tersedia sebagai teks, tetapi dapat dipahami melalui representasi visual.

Pada sisi teknis, proyek berhasil melewati validasi TypeScript, ESLint, dan production build Next.js tanpa error.

Muhammad Makbul NFull Stack Developer
© 2026 Dibangun dengan hati