Objectives

Upon completion of this course, the student should be able to:

  • Write a cross-platform app that will run on any of the 5 billion iOS/Android cell phones in the world as well as in any browser on any machine
  • Develop and debug Flutter apps like a pro
  • Leverage the elegance of the Dart programming language in Flutter apps
  • Apply themes and styles
  • Write their own custom widgets
  • Respond to gestures like taps, swipes, and pinches
  • Precisely control the layout of their apps in a responsive way
  • Handle form data entry from users
  • Make multiscreen apps with navigation, menus, and tabs
  • Use Flutter to read and write data from an online RESTful API
  • Find and include 3rd party libraries

Topics

Some of the things we’ll cover in this course:

  • Overview of Flutter
  • Dart programming language
  • Developing and debugging Flutter
  • Creating custom widgets
  • Laying out a screen
  • Value widgets
  • Responding to gestures like tap, swipe, and pinch
  • Navigating between screens
  • Styling widgets
  • Managing state
  • Making RESTful API calls with HTTP

Audience

Experienced developers who want a better way of writing apps. Architects and managers who want to evaluate the capabilities of Flutter for use in their organizations.

Prerequisites

Experience in some object-oriented programming language like Java, C#, or C++.

Duration

Five days

Outline for Flutter

Chapter 1. Hello Flutter

  • What is Flutter?
  • Why Flutter?
  • The other options
  • Native solutions

Chapter 2. Dart Language Overview

  • What is Dart?
  • Expected features – Dart Cheatsheet
  • Data types, Arrays/lists
  • Classes
  • Conditionals and loops
  • Unexpected things about Dart
  • Type inference
  • final and const
  • String interpolation with $
  • Spread operator
  • Map<foo, bar>
  • Functions are objects
  • Big arrow/Fat arrow
  • Named function parameters
  • Omitting “new” and “this.”
  • Class constructor parameter shorthand
  • Private class members
  • Mixins
  • The cascade operator (..)
  • No overloading
  • Named constructors

Chapter 3. Developing in Flutter

  • The Flutter toolchain
  • The Flutter SDK
  • IDEs
  • IDE DevTools
  • Emulators
  • Keeping the tools up to date
  • The Flutter development process
  • Scaffolding the app and files
  • Running your app

Chapter 4. Everything Is Widgets

  • UI as code
  • Built-in Flutter widgets

Chapter 5. Value widgets

  • Layout widgets
  • Navigation widgets
  • Other widgets
  • How to create stateless widgets
  • Widgets have keys
  • Passing a value into your widget
  • Stateless and Stateful widgets
  • So which one should I create?
  • Value Widgets
  • The Text widget
  • The Icon widget
  • The Image widget
  • Embedded images
  • Network images
  • Sizing an image
  • Input widgets
  • Text fields
  • Putting the form widgets together
  • Form widget
  • FormField widget
  • One big Form example

Chapter 6. Responding to Gestures

  • Meet the button family
  • RaisedButton
  • FlatButton and IconButton
  • FloatingActionButton
  • CupertinoButton
  • Dismissible
  • Custom gestures for your custom widgets
  • Example 1: Reacting to a long press
  • Example 2: Pinching to add a new item
  • Example 3: Swiping left or right
  • The gesture arena
  • Conclusion

Chapter 7. Laying Out Your Widgets

  • Laying out the whole scene
  • MaterialApp widget
  • The Scaffold widget
  • The AppBar widget
  • SafeArea widget
  • SnackBar widget
  • How Flutter decides on a widget’s size
  • The dreaded “unbounded height” error
  • Flutter’s layout algorithm
  • Putting widgets next to or below others
  • Your widgets will never fit!
  • What if there’s extra space left over?
  • mainAxisAlignment
  • crossAxisAlignment
  • Expanded widget
  • What if there’s not enough space?
  • The ListView widget
  • Container widget and the box model
  • Alignment and positioning within a Container
  • So how do you determine the size of a Container?
  • Special layout widgets
  • Stack widget
  • GridView widget
  • The Table widget

Chapter 8. Navigation and Routing

  • Stack navigation
  • Navigating forward and back
  • Get result after a scene is closed
  • Drawer navigation
  • The Drawer widget
  • Filling the drawer
  • Tab Navigation
  • TabController
  • TabBar and Tabs
  • The Dialog widget
  • showDialog( ) and AlertDialog
  • Responses with a Dialog
  • Navigation methods can be combined

Chapter 9. Styling Your Widgets

  • Thinking in Flutter Styles
  • A word about colors
  • Styling Text
  • TextStyle
  • Custom fonts
  • Container decorations
  • Border
  • BorderRadius
  • BoxShape
  • Stacking widgets
  • Positioned widget
  • Card widget
  • Themes
  • Applying theme properties

Chapter 10. Managing State

  • What is state?
  • What goes in a StatefulWidget?
  • The most important rule about state!
  • Passing statedown
  • Lifting state backup
  • An example of state management
  • When should we use state?
  • Advanced state management
  • InheritedWidget
  • BLoC
  • ScopedModel
  • Hooks
  • Provider
  • Redux

Chapter 11. Your Flutter App Can Work with Files

  • Including libraries in your Flutter app
  • Finding a library
  • Adding it to pubspec.yaml
  • Importing the library
  • Using the library
  • Futures, async, and await
  • Why would it wait?
  • await
  • async
  • Including a file with your app
  • Writing a file
  • And reading it!
  • Using JSON
  • Writing your app’s memory to JSON
  • Reading JSON into memory
  • Shared preferences
  • To write preferences
  • To read preferences

Chapter 12. Making RESTful API Calls with HTTP

  • The flavors of API requests
  • Making an HTTP GET or DELETE request
  • Making an HTTP PUT, POST, or PATCH request
  • HTTP responses to widgets
  • Brute force – The easy way
  • FutureBuilder – The clean way
  • Strongly typed classes
  • Create a business class
  • Write a .fromJSON( ) method
  • Use .fromJSON( ) to hydrate the object
  • One big example
  • A GET request in Flutter
  • A DELETE request in Flutter
  • A POST and PUT request in Flutter

Chapter 13. Using Firebase with Flutter (time permitting)

  • Introducing Firebase
  • Cloud Firestore
  • Cloud Functions
  • Authentication
  • Setting up Firebase itself
  • (1) Creating a Firebase project
  • (2) Creating the database
  • (3) Creating an iOS app
  • (4) Creating an Android app
  • (5) Adding FlutterFire plugins
  • Using Firestore
  • To get a collection
  • To query
  • To upsert
  • To delete
  • Where to go from here
  •