🛍️ Flutter for Beginners: From Zero to UI - Build Your First Shopping App!

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

📅 Event Details

• Date: Wednesday, December 10th, 2025

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

• Venue: S-08-02, APU Campus

• 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 transform your app ideas into reality? Join us for an immersive Flutter workshop where you'll build a complete shopping app UI from scratch—no prior Flutter experience needed!

This hands-on session bridges the gap between learning individual widgets and creating real-world applications. Instead of just memorizing syntax, you'll understand the "why" behind every line of code as you construct a functional, visually stunning multi-page shopping app.

We've designed this workshop to focus purely on UI/UX development. By using pre-defined local data, we remove backend complexity, allowing you to master Flutter's UI capabilities without getting overwhelmed. This is the first of a two-part series that will transform you from a Flutter beginner to a confident mobile app developer.

👥 Who Should Attend?

This workshop is perfect for:

• Complete Beginners wanting a structured, project-based introduction to mobile app development

• Students & Aspiring Developers looking to build a portfolio-worthy project

• Web/Native Developers curious about Flutter's cross-platform capabilities

• Anyone who wants to turn their app ideas into reality!

Prerequisites:

• Basic programming concepts (variables, functions, classes)

• No Dart or Flutter experience required!

• Laptop with Flutter SDK installed (setup guide will be provided)

📚 What You'll Learn

By the end of this workshop, you will: ✅ Master Flutter's fundamental app structure and file organization
✅ Build responsive layouts using core widgets (Column, Row, ListView, GridView)
✅ Understand StatelessWidget vs StatefulWidget and state management with setState
✅ Implement smooth navigation and data passing between screens
✅ Create reusable custom widgets for clean, maintainable code
✅ Complete a multi-page shopping app with Products, Details, Cart, and Account pages

⏱️ Workshop Agenda

2:00 PM - 2:15 PM | Welcome & Introduction

• Meet the speaker and fellow Flutter enthusiasts

• Workshop objectives and what you'll build

2:15 PM - 3:00 PM | Flutter Foundations

• Creating your first Flutter project

• Understanding the file structure

• Your first "Hello World" in Flutter

3:00 PM - 3:30 PM | Building Smart with Widgets

• Creating reusable widget components

• Implementing your Products Page

• Best practices for widget composition

3:30 PM - 4:30 PM | Bringing Your App to Life

• Deep dive into Flutter's widget catalog

• Understanding and implementing state

• Building Product Details, Cart, and Account pages

• Navigation and data flow between screens

4:30 PM - 5:00 PM | Wrap-Up & What's Next

• Key takeaways recap

• Open Q&A session

• Exciting preview of Session 2 (Backend Integration!)

• Community Access - Join our Flutter developers group

🛠️ Tools & Platforms

• Flutter SDK

• Visual Studio Code or Android Studio

• Android Emulator or Physical Device

• Git (optional but recommended)

💡 Why This Workshop?

Unlike typical tutorials that focus on isolated concepts, this workshop gives you the complete picture. You'll leave with:

• A portfolio-ready shopping app UI

• Confidence to start your own Flutter projects

• Understanding of real-world app architecture

• Foundation for the upcoming Session 2 (Backend Integration)

💬 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!