Course Information
Course Overview
From Figma to KMP: Design & Build an E-Commerce App for Android & iOS using Firebase SDK & Compose Multiplatform.
From Figma Design project, to the actual Android and iOS application.
We're gonna build a complete E-commerce solution from scratch, and I mean truly from scratch. Together, we'll design the UI in Figma, and then bring that design to life using Jetpack Compose — for both Android and iOS — using Kotlin Multiplatform.
What’s Inside?
We’ll follow a clean, multi-modular architecture with the MVVM pattern to keep the project scalable, maintainable, and production-ready.
Our app will be a food supplements store, featuring products from multiple categories. And yes — we’re building for real-world usage.
Key Features
User Authentication – Sign in with Google using Firebase Auth.
Shopping Cart – Users can browse, select, and add products to their cart. Some products include customizable options like flavors.
Checkout & Payments – We’ll implement two payment options:
- Pay on Delivery
- Pay with PayPal — and I’ll show you how to integrate the PayPal API to handle transactions securely.
Email Order Confirmation – Once an order is placed, an automated email is sent with all the order details: product info, total price, payment method, and shipping details.
Admin Panel – A secure area accessible only to store owners where you can add, update, or delete products.
Backend with Firebase
We’ll use a full suite of Firebase services:
Authentication – Sign in with Google.
Cloud Firestore – As our main database, with security rules.
Firebase Storage – For storing product images.
Cloud Functions – To automate email notifications.
Cloud Messaging – For push notifications.
30 Hours of Practical Content
This course packs nearly 30 hours of high-quality, real-world development. I didn’t cut out the bugs, issues, or debugging moments — you'll see everything, so you can learn how to handle real development challenges.
Who is this course for?
This is not a beginner-level course. You should already be familiar with Kotlin and Jetpack Compose. If you're just starting out, I’d recommend learning the basics first.
But if you're ready to take your skills to the next level and build a cross-platform, real-world E-commerce app using KMP, this course is packed with value and practical knowledge.
Let's build something great!
Course Content
- 10 section(s)
- 106 lecture(s)
- Section 1 Introduction
- Section 2 Introduction to Figma
- Section 3 Let's Design our NutriSport App!
- Section 4 Project Setup
- Section 5 Authentication
- Section 6 Navigation
- Section 7 Dependency Injection
- Section 8 Nested Bottom Bar Navigation
- Section 9 Custom Navigation Drawer
- Section 10 Profile Screen
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
- Shopping Cart feature to allow Users to add Products
- 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!
Skills covered in this course
Reviews
-
EEmmanuel Eseka
This is a great course for people with some experience in KMP, at least a strong beginner/intermediate, and that's great because we do not waste time covering things we should know already. I have no issues, but I just hope in future courses you can cover string localization instead of hardcoded strings. Anyways, great course, I recommend!👌🏽
-
AAlexandre Louro Sousa
Talked about design and software development, which is cool, if I were interested in design. Not giving 5 stars only because sometimes it was a bit too long on the UI compose coding, apart from that, great. Thank you for your time; it must be hard to code and explain at the same time! P.S.: Loved the "That be all" in the final of the videos
-
RRodolfo Lima
Excellent course! It exceeded my expectations!
-
CCarlos Gabriel Ugaz Burga
Spa: Me gusto mucho el curso, más la parte de figma, ya que como developer siempre usamos los diseños de los diseñadores pero no sabemos nada de esta herramienta. Sobre KMP, complemente lo que ya sabia anteriormente. Gracias Stefan