E-Commerce, Web Application, Full Stack Development, School Management System

SmenzaGift - Web Store Sekolah

Platform e-commerce internal untuk koperasi/toko sekolah yang memungkinkan siswa membeli produk (snack, alat tulis, merchandise, seragam) secara online, dengan sistem pemesanan real-time dan dashboard admin, terinspirasi dari aplikasi Alfagift.

Tangkapan Layar & Galeri

SmenzaGift - Web Store Sekolah screenshot 1

SmenzaGift - Web Store Sekolah screenshot 2

SmenzaGift - Web Store Sekolah screenshot 3

SmenzaGift - Web Store Sekolah screenshot 4

SmenzaGift - Web Store Sekolah screenshot 5

SmenzaGift - Web Store Sekolah screenshot 6

SmenzaGift - Web Store Sekolah screenshot 7

Konteks & Solusi Teknis

SmenzaGift adalah aplikasi web store berbasis sekolah yang mereplikasi pengalaman belanja e-commerce ritel (mirip Alfagift/Alfamart) namun disederhanakan untuk skala koperasi sekolah. Siswa dapat login, menjelajahi katalog produk berdasarkan kategori (Food, Non-Food, Alat Tulis, Merchandise, Seragam), menambahkan produk ke keranjang, lalu melakukan checkout dengan memilih metode pengambilan (delivery ke kelas atau ambil sendiri) dan metode pembayaran (cash atau QRIS dengan upload bukti bayar). Setiap pesanan memiliki status yang dapat dilacak (Menunggu → Diproses → Diantar → Selesai/Batal) beserta riwayat perubahan statusnya. Sistem juga dilengkapi notifikasi real-time menggunakan WebSocket (dengan fallback Server-Sent Events) yang memberi tahu admin saat ada pesanan baru dan memberi tahu user saat status pesanan berubah, lengkap dengan efek suara notifikasi. Untuk sisi Admin/Superadmin, tersedia dashboard manajemen produk (dengan harga coret & diskon otomatis), kategori, verifikasi pesanan & pembayaran, pengelolaan promo/banner carousel di halaman utama, pengaturan sistem (nomor WhatsApp toko, dll.), manajemen user, serta role superadmin khusus untuk kontrol akses lebih tinggi. Arsitektur proyek ini unik dibanding kedua project sebelumnya karena memisahkan backend (Go + Gin + MySQL) sebagai REST API murni dari frontend (Next.js) sebagai client, alih-alih menyatukan keduanya dalam satu aplikasi Next.js full-stack.

Fitur yang Dibangun

Autentikasi & registrasi dengan verifikasi OTP
lupa password dengan OTP
katalog produk berkategori dengan diskon otomatis
keranjang & checkout
pilihan metode pengiriman (delivery/self-pickup)
pilihan pembayaran (cash/QRIS + upload bukti)
tracking status & riwayat pesanan
notifikasi real-time (WebSocket + SSE) dengan suara
dashboard admin (produk
kategori
pesanan
promo
pengaturan)
manajemen banner promo carousel
role-based access (superadmin/admin/user)
upload foto produk

Teknologi yang Digunakan

Next.js (ReactJavaScript/JSX) untuk frontendTailwind CSS untuk stylingGo (Golang) dengan framework Gin untuk backend REST APIMySQL sebagai databaseWebSocket (Gorilla WebSocket) & Server-Sent Events untuk notifikasi real-timeJWT/session untuk autentikasigodotenv untuk manajemen environment variable

Kunjungi Website Langsung ↗Repository GitHub ← Kembali ke Portofolio

Punya kebutuhan proyek serupa?

Ceritakan rencana usaha Anda, saya bantu siapkan website atau modul sistem web yang rapi, cepat dibuka, dan mudah dikelola.

Diskusi via WhatsApp →