Lewati ke konten utama
WebBerjalan

NearBy Balikpapan

Direktori UMKM berbasis lokasi untuk menemukan usaha kecil menengah terdekat di Balikpapan.

  • Vue
  • Vue Router
  • TypeScript
  • Vite
  • Tailwind CSS
  • Pinia
  • Three.js
Halaman utama NearBy Balikpapan dengan pencarian UMKM dan kartu usaha unggulan

Ringkasan

NearBy Balikpapan adalah platform web yang membantu warga menemukan dan mengenal Usaha Mikro, Kecil, dan Menengah (UMKM) di Balikpapan, Kalimantan Timur. Platform ini menyajikan informasi usaha lokal berbasis lokasi untuk mendukung transformasi digital pelaku usaha kecil.

Peran Saya

Proyek ini dikerjakan secara berkelompok sebagai inisiatif akademik mahasiswa Institut Teknologi Kalimantan. Saya berperan sebagai Front-End Developer dan UI/UX Designer: menyusun desain antarmuka dan alur pengguna, menerjemahkannya menjadi komponen Vue yang responsif, serta mengerjakan halaman katalog, pencarian, filter, dan profil usaha di sisi klien.

Masalah

Banyak UMKM di Balikpapan belum punya kehadiran digital yang mudah ditemukan, sementara warga kesulitan mencari usaha lokal terdekat, karena informasinya tersebar dan tidak terpusat.

Solusi

NearBy Balikpapan menyatukan katalog UMKM dalam satu direktori yang bisa dicari dan difilter, dengan penemuan berbasis lokasi untuk menampilkan usaha terdekat, profil usaha yang rinci, dan sistem rekomendasi. Fokus desain saya adalah membuat pencarian terasa cepat dan tampilan tetap jelas di layar kecil.

Fitur

  • Katalog UMKM dengan pencarian dan filter kategori
  • Penemuan usaha terdekat berbasis lokasi
  • Halaman profil usaha yang rinci
  • Sistem rekomendasi usaha
  • Antarmuka responsif untuk perangkat mobile

Teknologi yang Digunakan

Di sisi front-end saya memakai Vue 3 (Composition API) dan TypeScript di atas Vite, dengan Tailwind CSS untuk styling dan Pinia untuk state management. Desain antarmuka dan prototipe alur pengguna saya kerjakan lebih dulu sebelum implementasi.

Tantangan

Menyelaraskan desain dengan data nyata dari backend yang masih berkembang, serta menjaga pencarian dan filter tetap responsif saat jumlah usaha terdaftar bertambah.

Hal-hal yang Saya Pelajari

Proyek ini melatih kerja lintas peran dalam satu tim, menyerahkan desain yang bisa langsung diimplementasikan, menyepakati kontrak API dengan tim backend, dan menjaga konsistensi komponen UI selama fitur terus bertambah.

Hasil

NearBy Balikpapan sudah berjalan di nearbybalikpapan.com dengan UMKM, kategori, dan cakupan kecamatan yang terus bertambah, dan masih dalam pengembangan aktif.

Tautan

Proyek Terkait

  • Halaman utama WinterRa dengan judul bertema salju dan efek partikel 3D
    WebSelesai

    WinterRa

    Platform liburan akhir tahun interaktif dengan pengalaman 3D, kalkulator budget, dan checklist packing.

    • vue
    • vue-router
    • vite
    • tailwind
  • Halaman utama SafeRoute menampilkan panel risiko lokal dan status cuaca real-time
    WebSelesai

    SafeRoute

    Platform kesiapsiagaan bencana dengan peta risiko interaktif, cuaca real-time, dan jalur evakuasi.

    • vue
    • vue-router
    • vite
    • pinia
  • Halaman utama DisasterSense AI dengan tombol cek risiko dan ringkasan fitur
    WebSelesai

    DisasterSense AI

    Sistem peringatan dini bencana yang menghitung tingkat risiko otomatis dari data cuaca real-time berbasis lokasi.

    • react
    • react-router
    • typescript
    • vite

© 2026 Christian Imanuel Admojo