Regarmarket
RegarMarket Web adalah versi berbasis web resmi dari ekosistem e-commerce RegarSport, menghadirkan pengalaman marketplace yang sama seperti aplikasi mobile — dapat diakses langsung dari browser tanpa instalasi, dilengkapi pengalaman desain 3D yang imersif menggunakan Three.js.
Project ini dibangun untuk memperluas jangkauan digital RegarSport melampaui pengguna mobile — memastikan pelanggan dan afiliator yang lebih nyaman menggunakan desktop atau browser tetap bisa mengakses marketplace secara penuh, termasuk fitur unggulan kustomisasi desain 3D.
Fitur utama:
Katalog produk sandang pre-order custom (jersey olahraga, kemeja, apparel komunitas, hijab, dll.) dan produk UMKM lokal
Sistem afiliasi berbasis referral link dengan mekanisme komisi berkelanjutan
Input dan preview desain 3D real-time menggunakan Three.js — pengguna bisa membuat dan memvisualisasikan desain custom secara tiga dimensi langsung di browser
Alur transaksi digital mandiri yang mudah dan intuitif
Desain responsif yang dioptimalkan untuk pengalaman desktop maupun mobile browser
Tantangan teknis: Mengintegrasikan Three.js di dalam environment Next.js memerlukan penanganan khusus terhadap konflik server-side rendering (SSR) — karena Three.js bersifat browser-dependent, strategi dynamic import dan client-side rendering menjadi krusial. Memastikan rendering 3D yang mulus dan performatif di berbagai browser dan perangkat sambil tetap menjaga page load time yang cepat menambah lapisan kompleksitas tersendiri.
Dampak: Memperluas jangkauan marketplace digital RegarSport ke pengguna web, menghadirkan pengalaman belanja dan kustomisasi desain yang konsisten dan imersif di seluruh platform, baik mobile maupun desktop.
Galeri:
Peran
Front-End Developer
Dirilis
Juli 2024
Teknologi
Poin Utama
- Membangun aplikasi web e-commerce responsif menggunakan Next.js dan Tailwind CSS
- Mengintegrasikan Three.js untuk input dan preview desain 3D real-time langsung di browser
- Menangani konflik SSR/client-side rendering saat mengintegrasikan Three.js dalam framework Next.js
- Mengimplementasikan sistem afiliasi berbasis referral dengan tracking komisi berkelanjutan di platform web
- Mengoptimalkan performa rendering 3D di berbagai browser dan perangkat untuk pengalaman pengguna yang mulus