ERP Warteg - Sistem Manajemen Warteg

Aplikasi ERP (Enterprise Resource Planning) khusus untuk manajemen warteg yang dibuat dengan Next.js dan Tailwind CSS. Aplikasi ini menyediakan fitur lengkap untuk mengelola produk, transaksi, statistik penjualan, dan laporan stock.

🚀 Fitur Utama

1. Dashboard

• Ringkasan statistik penjualan
• Grafik penjualan mingguan
• Distribusi produk terlaris
• Transaksi terbaru
• Alert stock menipis

2. Manajemen Produk (CRUD)

• Tambah, edit, dan hapus produk
• Kategorisasi produk
• Pencarian dan filter produk
• Monitoring stock produk
• Foto produk (placeholder)

3. Riwayat Transaksi

• Daftar lengkap transaksi
• Detail transaksi dengan item breakdown
• Filter berdasarkan tanggal dan pelanggan
• Statistik transaksi harian

4. Statistik Penjualan

• Grafik tren penjualan harian
• Performa vs target bulanan
• Pola transaksi per jam
• Top produk terlaris
• Metrics penjualan utama

5. Laporan Stock

• Monitoring stock real-time
• Alert stock kritis dan rendah
• Estimasi habis stock
• Export laporan ke CSV
• Filter berdasarkan kategori dan status

🛠️ Teknologi yang Digunakan

• Frontend Framework: Next.js 14 dengan App Router
• Styling: Tailwind CSS
• Icons: Heroicons
• Charts: Recharts
• Language: TypeScript
• Data: Static dummy data (untuk showcase)

📦 Instalasi dan Menjalankan

1. Clone repository

   git clone [repository-url]
   cd erp-warteg

2. Install dependencies

   npm install

3. Jalankan development server

   npm run dev

4. Buka aplikasi Akses http://localhost:3000 di browser

🏗️ Struktur Project

erp-warteg/
├── app/                      # App Router pages
│   ├── layout.tsx           # Root layout
│   ├── page.tsx             # Dashboard page
│   ├── products/page.tsx    # Products management
│   ├── transactions/page.tsx # Transactions history
│   ├── statistics/page.tsx  # Sales statistics
│   ├── stock-report/page.tsx # Stock reports
│   └── globals.css          # Global styles
├── components/              # Reusable components
│   ├── Dashboard.tsx        # Dashboard components
│   ├── Header.tsx           # App header
│   └── Sidebar.tsx          # Navigation sidebar
├── public/                  # Static assets
└── [config files]          # Next.js, Tailwind, TypeScript configs

📊 Data Dummy

Aplikasi ini menggunakan data dummy untuk showcase meliputi:

• Produk: Makanan warteg seperti nasi gudeg, ayam goreng, sayur lodeh, dll
• Transaksi: Riwayat pembelian dengan detail item dan pelanggan
• Stock: Data inventory dengan status normal, rendah, dan kritis
• Statistik: Data penjualan, grafik, dan metrics

🎨 Fitur UI/UX

• Responsive Design: Optimized untuk desktop, tablet, dan mobile
• Modern Interface: Clean dan professional design
• Interactive Charts: Visualisasi data yang menarik
• Real-time Feedback: Loading states dan notifications
• Accessible: Following web accessibility standards

🔧 Kustomisasi

Menambah Halaman Baru

1. Buat file di folder app/[nama-halaman]/page.tsx
2. Tambahkan route di components/Sidebar.tsx
3. Buat komponen UI sesuai kebutuhan

Mengubah Data Dummy

Data dummy tersimpan langsung di setiap komponen page. Untuk aplikasi production, ganti dengan:

• API calls ke backend
• Database integration
• State management (Redux/Zustand)

Styling

• Gunakan Tailwind CSS classes
• Custom components di app/globals.css
• Tambah theme configuration di tailwind.config.js

📈 Roadmap Pengembangan

• Integration dengan database (PostgreSQL/MongoDB)
• API backend (Express.js/Fastify)
• Authentication & authorization
• Real-time notifications
• Mobile app version
• Print receipt functionality
• Multi-location support
• Advanced reporting

📄 License

Project ini dibuat untuk tujuan showcase dan pembelajaran. Silakan digunakan dan dimodifikasi sesuai kebutuhan.

👥 Kontribusi

Contributions, issues, dan feature requests sangat diterima!

---

Dibuat dengan ❤️ untuk komunitas warteg Indonesia