Problems

• Development is Slow (expensive)
• Custom is Difficult
• Multi-platform complicates things

Mobile Platforms

Native Approach

• iOS
• Android

Hybrid Approach

Text

• Cordova
• Ionic
• PhoneGap

Cross-platform

Text

• Flutter
• React Native
• Xamarin

Flutter

• SDK for building cross-platform mobile apps, built by Google
• Targets Android, iOS and Fuchsia
• Consistent UIs across devices and manufacturers
• Superb performance

Why Flutter?

• Ready-made widgets
• Rich support for Development Tools (Android Studio/VS Code)
• Fast, 2D rendering engine

Why Dart?

• Supports Just-in-Time (JIT) and Ahead-of-Time (AOT) Compilation
• Dart allows Flutter to avoid the need for a separate declarative layout language like JSX or XML

Just-in-Time Compilation

Architecture

Flutter Basic Commands

Project Structure

• lib/ - just as pub (Dart’s package manager), all the code will be here

• pubspec.yml - stores a list of packages that are required to run the application, just like package.json does it.

• ios/ & android/ - the code specific for each platform, including app icons and settings where you set what permissions you’ll need for your application (like access to location, Bluetooth).

Widgets

• The foundation of flutter apps. A widget is a description of part of a user interface
• Nearly everything in flutter is a widget

https://flutter.dev/widgets

Widgets

Widgets

Stateless Widget

An immutable widget. All its fields are final after creation

Stateless Widget

Stateful Widgets

A mutable widget. State can be changed

runApp() function

A widget that creates a State object