O'Reilly logo
live online training icon Live Online training

Flutter First Steps

Building iOS and Android apps and websites with a single code base

Rap Payne

If you need to write an app, you should really look into Flutter. Whether your app is aimed at iOS devices (iPhones, iPads), Android devices, or even a website, Flutter is the framework that finally puts developing apps in the reach of mere mortals. And when you write the code for any one of those platforms, it runs -- natively -- in all three!

This course will give you the foundation you need to begin writing apps in Flutter. By the time you’re finished, you’ll be able to create your own Flutter app that takes input from the user, lays out nicely on any screen, and presents information to them in a way that is beautiful and fast.

What you'll learn-and how you can apply it

By the end of this live, hands-on, online course, you’ll understand:

  • What problems Flutter solves: its strengths and weaknesses relative to other options
  • The architecture of a Flutter app
  • How and why Flutter uses widgets and composition
  • The Dart language: how it is like and different to other languages
  • Foundational widgets like MaterialApp, Scaffold, Text, Icon, TextField, the button family and more

And you’ll be able to:

  • Create a new Flutter app
  • Write your own widgets whether stateless or stateful
  • Manage state within a widget
  • Create gorgeous user interfaces that run on iOS, Android, and the web
  • Handle basic stack navigation to move between screens

This training course is for you because...

  • You’re an experienced developer who wants to create apps and websites.
  • You’re a manager or architect who wants to evaluate a new tool for their team.

Prerequisites

  • To be able to develop in Flutter by the end of the course, you should attend as an experienced object-oriented developer. Non-developers can still attend the course to get an understanding of the capabilities and best uses of Flutter.

Recommended preparation:

  • Read chapters 1-4 in Beginning App Development with Flutter: Create Cross-Platform Mobile Apps (book)
  • Install the Flutter developer tools on your development machine, following these step-by-step instructions. Please note that installation can be time-consuming, because there are so many different combinations of operating systems, hardware, and other tools. Our class time will be spent on learning to code in Flutter; unfortunately, we won’t be able to troubleshoot individual installation problems. We ask that your development environment be set up before class begins. If it isn’t, you can still participate in the class, but may not be able to do all of the hands-on activities.

Recommended follow-up:

About your instructor

  • Rap Payne has focused on mobile development since he started Agile Gadgets, a mobile app development company in 2003. He is a consultant, trainer, and entrepreneur who has written apps, mentored developers, and taught software development classes for Fortune 500 companies like Boeing, Walmart, Coca-Cola, Wells Fargo, Honda, CVS, GE, Chase, HP, Lockheed, Lowe's, Nike, JCPenney, USAA, Walgreens, and government agencies like the NSA, US Air Force, Navy, Army, NASA, Britain's GCHQ, Canada's postal service, and several provincial governments, to name a few.

    As a professional mentor and trainer, Rap has developed a talent for communicating highly complex ideas in easy-to-understand ways. And as a real-world developer, he understands the need to teach these topics using practical and realistic examples and exercises.

Schedule

The timeframes are only estimates and may vary according to how the class is progressing

Overview of Flutter (25 minutes)

  • Presentation: Why use Flutter? Which of your problems will it solve?
  • Discussion: How will you be using Flutter after the course? What were the reasons you’ve decided to change how you are doing business? What’s the number one thing you want to be sure to learn today?
  • Presentation: Other options compared with Flutter. Which is best for you?
  • Discussion: If you have experience with the alternatives, what would you tell someone who wanted to use that technology? What were some of the pain points that caused you to be open to Flutter?
  • Q&A

Overview of the Dart Language (30 minutes)

  • Presentation: What Dart looks like
  • Presentation: Viewing Dart as an experienced developer - the basics
  • Presentation: The unexpected things about Dart - how it is different from other languages
  • Q&A
  • Break (5 minutes)

Creating a Flutter Project (45 minutes)

  • Presentation: Steps to create a new Flutter project
  • Demonstration: Creation of a project
  • Presentation: A tour through the files in a project. What’s there and why?
  • Discussion: How might this integrate with your existing projects?
  • Presentation: A tour through the code itself. (MaterialApp, Scaffolds, etc).
  • Poll
  • Presentation: The dartpad.dev REPL for prototyping and sharing Flutter apps
  • Exercise: Create a new project called task_app. Fill out the body. Run your app.
  • Q&A

Stateless and Stateful Widgets (45 minutes)

  • Presentation: Everything is widgets!
  • Presentation: Composition with Stateless widgets
  • Discussion: What do you see as the advantages of composition vs. OO development?
  • Break (5 minutes)
  • Presentation: Stateful widgets
  • Presentation: How to manage state in your widgets
  • Exercise: Create all the widgets needed for the task_app. Look at each one in your app.
  • Q&A

Value Widgets and Forms (40 minutes)

  • Presentation: Text, and Icon widgets
  • Presentation: The Button Family
  • Discussion: When would each button be most appropriate?
  • Presentation: TextField widget
  • Demonstration: Building a TextField widget
  • Presentation: The other form widgets
  • Demonstration: How to create each form widget
  • Exercise: Fill out your todo/task custom widget with a description. Add a floatingActionButton with an Icon. Add some labels. Add a TextField for a new widgets.
  • Q&A
  • Break (5 minutes)

Putting it all together in an app (45 minutes)

  • Presentation: Casting the vision for the app project
  • Discussion: What blockages or troubles do you foresee? How we can mitigate them.
  • Presentation: High-level intro to stack navigation
  • Exercise: Navigating between your two widgets
  • Presentation: Introducing a ListView Widget
  • Exercise: Using the ListView to present all of your todos
  • Presentation: State management within widgets
  • Exercise: Allowing the user to tap to ‘complete’ a task/todo.
  • Q&A