Multi-Modular Ecommerce App For Android & Ios (Kmp)

Multi-Modular Ecommerce App For Android & Ios (Kmp)
Published 5/2025
MP4 | Video: h264, 1920×1080 | Audio: AAC, 44.1 KHz

From Figma to KMP: Design & Build an E-Commerce App for Android & iOS using Firebase SDK & Compose Multiplatform.

What you’ll learn

Build an Ecommerce App for Android & iOS

Share the UI Layer using Compose Multiplatform framework

From Figma to Jetpack Compose (UI Design process)

Multi-modular Architecture for Scalable Apps

Automated Emails when a New Order is created

Admin Panel

Pay on Delivery feature

Pay with PayPal integration

Kotlin Multiplatform technology

Firebase KMP SDK

Firebase Firestore (+ Security rules)

Firebase Authentication

Firebase Storage

Firebase Cloud Functions

Firebase Cloud Messaging

Push Notifications

CRUD operations

and more!

Requirements

Knowledge of Jetpack Compose framework

Knowledge of Kotlin programming language

Knowledge of Android Development

Description

Overview

Section 1: Introduction

Lecture 1 Introduction

Lecture 2 Is this course for you?

Lecture 3 Project Design Overview

Lecture 4 Project Architecture Overview

Lecture 5 Why Firebase?

Section 2: Introduction to Figma

Lecture 7 Essential Design Tools & Techniques

Lecture 9 Styles

Lecture 10 Auto Layout

Section 3: Let’s Design our NutriSport App!
Lecture 12 Clone my Design Project

Lecture 13 Choosing Font, Colors & Icons

Lecture 14 Design inspirations

Lecture 15 Authentication Screen

Lecture 16 BottomBar Component

Lecture 17 Spacing Principles in UI Design

Lecture 18 Secondary ProductCard Component

Lecture 19 Main ProductCard Component

Lecture 20 TopAppBar Component

Lecture 23 Categories Screen

Lecture 24 Category Search Screen

Lecture 25 Empty Category Search State

Lecture 26 Button Component

Lecture 27 Details Screen

Lecture 28 Custom Navigation Drawer

Lecture 29 Profile Screen

Lecture 30 Dialog component

Lecture 31 Admin Panel Screen

Lecture 32 Add New Product

Lecture 33 Edit Product

Lecture 34 Checkout Screen

Lecture 35 Payment Processed Screen (Paypal)

Section 4: Project Setup

Lecture 36 Project Source Code

Lecture 37 Development Environment requirements

Lecture 38 Dependencies

Lecture 39 Firebase Setup

Lecture 40 Splash Screen on Android

Lecture 41 Splash Screen on iOS

Lecture 42 Fonts, Colors and Resources

Section 5: Authentication

Lecture 43 Authentication Screen

Lecture 44 Sign in with Google implementation

Section 6: Navigation

Lecture 45 Navigation Setup

Section 7: Dependency Injection

Lecture 46 DI Setup

Lecture 47 Create a Customer

Section 8: Nested Bottom Bar Navigation

Lecture 48 Remember Authenticated state

Lecture 49 Bottom Bar component

Lecture 50 Nested Navigation

Section 9: Custom Navigation Drawer

Lecture 51 Update System Bars

Lecture 52 Custom Drawer component

Lecture 53 Animate CustomDrawer & HomeGraph

Lecture 54 Sign out the User

Section 10: Profile Screen

Lecture 55 Custom TextField component

Lecture 56 Alert TextFIeld component

Lecture 57 Primary Button component

Lecture 58 Profile Form

Lecture 59 Country Picker Dialog component

Lecture 60 Country Picker implementation

Lecture 61 Read the Customer information

Lecture 62 Test the iOS App

Lecture 63 Update a Customer information

Lecture 64 Info Card component

Section 11: Admin Panel

Lecture 65 Admin Panel feature

Lecture 66 Manage Product feature

Lecture 67 Category Dialog

Lecture 68 Photo Picker (Platform-specific) logic

Lecture 69 Create the Customer

Lecture 70 Upload a Thumbnail to Storage

Lecture 71 Update a Design in Figma – Photo Picker component

Lecture 72 Delete a Thumbnail from Storage

Lecture 73 Product Card

Lecture 74 Read the Last 10 Products

Lecture 75 Read Selected Product

Lecture 76 Update Selected Product

Lecture 77 Delete Selected Product

Lecture 78 Search Products

Lecture 79 Hide/Show AdminPanel navigation option

Lecture 80 3 Switch components

Section 12: Products Overview Screen

Lecture 81 Read Discounted products

Lecture 82 Main Product Card component

Lecture 83 Read New products

Section 13: Details Screen

Lecture 84 Details Screen

Lecture 85 Quantity Counter

Section 15: Categories Screen

Lecture 92 Categories Screen

Lecture 93 Read Products by Category

Lecture 94 Search Category Products by Title

Section 16: Checkout Screen – Pay on Delivery

Lecture 96 Update Profile Information

Lecture 97 Create the Order

Lecture 98 Install Email Extension & Functions Setup

Lecture 99 Write & Upload the JS Script for Sending Emails

Section 17: Checkout Screen – Pay with PayPal

Lecture 100 Fetch an Access Token

Lecture 102 Handle an Intent on Android

Lecture 103 Create the Order for PayPal payment

Lecture 104 Handle a Deep Link on iOS

Section 18: Push Notifications

Lecture 105 Implement Push Notifications

Section 19: Security Rules

Lecture 106 Secure your Firestore Database