Jelajahi Warisan Budaya, Kuliner Legendaris, dan Kisah Akulturasi di Glodok
๐ Demo โข ๐ Dokumentasi โข ๐จ Fitur โข ๐ป Instalasi
Museum Hidup Jakarta Barat adalah platform digital interaktif yang mengajak Anda menjelajahi Glodok dan kawasan Jakarta Barat bukan sekadar sebagai tempat wisata kuliner, tetapi sebagai museum yang hidup - tempat di mana sejarah, budaya, dan tradisi masih bernapas di setiap sudutnya.
- ๐๏ธ Melestarikan Warisan Budaya - Mendokumentasikan dan mempromosikan warisan budaya Tionghoa-Indonesia
- ๏ฟฝ Mengangkat Kuliner Legendaris - Memperkenalkan kuliner turun-temurun yang penuh cerita
- ๐ค Merayakan Toleransi - Menampilkan harmoni dan akulturasi budaya yang indah
- ๐ Edukasi Interaktif - Memberikan pengalaman belajar yang menyenangkan tentang sejarah lokal
Konsep unik yang menghadirkan Glodok sebagai museum terbuka dengan:
- Akulturasi Budaya - Kisah perpaduan kuliner Tionghoa dan rempah Nusantara
- Toleransi & Harmoni - Cerita kerukunan antar budaya dan agama
- Arsitektur Bersejarah - Eksplorasi bangunan kolonial dan gaya Indische
Timeline interaktif sejarah Glodok dari tahun 1610 hingga era modern:
- Timeline visual dengan animasi smooth
- Fakta-fakta unik tentang Glodok
- Profil arsitektur khas Tionghoa-Belanda
Katalog lengkap kuliner legendaris dengan:
- Kuliner Halal - Cempedak Goreng, Gado-Gado Direksi, Rujak Shanghai, Kopi Es Tak Kie
- The Old Masters - Kuliner non-halal turun-temurun 3-4 generasi
- Rating, harga, lokasi, dan cerita di balik setiap hidangan
- Fitur favorit untuk menyimpan kuliner pilihan
Profil pedagang legendaris dengan:
- Kisah hidup dan dedikasi mereka
- Quote inspiratif tentang warisan budaya
- Foto dan informasi toko mereka
Rute jalan kaki yang telah dirancang:
- Heritage Walk (1 jam) - Fokus arsitektur dan sejarah
- Culinary Adventure (2 jam) - Wisata kuliner lengkap
- Informasi transportasi (TransJakarta, KRL, Ojol, Mobil Pribadi)
Glosarium istilah budaya Tionghoa-Indonesia:
- Ciam Si, Pecinan, Cap Go Meh, Sekba, dan lainnya
- Penjelasan konteks penggunaan
- Membantu pemahaman budaya lokal
Kalkulator budget wisata:
- Paket Pelajar Hemat (Rp 50.000)
- Paket Kenyang Sultan (Rp 150.000)
- Tips hemat dan rekomendasi
Koleksi foto berkualitas tinggi:
- Lightbox interaktif
- Foto arsitektur, festival, dan kehidupan sehari-hari
- Optimasi gambar dengan Sharp
- โก Next.js 16 - React framework dengan App Router
- ๐ TypeScript 5 - Type-safe development
- ๏ฟฝ Tailwind CSS 4 - Utility-first CSS framework
- ๏ฟฝ Framer Motion - Smooth animations & transitions
- ๐จ shadcn/ui - High-quality accessible components
- ๐ฏ Lucide React - Beautiful icon library
- ๐ Radix UI - Unstyled, accessible components
- ๏ฟฝ Zustand - Lightweight state management
- ๏ฟฝ TanStack Query - Data fetching & caching
- ๏ฟฝ๏ธ Prisma - Type-safe ORM
- ๐ Recharts - Data visualization
- ๐ Date-fns - Date utilities
- ๐ผ๏ธ Sharp - Image optimization
- ๐ฃ React Hook Form + Zod - Form validation
- Bun >= 1.3.4 (atau Node.js >= 18)
- Git
# 1. Clone repository
git clone https://github.com/username/jakbar-mulok4.git
cd jakbar-mulok4
# 2. Install dependencies
bun install
# 3. Setup database (opsional)
bun run db:push
# 4. Jalankan development server
bun run devBuka http://localhost:3000 di browser Anda.
# Build aplikasi
bun run build
# Jalankan production server
bun startjakbar-mulok4/
โโโ src/
โ โโโ app/ # Next.js App Router
โ โ โโโ page.tsx # Homepage utama
โ โ โโโ layout.tsx # Root layout
โ โโโ components/ # React components
โ โ โโโ ui/ # shadcn/ui components
โ โโโ hooks/ # Custom React hooks
โ โโโ lib/ # Utilities & configs
โโโ public/
โ โโโ images/ # Asset gambar
โโโ prisma/ # Database schema
โโโ package.json
โโโ README.md
- Parallax scrolling pada hero section
- Fade-in animations saat scroll ke section
- Hover effects pada cards dan buttons
- Smooth transitions antar halaman
- Sticky navigation dengan active state indicator
- Mobile-responsive dengan hamburger menu
- Lightbox gallery untuk foto
- Favorite system untuk menyimpan kuliner favorit
- Smooth scroll ke section tertentu
- Responsive di semua ukuran layar
- Touch-friendly interactions
- Optimized images untuk mobile
- Fast loading dengan lazy loading
- Primary: Red-Orange gradient (
from-red-600 to-orange-600) - Secondary: Green-Teal gradient (
from-green-600 to-teal-600) - Background: Warm gradients (
from-orange-50 via-white to-red-50) - Accent: Gold untuk elemen budaya Tionghoa
- Ikon: Lucide React dengan tema heritage
- Typography: System fonts dengan hierarchy yang jelas
- Imagery: Foto berkualitas tinggi dari Glodok
- Spacing: Generous whitespace untuk readability
- Beranda - Hero section dengan CTA
- Jelajahi - Museum Hidup, Jejak Masa Lalu, Wajah Jakarta
- Kuliner - Peta Rasa dengan katalog lengkap
- Panduan - Panduan Jelajah, Kamus Budaya, Estimasi Budget
- Galeri - Koleksi foto
- Kontak - Informasi kontak
Setiap item kuliner memiliki:
{
id: string
name: string
description: string
price: number
rating: number
location: string
image: string
isHalal: boolean
story: string
generations?: number // untuk Old Masters
}{
id: number
name: string
duration: string
distance: string
stops: string[]
highlights: string[]
bestTime: string
image: string
}Kami sangat terbuka untuk kontribusi! Jika Anda ingin berkontribusi:
- Fork repository ini
- Buat branch fitur (
git checkout -b feature/AmazingFeature) - Commit perubahan (
git commit -m 'Add some AmazingFeature') - Push ke branch (
git push origin feature/AmazingFeature) - Buat Pull Request
- ๐บ๏ธ Menambah rute jalan kaki baru
- ๐ Menambah data kuliner legendaris
- ๐ธ Kontribusi foto berkualitas tinggi
- ๐ Terjemahan ke bahasa lain
- ๐จ Perbaikan UI/UX
# Development
bun run dev # Jalankan dev server di port 3000
# Build
bun run build # Build untuk production
# Production
bun start # Jalankan production server
# Database
bun run db:push # Push schema ke database
bun run db:generate # Generate Prisma Client
bun run db:migrate # Jalankan migrations
bun run db:reset # Reset database
# Linting
bun run lint # Jalankan ESLint- Landing page dengan hero section
- Katalog kuliner halal & non-halal
- Timeline sejarah interaktif
- Profil pedagang legendaris
- Panduan rute jalan kaki
- Kamus budaya
- Estimasi budget
- Galeri foto dengan lightbox
- Integrasi Google Maps untuk navigasi
- Sistem booking tour guide
- Review & rating dari pengunjung
- Blog artikel tentang sejarah & budaya
- Augmented Reality (AR) untuk heritage tour
- Multi-language support (EN, CN)
- Mobile app (React Native)
- Virtual tour 360ยฐ
- Podcast cerita pedagang legendaris
- E-commerce untuk oleh-oleh khas
- Kolaborasi dengan Dinas Pariwisata DKI
Dikembangkan dengan โค๏ธ oleh tim yang peduli dengan pelestarian warisan budaya Jakarta Barat.
- Email: info@museumhidupjakbar.id
- Instagram: @museumhidupjakbar
- Website: www.museumhidupjakbar.id
Terima kasih kepada:
- Para pedagang legendaris Glodok yang telah menjaga warisan budaya
- Komunitas Jakarta Barat yang mendukung pelestarian budaya
- Fotografer yang berkontribusi foto-foto indah
- Open source community untuk tools dan libraries yang luar biasa