FP PPB

SayurBox App - Aplikasi Belanja Sayur Online

🥬 SayurBox App - Aplikasi Belanja Sayur Online

SayurBox adalah aplikasi mobile e-commerce yang memfokuskan pada penjualan sayur-sayuran dan produk segar secara online. Aplikasi ini menyediakan platform yang mudah digunakan untuk berbelanja kebutuhan sayur-mayur dengan fitur lengkap seperti katalog produk, keranjang belanja, sistem favorit, dan manajemen pesanan yang terintegrasi.

📊 Presentasi Aplikasi

Green Purple Digitalism Basic Simple Presentation by Rafif Hikmatiar
Authentication System Implementation
class AuthViewModel : ViewModel() {
    private val _authState = MutableStateFlow(AuthState())
    val authState: StateFlow<AuthState> = _authState.asStateFlow()
    
    fun signUp(email: String, password: String, name: String) {
        _authState.value = _authState.value.copy(isLoading = true)
        
        viewModelScope.launch {
            try {
                val user = userRepository.createUser(
                    email = email,
                    password = password,
                    fullName = name
                )
                _authState.value = _authState.value.copy(
                    isLoading = false,
                    user = user,
                    isAuthenticated = true
                )
            } catch (e: Exception) {
                _authState.value = _authState.value.copy(
                    isLoading = false,
                    errorMessage = e.message
                )
            }
        }
    }
}

🔐 Authentication System

AuthViewModel mengelola proses sign up dan sign in dengan validasi email, password, dan nama lengkap. Menggunakan Repository pattern untuk abstraksi data layer dan error handling yang comprehensive.

Product Catalog Management
data class Product(
    val id: String,
    val name: String,
    val description: String,
    val price: Double,
    val imageUrl: String,
    val category: ProductCategory,
    val stock: Int,
    val isFavorite: Boolean = false
)

class ProductViewModel : ViewModel() {
    private val _products = MutableStateFlow<List<Product>>(emptyList())
    val products: StateFlow<List<Product>> = _products.asStateFlow()
    
    private val _searchQuery = MutableStateFlow("")
    val searchQuery: StateFlow<String> = _searchQuery.asStateFlow()
    
    val filteredProducts = combine(products, searchQuery) { products, query ->
        if (query.isBlank()) {
            products
        } else {
            products.filter { 
                it.name.contains(query, ignoreCase = true) ||
                it.description.contains(query, ignoreCase = true)
            }
        }
    }.stateIn(
        scope = viewModelScope,
        started = SharingStarted.WhileSubscribed(5000),
        initialValue = emptyList()
    )
}

🛍️ Product Management

Product data class mendefinisikan struktur produk sayur dengan informasi lengkap. ViewModel menggunakan combine() untuk reactive search filtering dan StateIn untuk efficient state sharing.

Shopping Cart Implementation
data class CartItem(
    val product: Product,
    val quantity: Int
)

class CartViewModel : ViewModel() {
    private val _cartItems = MutableStateFlow<List<CartItem>>(emptyList())
    val cartItems: StateFlow<List<CartItem>> = _cartItems.asStateFlow()
    
    val totalPrice = cartItems.map { items ->
        items.sumOf { it.product.price * it.quantity }
    }.stateIn(
        scope = viewModelScope,
        started = SharingStarted.WhileSubscribed(5000),
        initialValue = 0.0
    )
    
    fun addToCart(product: Product, quantity: Int = 1) {
        val currentItems = _cartItems.value.toMutableList()
        val existingItemIndex = currentItems.indexOfFirst { it.product.id == product.id }
        
        if (existingItemIndex >= 0) {
            currentItems[existingItemIndex] = currentItems[existingItemIndex].copy(
                quantity = currentItems[existingItemIndex].quantity + quantity
            )
        } else {
            currentItems.add(CartItem(product, quantity))
        }
        
        _cartItems.value = currentItems
    }
}

🛒 Shopping Cart

CartViewModel mengelola item di keranjang dengan automatic total calculation. Logic addToCart() menangani penambahan item baru atau update quantity untuk item yang sudah ada di cart.

Favorite Products System
class FavoriteViewModel : ViewModel() {
    private val _favoriteProducts = MutableStateFlow<Set<String>>(emptySet())
    val favoriteProducts: StateFlow<Set<String>> = _favoriteProducts.asStateFlow()
    
    fun toggleFavorite(productId: String) {
        val currentFavorites = _favoriteProducts.value.toMutableSet()
        if (currentFavorites.contains(productId)) {
            currentFavorites.remove(productId)
        } else {
            currentFavorites.add(productId)
        }
        _favoriteProducts.value = currentFavorites
        
        // Save to local storage
        viewModelScope.launch {
            favoriteRepository.saveFavorites(currentFavorites.toList())
        }
    }
    
    fun isFavorite(productId: String): Boolean {
        return _favoriteProducts.value.contains(productId)
    }
}

❤️ Favorite System

