Flutter & Dart App Development Online Course

Flutter & Dart App Development Online Course

This course takes you from setting up the Flutter development environment on Windows or Mac to building fully functional mobile apps. You’ll start with the basics of Flutter widgets, stateful vs. stateless types, and state management, applying your skills through projects like a Fortune Cookie app and Tip Calculator. As you progress, you’ll integrate advanced features such as JSON parsing, form handling, navigation, and data persistence with SQLite. You’ll also explore state management with the Provider package and real-time database interactions using Firebase. By the end, you’ll have the hands-on experience and practical skills to design and build scalable, high-performing mobile applications with Flutter.

Who should take this course?

This course is ideal for aspiring mobile app developers, software engineers, and tech enthusiasts who want to build cross-platform applications using Flutter and Dart. It’s well-suited for beginners exploring mobile development as well as experienced developers seeking to expand their skills into creating high-performance apps for both iOS and Android. Whether you’re aiming to launch your own app or enhance your professional portfolio, this course provides the practical knowledge to succeed in Flutter & Dart development.

What you will learn

• Set up a Flutter development environment on Windows and Mac
• Implement robust state management using the Provider package
• Build complete applications like a Movie App and Water Tracker
• Develop user interfaces using Flutter's rich widget system
• Connect your apps to external APIs for dynamic data processing
• Persist data using SQLite databases and Firebase Realtime Database

Course Outline

Introduction

• Introduction
• About Course Update - 2024 - New VS Legacy Videos
• Flutter Development Environment Setup - Overview
• Flutter Dev Website - Overview

Windows - Flutter Development Environment Setup

• Setup Flutter on Windows

MAC - Flutter Development Environment Setup

• Flutter Setup on Mac

Setup Visual Studio Code and Running the First Flutter App

• Setup VS Code IDE - Installation and Setup
• Create a Flutter Project
• Running our First Flutter App on Emulator

Why Flutter - Benefits and Motivation Deep Dive

• Why Flutter and Benefits and Motivation
• Hands-On - The Fortune Cookie App
• Randomizing a List of Strings
• Dart Basics - Variables, Strings, and Integers and Vars
• Dart Basics - Introduction to Functions - the Void
• Dart Basics - Function with Int Return Type
• Dart Basics - Passing Arguments in Functions
• Dart Basics - Function Return Types and Arguments - Put it All together
• Hands-On - Fortune Cookie App - Add a Card & Introduction to Widgets
• Hands-On - Fortune Cookie App - Add Images as Assets and Show & Final Remarks

Flutter Widgets - Stateful and Stateless Widgets Deep Dive

• Flutter Widgets Overview - Stateful vs Stateless Widgets
• Widget Hierarchy and Reusability Overview
• Hands-On - The Build Method & SetState
• The Const Keyword
• Tip Calculator App - Introduction and Overview
• Tip Calculator - Create Project and Setup the AppBar
• Adding a Container and Decorating It
• Widgets Documentation & Basics of Theming
• Understanding Theme and the BuildContext
• Widgets & Dart Classes and Objects - Introduction to OOP
• Refactoring Style and Finalizing the Top Widget
• Create the Bill Amount Container and the TextField
• Creating the Split Bill Section
• Adding the Increment and Decrement Functionality
• Refactor the PersonCounter Widget
• Add the TipPercentage and Slider Widgets
• Dart Basics - Required and Named Parameters
• Refactor TipSlide Widget
• Refactor the BillAmount TextField
• Add Tip Calculation Logic
• Tip Calculator Full Widget Refactor
• Section Summary

Flutter State Management - Provider & Improving Previous Apps

• Introduction to Provider State Management Package
• Setup Provider & Understanding Flutter Packages and Dependencies
• Setup Provider Model Class and Implementing a Consumer
• Consumer VS ProviderOf - Overview
• Hands-On - ProviderOf Limitations
• Hands-On - Random Fortune App - Adding a Provider
• Hands-On - Tip Calculator - Add Provider and Code Refactor
• Hands-On - Tip Calculator - Add ThemeProvider
• Hands-On - Tip Calculator - Implement Dark & Light Modes
• Dart Intermediate - Introduction to OOP Inheritance
• Dart & Widget - Inheritance in Flutter Widgets
• Dart Intermediate - Override and the toString Method
• Section Summary

Flutter Navigation - Parsing JSON Files, Listview Widget - Build a Movie App

