Flutter App Development for Beginners

Install and configure Flutter, Dart, and development tools, and learn the Dart basics used in Flutter apps. You will be able to create and run a starter project in an emulator or simulator.

• Install the Flutter SDK

  Install the Flutter SDK and confirm the installation with the flutter doctor command.

• Configure VS Code for Flutter and Dart

  Set up VS Code with the Flutter and Dart extensions and verify that it detects the Flutter SDK.

• Set Up an Emulator or Simulator

  Create an Android emulator or iOS simulator that can run a Flutter app.

• Create and Run a Starter Flutter App

  Create a Flutter starter project and run it on the configured emulator or simulator.

• Declare Dart Variables and Basic Types

  Declare Dart variables using text, whole-number, and decimal-number types.

• Build Text with String Interpolation

  Combine text and variable values in a Dart string using interpolation.

• Calculate with Dart Operators

  Use arithmetic and comparison operators to calculate and compare values in Dart.

• Make Decisions with If and Else

  Write an if/else statement that selects an outcome based on a condition.

• Store Related Values in a List

  Create and access a Dart list containing related values.

• Repeat Actions with Loops

  Use a loop to process each value in a Dart list.

• Create Reusable Dart Functions

  Write and call a Dart function that returns a formatted value.

• Project: Build a Personal Profile App

  Build and run a Flutter profile app that displays learner details using Dart variables, a list, and a reusable function.

Learn how Flutter widgets compose screens and how to arrange content with common layout, styling, and asset techniques. You will be able to build responsive app screens from a design.

• Set Up Flutter and Run Your First App

  Run the starter Flutter app on an emulator or connected device.

• Build a Screen from Basic Widgets

  Compose a screen using a widget tree with text and icon widgets.

• Arrange Content with Rows and Columns

  Arrange related widgets in a screen section using Row and Column.

• Control Spacing and Alignment

  Position widgets with padding, alignment, and the Container widget.

• Style Widgets with Colors and Text

  Apply a consistent color and text style to a screen section.

• Add Images from Project Assets

  Display a local image by adding it to the project and registering it in pubspec.yaml.

• Make a Screen Scrollable

  Allow a list of screen content to scroll using a Flutter scroll widget.

• Adapt a Layout to Different Screen Sizes

  Adjust a screen layout for narrow and wide displays using available screen space.

• Capstone Project: Build a Responsive Product Screen

  Build a responsive product screen from a design using widgets, layout, styling, and image assets.

Connect screens with navigation and make interfaces interactive with user input, validation, and state management fundamentals. You will be able to build a multi-screen app that responds to user actions.

• Set Up and Run the Flutter Starter App

  Run the starter Flutter app on an emulator or connected device.

• Create Home and Detail Screens

  Build a Flutter app with separate home and detail screen widgets.

• Open a Screen with Navigator.push

  Navigate from the home screen to the detail screen using Navigator.push.

• Return from a Screen with Navigator.pop

  Return to the home screen using Navigator.pop and display a value returned from the detail screen.

• Build a Form with Form and TextFormField

  Create a form that collects a user's name and email address.

• Validate Required Form Input

  Add validation that prevents form submission when required fields are empty.

• Read Form Input with TextEditingController

  Read and display the name and email entered in the form.

• Refresh the Interface with setState

  Update a screen's displayed content after a user action by calling setState.

• Return Form Data and Update the Home Screen

  Send validated form data back to the home screen and add it to a visible list.

• Project: Build a Multi-Screen Event Registration App

  Build an event registration app that uses navigation, validated form input, and setState to display submitted registrations.

Configure a Flutter app with Firebase and use Firebase Authentication and Cloud Firestore for sign-in and app data. You will be able to build features that securely connect users to cloud-backed information.

• Install Firebase Tools for Flutter

  Install the Firebase CLI and FlutterFire CLI and verify that both commands run successfully.

• Create a Firebase Project and Register a Flutter App

  Create a Firebase project and register the course Flutter app with its platform configuration.

• Connect and Initialize Firebase in Flutter

  Add the Firebase configuration to the Flutter app and launch it with Firebase initialized.

• Enable Email and Password Authentication

  Enable the email and password sign-in method in Firebase Authentication.

• Create Accounts with Firebase Authentication

  Build a registration screen that creates a Firebase Authentication account from an email address and password.

• Sign In, Sign Out, and Track Authentication State

  Build a sign-in flow that displays the correct screen when a user signs in or out.

• Store and Read Data with Cloud Firestore

  Write a document to Cloud Firestore and display its data in the Flutter app.

• Protect Firestore Data with Security Rules

  Write and test Firestore rules that allow signed-in users to access only their own documents.

• Connect User Accounts to Personal Firestore Data

  Display and update a signed-in user's personal data using their Firebase Authentication ID.

• Project: Build a Secure Personal Notes App

  Build a Flutter notes app that supports account registration, sign-in, sign-out, and user-protected Firestore notes.

Run and test your app on Android and iOS targets, understand platform-specific configuration, and troubleshoot common build issues. You will learn how Android Studio and Xcode support building and preparing apps for each platform.

• Set Up Android Studio and Android Build Tools

  Install Android Studio and verify that its Android SDK tools are available for Flutter development.

• Create an Android Emulator

  Create and start an Android virtual device in Android Studio.

• Run a Flutter App on Android

  Launch a Flutter app on the Android emulator and confirm that it responds to input.

• Set Android App Name and Version

  Update the Android app’s displayed name and version in its platform configuration.

• Set Up Xcode and the iOS Simulator

  Install Xcode on a Mac and verify that an iOS simulator is available for Flutter development.

• Run a Flutter App on iOS

  Launch the Flutter app on the iOS simulator and confirm that it responds to input.

• Inspect iOS App Settings in Xcode

  Locate the iOS app’s display name, bundle identifier, and minimum supported iOS version in Xcode.

• Troubleshoot Common Android and iOS Build Problems

  Use build output and platform tools to resolve a common Android or iOS build error.

• Prepare and Test a Flutter App for Android and iOS

  Build and test one Flutter app on Android and iOS targets and document the platform settings and results.

Bring together Flutter interfaces, navigation, state, and Firebase in a complete mobile app project. You will test and refine the app for Android and iOS and prepare the project for release.

• Set Up Flutter and Run a Starter App

  Configure the Flutter SDK, an IDE, and an emulator, then run a starter app successfully.

• Build the Task Tracker Screens

  Create a task list and task form using Flutter widgets.

• Connect Screens with Navigation

  Navigate between the task list and task form screens.

• Manage Task Form State

  Use Flutter state to add a task to the on-screen list.

• Connect the App to Firebase

  Configure a Firebase project and connect it to the Flutter app.

• Add Firebase Sign-In

  Enable users to sign in and sign out with Firebase Authentication.

• Save and Load Tasks with Firestore

  Save tasks for the signed-in user and display them from Cloud Firestore.

• Edit and Delete Firestore Tasks

  Update or delete a task in Cloud Firestore from the app.

• Build the Firebase-Powered Capstone App

  Combine the screens, navigation, state, sign-in, and Firestore tasks into a working task tracker.

• Test and Prepare the App for Release

  Verify the app on Android and iOS targets and prepare its release configuration.