FavoriteViewModel menggunakan Set untuk efficient lookup dan toggle operations. Data favorit disimpan ke local storage untuk persistence across app sessions.

Orders Management
data class Order(
    val id: String,
    val items: List<CartItem>,
    val totalAmount: Double,
    val orderDate: Long,
    val status: OrderStatus,
    val deliveryAddress: String
)

enum class OrderStatus {
    PENDING, CONFIRMED, PROCESSING, SHIPPED, DELIVERED, CANCELLED
}

class OrderViewModel : ViewModel() {
    private val _orders = MutableStateFlow<List<Order>>(emptyList())
    val orders: StateFlow<List<Order>> = _orders.asStateFlow()
    
    fun createOrder(cartItems: List<CartItem>, deliveryAddress: String) {
        val order = Order(
            id = generateOrderId(),
            items = cartItems,
            totalAmount = cartItems.sumOf { it.product.price * it.quantity },
            orderDate = System.currentTimeMillis(),
            status = OrderStatus.PENDING,
            deliveryAddress = deliveryAddress
        )
        
        viewModelScope.launch {
            orderRepository.createOrder(order)
            loadOrders()
        }
    }
}

📦 Order Management

Order system dengan status tracking lengkap dari pending hingga delivered. ViewModel mengelola order creation, status updates, dan order history dengan data persistence.

Product Search Implementation
@Composable
fun SearchBar(
    query: String,
    onQueryChange: (String) -> Unit,
    modifier: Modifier = Modifier
) {
    OutlinedTextField(
        value = query,
        onValueChange = onQueryChange,
        modifier = modifier.fillMaxWidth(),
        placeholder = { Text("Cari sayur-sayuran...") },
        leadingIcon = {
            Icon(
                imageVector = Icons.Default.Search,
                contentDescription = "Search",
                tint = Color(0xFF22c55e)
            )
        },
        trailingIcon = {
            if (query.isNotEmpty()) {
                IconButton(onClick = { onQueryChange("") }) {
                    Icon(
                        imageVector = Icons.Default.Clear,
                        contentDescription = "Clear"
                    )
                }
            }
        },
        shape = RoundedCornerShape(12.dp),
        colors = OutlinedTextFieldDefaults.colors(
            focusedBorderColor = Color(0xFF4caf50),
            unfocusedBorderColor = Color(0xFF81c784)
        )
    )
}

🔍 Search Functionality

SearchBar component dengan real-time filtering. Menggunakan Material Design principles dengan custom SayurBox green colors dan user-friendly interactions.

Fitur Utama Aplikasi

Core Features

  • User Authentication (Sign Up & Sign In)
  • Product Catalog dengan kategori
  • Shopping Cart management
  • Favorite products system
  • Order tracking & history
  • Real-time product search

Technical Stack

  • Jetpack Compose UI
  • ViewModel & StateFlow
  • Repository Pattern
  • Local Data Storage
  • Reactive Programming
  • Material Design 3
Fungsi Utama Aplikasi SayurBox
  • 1. Authentication System
    Sistem registrasi dan login yang aman dengan validasi email, password strength, dan user session management untuk akses yang personalized.
  • 2. Product Catalog
    Katalog produk sayur-sayuran dengan kategorisasi, detail produk lengkap, gambar berkualitas, dan informasi stok real-time.
  • 3. Shopping Cart
    Keranjang belanja dengan automatic price calculation, quantity management, dan persistent storage untuk pengalaman berbelanja yang seamless.
  • 4. Favorite Products
    Sistem wishlist untuk menyimpan produk favorit pengguna dengan quick access dan easy management untuk pembelian di masa depan.
  • 5. Order Management
    Sistem pemesanan lengkap dengan order tracking, status updates, delivery information, dan order history untuk transparency penuh.
  • 6. Search Functionality
    Pencarian produk yang intelligent dengan real-time filtering, category-based search, dan user-friendly interface untuk menemukan produk dengan cepat.
Architecture Components
🔐
Authentication

Secure sign up & sign in system

🥬
Product Catalog

Comprehensive vegetable inventory

🛒
Shopping Cart

Smart cart management system

❤️
Favorites

Personal product wishlist

📦
Orders

Complete order tracking

🔍
Search

Intelligent product discovery

Kesimpulan: SayurBox App merupakan solusi e-commerce modern untuk berbelanja sayur-sayuran secara online dengan fitur lengkap dan user experience yang optimal. Aplikasi ini mengintegrasikan authentication, catalog management, cart system, favorites, orders, dan search dalam satu platform yang user-friendly.
Tampilan Aplikasi

📱 Screenshots aplikasi akan ditampilkan di sini setelah development selesai

Video Demonstrasi
🎬 Video demo akan tersedia setelah aplikasi selesai dikembangkan
Source Code Repository

📂 Access Source Code

🔗 View on GitHub

Complete source code untuk SayurBox App dengan fitur e-commerce lengkap

Comments

Popular posts from this blog

Tugas 2 PPB

Tugas 3 PPB