232 lines
5.3 KiB
Markdown
232 lines
5.3 KiB
Markdown
# 🚀 Quick Start Guide - TelurKu
|
|
|
|
## Hal yang Sudah Dibuat ✅
|
|
|
|
### 1. **Landing Page**
|
|
- Tampilan awal dengan logo TelurKu
|
|
- Tombol "Masuk" dan "Daftar Akun Baru"
|
|
- Design dengan gradient background
|
|
|
|
### 2. **Login Page**
|
|
- Form dengan email dan password
|
|
- Tombol "Lupa Password?" (placeholder untuk fitur nanti)
|
|
- Link ke halaman signup
|
|
- Error handling dan loading state
|
|
|
|
### 3. **Signup Page**
|
|
- Form: Nama, Email, Password, Konfirmasi Password
|
|
- Checkbox terms & conditions
|
|
- Validation lengkap
|
|
- Link ke halaman login
|
|
|
|
### 4. **Home/Dashboard Page**
|
|
- Greeting dengan nama user
|
|
- Card "Panen Hari Ini" dengan jadwal
|
|
- Card "Kondisi Kandang" dengan jadwal
|
|
- User profile menu dengan logout
|
|
|
|
### 5. **Firebase Integration**
|
|
- Firebase Auth untuk login/signup
|
|
- Cloud Firestore ready (belum digunakan)
|
|
- Auth Provider untuk state management
|
|
- Multi-platform support (Android, iOS, Web)
|
|
|
|
---
|
|
|
|
## 🎯 Langkah Selanjutnya (URGENT)
|
|
|
|
### 1. **Setup Firebase** ⚡
|
|
**File: `FIREBASE_SETUP.md`**
|
|
|
|
Ikuti panduan untuk:
|
|
- ✅ Buat project di Firebase Console
|
|
- ✅ Setup Android (download google-services.json)
|
|
- ✅ Setup iOS (download GoogleService-Info.plist)
|
|
- ✅ Update `lib/firebase_options.dart` dengan credentials
|
|
|
|
### 2. **Siapkan Assets** 📁
|
|
|
|
Buat folder struktur:
|
|
```
|
|
assets/
|
|
├── images/
|
|
│ └── logo.png (SIAPKAN LOGO TELURKU)
|
|
└── icons/
|
|
```
|
|
|
|
### 3. **Test Aplikasi** 🧪
|
|
```bash
|
|
# Bersihkan project
|
|
flutter clean
|
|
|
|
# Get dependencies
|
|
flutter pub get
|
|
|
|
# Run aplikasi
|
|
flutter run
|
|
```
|
|
|
|
---
|
|
|
|
## 📋 Struktur Project
|
|
|
|
```
|
|
lib/
|
|
├── main.dart # Entry point + Firebase setup
|
|
├── firebase_options.dart # Firebase credentials (UPDATE INI!)
|
|
├── providers/
|
|
│ └── auth_provider.dart # Authentication logic
|
|
├── screens/
|
|
│ ├── landing_page.dart # Landing page
|
|
│ ├── login_page.dart # Login form
|
|
│ ├── signup_page.dart # Register form
|
|
│ └── home_page.dart # Dashboard
|
|
└── models/ # (akan ditambahkan nanti)
|
|
```
|
|
|
|
---
|
|
|
|
## 🔐 Fitur Yang Sudah Ada
|
|
|
|
### Authentication
|
|
- ✅ Sign Up (email + password)
|
|
- ✅ Login (email + password)
|
|
- ✅ Logout
|
|
- ✅ Error handling
|
|
- ⏳ Reset Password (placeholder route tersedia)
|
|
|
|
### UI/UX
|
|
- ✅ Landing page
|
|
- ✅ Login form
|
|
- ✅ Signup form
|
|
- ✅ Dashboard dengan user info
|
|
- ✅ Gradient background
|
|
- ✅ Responsive design
|
|
|
|
### State Management
|
|
- ✅ Provider untuk Auth
|
|
- ✅ Loading states
|
|
- ✅ Error messages
|
|
- ✅ Auto-redirect based on login status
|
|
|
|
---
|
|
|
|
## 🎨 Design System
|
|
|
|
### Colors
|
|
- **Primary Yellow**: `#F4D03F` (TelurKu brand)
|
|
- **Orange**: `#FF9800` (accent)
|
|
- **Green**: Soft green untuk background
|
|
- **Grey**: Various shades untuk text
|
|
|
|
### Typography
|
|
- Heading: 32-48px, Bold
|
|
- Body: 14-16px, Regular
|
|
- Caption: 12-14px, Regular
|
|
|
|
### Components
|
|
- Rounded corners: 12-20px
|
|
- Shadows: Subtle (0.1 opacity)
|
|
- Buttons: 56px height minimum
|
|
|
|
---
|
|
|
|
## 📱 Testing Checklist
|
|
|
|
- [ ] Landing page tampil saat app dibuka
|
|
- [ ] Klik "Masuk" → Login page muncul
|
|
- [ ] Klik "Daftar Akun Baru" → Signup page muncul
|
|
- [ ] Dari signup → klik link "Daftar" → user terdaftar di Firebase
|
|
- [ ] Dari login → masukkan credentials yang sudah signup → berhasil login
|
|
- [ ] Setelah login → Home page dengan greeting
|
|
- [ ] Klik profile → logout → kembali ke landing page
|
|
|
|
---
|
|
|
|
## 🐛 Troubleshooting
|
|
|
|
### Firebase Error
|
|
```
|
|
PlatformException: Platform exception from Firebase
|
|
```
|
|
**Solusi:**
|
|
- Update `firebase_options.dart` dengan credentials yang benar
|
|
- Pastikan `google-services.json` ada di `android/app/`
|
|
|
|
### Assets Not Found
|
|
```
|
|
FileSystemException: Cannot open file
|
|
```
|
|
**Solusi:**
|
|
- Buat folder `assets/images/`
|
|
- Pastikan `pubspec.yaml` sudah mengaktifkan assets
|
|
- Restart aplikasi dengan `flutter run`
|
|
|
|
### Hot Reload Error
|
|
```
|
|
Hot reload failed
|
|
```
|
|
**Solusi:**
|
|
- Gunakan `flutter clean`
|
|
- Gunakan Hot Restart (Shift+Ctrl+F5)
|
|
|
|
---
|
|
|
|
## 📚 Dependencies
|
|
|
|
```yaml
|
|
firebase_core: ^3.3.0 # Firebase
|
|
firebase_auth: ^5.1.4 # Authentication
|
|
cloud_firestore: ^5.1.0 # Database
|
|
provider: ^6.1.0 # State management
|
|
google_fonts: ^6.2.1 # Fonts
|
|
```
|
|
|
|
---
|
|
|
|
## 💡 Tips & Tricks
|
|
|
|
1. **Hot Reload**: Tekan `r` di terminal untuk reload code
|
|
2. **Hot Restart**: Tekan `Shift + R` untuk restart state
|
|
3. **Clean Build**: `flutter clean && flutter pub get`
|
|
4. **Debug**: Lihat error stack di bottom panel VS Code
|
|
5. **Firebase Console**: Monitor user dari https://console.firebase.google.com
|
|
|
|
---
|
|
|
|
## 📞 Next Phase (Belum Dikerjakan)
|
|
|
|
1. **Dashboard Features**
|
|
- [ ] Real-time data dari Firestore
|
|
- [ ] Charts untuk statistik panen
|
|
- [ ] Notifikasi jadwal
|
|
|
|
2. **Fitur Panen**
|
|
- [ ] Input data panen
|
|
- [ ] History panen
|
|
- [ ] Export laporan
|
|
|
|
3. **Fitur Kandang**
|
|
- [ ] Input kondisi kandang
|
|
- [ ] Alert kesehatan
|
|
- [ ] Inventory feed/obat
|
|
|
|
4. **User Profile**
|
|
- [ ] Edit profile
|
|
- [ ] Foto profile
|
|
- [ ] Settings
|
|
|
|
5. **Database**
|
|
- [ ] Firestore rules
|
|
- [ ] Data validation
|
|
- [ ] Backup strategy
|
|
|
|
---
|
|
|
|
## ✅ Done!
|
|
|
|
Login & Signup sudah fully functional dengan Firebase!
|
|
Tinggal setup Firebase credentials dan siap untuk phase 2.
|
|
|
|
Good luck! 🍀
|