04

    Your First Flutter App

    Beginner • 14 min • Video Lesson

    Complete tasks and quiz to finish this lesson

    Video Player Placeholder (y1D1Y_I_5Y8)

    Learning Objectives

    • Bootstrap a clean project template using the Flutter CLI
    • Deconstruct pubspec.yaml file components and metadata declarations
    • Inspect lib/main.dart to understand how MaterialApp wraps widget trees
    • Differentiate between Hot Reload and Hot Restart modifications

    What You'll Learn

    1. Creating new projects via 'flutter create'
    2. Analyzing pubspec.yaml configurations and managing package versions
    3. Deconstructing lib/main.dart: MaterialApp, MyHomePage, and state instances
    4. Using terminal hotkeys ('r' and 'R') to hot-update code segments

    Key Concepts

    Bootstrap
    main.dart
    pubspec.yaml
    MaterialApp
    Entry Point
    Hot Restart

    Key Takeaways

    • Every Flutter app executes from main(), which calls runApp() with a root widget.
    • pubspec.yaml lists assets, fonts, external dependencies, and project metadata.
    • Hot Reload loads code changes in runtime memory instantly, keeping the active state; Hot Restart restarts the app state from zero.

    Build Steps

    Knowledge Check

    Which function boots the application widget tree inside main()?

    Where do you configure image assets and custom fonts for your application?

    What action refreshes code modifications but resets active widget states?

    Next Lesson

    05 — Building Your First UI →