🚀 Flutter for Beginners: From UI to Full App - Build Your Backend-Powered Shopping App!

Presented by Google Developer Groups on Campus - Asia Pacific University Chapter

📅 Event Details

• Date: Wednesday, December 17th, 2025

• Time: 2:00 PM - 5:00 PM (MYT)

• Venue: S-08-02

• Format: Hybrid (In-person & Online via Bevy)

• Duration: 3 hours

• Department: GDGoC Web Development Department

• Workshop Lead: Mervin Ooi Zhian Yang

🎯 About This Workshop

Ready to take your Flutter app to the next level? Join us for the exciting continuation of our Flutter workshop series where you'll transform your shopping app UI into a fully functional, cloud-powered application!

This is where everything comes together. In Session 1, you mastered Flutter's UI capabilities. Now, it's time to bring your app to life with real backend services, user authentication, and production-ready architecture. You'll learn how professional developers build scalable apps by implementing Firebase integration, clean architecture patterns, and advanced state management.

We'll replace all mock data with live cloud services, implement secure user authentication, and refactor your app using industry-standard patterns. By the end of this session, you'll have a complete full-stack shopping app that's ready for real users—and the skills to build your own production-ready applications from scratch.

👥 Who Should Attend?

This workshop is perfect for:

• Session 1 Attendees ready to complete their project and learn backend integration

• Flutter Developers with UI experience wanting to connect apps to cloud services

• Mobile Developers looking to master state management and clean architecture

• Anyone building real-world apps who needs to understand Firebase integration

Prerequisites:

• Completion of Session 1 OR solid understanding of building UIs in Flutter

• Basic familiarity with what a backend or database is

• Google Account (for Firebase setup)

• Laptop with Flutter SDK and Android Studio installed

📚 What You'll Learn

By the end of this workshop, you will:

✅ Integrate Firebase Authentication for secure user login and registration

✅ Connect your app to Cloud Firestore for real-time data persistence

✅ Implement clean architecture using a service layer to separate UI from business logic

✅ Master the Provider package for scalable, production-ready state management

✅ Refactor setState-based code into maintainable ChangeNotifier providers

✅ Use FutureBuilder and StreamBuilder to handle asynchronous data from a live backend

✅ Build a complete full-stack shopping app with user accounts, live cart, and cloud storage

⏱️ Workshop Agenda

2:00 PM - 2:15 PM | Firebase Foundations

• Quick recap of Session 1 app architecture

• Introduction to Firebase and cloud services

• Setting up and initializing your Firebase project

2:15 PM - 3:00 PM | User Authentication

• Building Login and Register pages

• Implementing Firebase Authentication

• Handling user sessions and security

3:00 PM - 3:30 PM | Cloud Data Integration

• Creating a clean service layer architecture

• Refactoring data fetching from local files to Cloud Firestore

• Real-time data synchronization with your UI

3:30 PM - 4:30 PM | Advanced State Management

• Introduction to the Provider package

• Refactoring cart and favorites logic from setState to ChangeNotifier

• Building scalable, maintainable state architecture

4:30 PM - 5:00 PM | Production Ready & Beyond

• Reviewing the complete app architecture (UI → Provider → Service → Firebase)

• Best practices for production apps

• Next steps in your Flutter journey

• Open Q&A session

🛠️ Tools & Platforms

• Flutter SDK

• Android Studio

• Android Emulator or Physical Device

• Google Account (for Firebase)

• Git (recommended)

💡 Why This Workshop?

This isn't just about adding features—it's about learning to build apps the right way. You'll understand:

• How professional developers structure scalable applications

• The difference between hobby projects and production-ready apps

• Clean architecture patterns used by top development teams

• Real-world integration of cloud services and state management

Walk away with not just a completed app, but the confidence and knowledge to build your own full-stack mobile applications from the ground up.

🔗 From Session 1 to Full-Stack Session 1 gave you the UI skills. Session 2 completes your transformation into a full-stack Flutter developer. Together, these workshops provide everything you need to build real applications that can serve actual users.

💬 Join The WhatsApp Group!

WhatsApp Group: Join our workshop discussion group for updates, Q&A, and networking!

🔗 https://chat.whatsapp.com/EoB7AGt2tOqFYp5oXHRxv6

📧 Questions?

Connect with us through our social media channels and send us a message!