• Navigation - Movie App Demo
• Flutter ListviewBuilder Widget - Show Movies on a Listview
• Dart - Arrays and Lists and Loops
• Dart - Lists and List Types - Adding and Removing Items from a List
• Hands-On - Create a Movie Provider
• Hands-On - Adding a ListTile for Each Movie - Decorate the List Items
• The Movie Model Class - The JSON Movie File Overview
• Dart - Dart Maps and Creating a Movie Model Class
• Hands-On - Creating the MovieParser Class
• Hands-On - Updating MovieProvider to Parse Movies & Show Movies on the List
• Dart Future Type - Async - Await - Overview
• Hands-On - Customizing ListItem with ExpansionTile
• Hands-On - Adding Navigation to Movie Details Screen
• Hands-On - Passing a Movie to Movie Details Screen
• Refactor - Extract Custom Widget
• Hands-On - Adding Image to the CircleAvatar
• Hands-On - Show Image Posters on Details Screen
• Hands-On - Hide the Read More Button
• Section Summary

Data Persistence with SQLite Database & Parsing JSON From APIs - Book Tracker

• Introduction to the Book Tracker App - Demo
• Hands-On - Create the Book Reader Project & Adding the BottomNavigationBar
• Hands-On - Setting up the onTap for NavigationBarItem
• Hands-On - Creating All Screens and Showing On BottomNavItem Clicked
• The Google Books API Endpoint - Overview
• Hands-On - Create the Book Model Class
• Hands-On - The Network Class
• Hands-On - Getting JSON Payload and Showing in the Console
• Hands-On - Create a List of Book Objects Mapped into Objects & Show Them
• Dart Basics - Control Flow - Branching
• Dart Basics - The NOT Operator
• Dart Basics - TryCatch and Exceptions
• Hands-On - Showing Book Searches on a Listview
• Hands-On - Adding a Gridview and Showing Book Images
• Hands-On - Add Titles and Authors and Fix the Overflow Issue
• Hands-On - Add GestureDetector and Named Routes - Show Details Screen
• Hands-On - Add BookDetailsArgument & Pass a Book Object & Null Safety in Flutter
• Hands-On - Add Image and Book Title to DetailsScreen
• Hands-On - Refactor GridView Widget
• Hands-On - Add Buttons and Description of the Book
• Introduction to Databases - SQLite & Creating the SQLite Database Helper Class
• Hands-On - Add onCreate Function to Create a Table
• Hands-On - Add Insert and ReadAll Books Methods
• Hands-On - Save Book & Read Books
• Hands-On - Show Saved Books in the Saved Screen
• Hands-On - Add ToggleFavorite Status Method
• Hands-On - Add Books to Favorite
• Hands-On - Delete Book
• Hands-On - Save and Show Favorites
• Hands-On - Adjust Favorites & Save Buttons Dynamically
• Hands-On - Simplify Showing the Save or Favorites Buttons
• Hands-On - Toggle the isFavorite and Change the Icon and Text on the UI
• Section Summary

Firebase Realtime Database with HTTP Request - Water Intake Tracker

• Water Tracker Demo and Overview
• Hands-On - Setup FloatingActionButton and AppBar
• Hands-On - Setup Firebase Realtime Database Backend
• Hands-On - Add AlertDialog and TextField
• Hands-On - Save a Water Amount to Firebase Using HTTP Request
• Hands-On - Create Water Model
• Hands-On - Add Provider Class
• Hands-On - Use Provider To Save a Water Entry
• Hands-On - Adding Water Item into the Database and Refreshing the UI - ISSUES
• Hands-On - ISSUE FIX - Show Added Items the Right Way - Add a WaterModel to List
• Hands-On - FIX ID Issue - Revamp the ListTile to Show More
• Hands-On - Add Circular Progress When Loading Water Items
• Hands-On - Add BarChart Package and Show BarGraph with Dummy Data
• Hands-On - Customize the BarGraph
• Hands-On - Add DayOfTheWeek on The Bottom of the Graph
• Hands-On - Create the CalculateDailyWaterSummary Method
• Hands-On - Show Dynamic Water Values on the BarGraph
• Hands-On - Add MaxAmount Percentage for Each BarGraph
• Hands-On - Add Weekly Amount to AppBar
• Hands-On - Add Drawer
• Hands-On - Add Settings & About Screens
• Section Summary

Wrapup

• Wrapup