apiKey

authDomain

projectId

storageBucket

messagingSenderId

appId

Gain insights into the BLoC pattern, implement counter and Star Wars apps, use the flutter_bloc library, explore repository patterns, test with bloc_test, and delve into RxDart for reactive extensions.

flutter-web.tar.gz

Flutter Web

Flutter Web-copy

Flutter Test

RxDart

streams

Dart Console App

Flutter is an innovative framework that allows developers to create high-quality mobile and web apps. Business logic component (BLoC) patterns allow Flutter applications to manage application state. 

You'll learn about the BLoC pattern and implement a counter application using streams, events, and states from the BLoC architecture. Next, you will learn to use different widgets provided by the BLoC library that help reduce the boilerplate code. You'll then implement a Star Wars project using the flutter_bloc library and an e-commerce platform using the repository pattern alongside the BLoC pattern. You'll also learn to create mocks to test different blocs using the bloc_test library. You'll also learn to test the functions inside a bloc. Next, you'll learn about the RxDart library that provides reactive programming extensions to streams.

By the end of this course, you'll get hands-on experience with BLoC and RxDart libraries that will equip you to build a mobile or web application with a managed state.

Managing State in Flutter Using BLoC Pattern

final List<Widget> widgetOptions = [
  SingleChildScrollView(
    child: ListView(
      shrinkWrap: true,
      physics: const ScrollPhysics(),
      scrollDirection: Axis.vertical,
      children: const [
        CategoriesGrid(),
      ],
    ),
  ),
  const CartScreen(),
];

abstract class HomeState {
  PreferredSizeWidget currentAppBar;
  int currentBottomNavigationIndex;
  Widget currentBody;
  List<Category> categories = [];

  HomeState({
    // The current AppBar that is shown to the user
    required this.currentAppBar,
    // The current index for the BottomNavigationIndex
    required this.currentBottomNavigationIndex,
    // The current Scaffold body that will be shown to the user
    required this.currentBody,
    // The list of categories that we get from the products repository
    required this.categories,
  });
}

Learn how to use Cubits to conditionally show different widgets in your app.

Getting Started

Managing States with BLoC Pattern

Implementing BLoC Pattern

Flutter BLoC Library Widgets

Project #1: Getting to Know the Flutter BLoC Library

Project #2: Implementing Repository Pattern using BLoC Library

Flutter BLoC Testing

RxDart

Best Practices

Challenges

What's Next?

Appendix

Home Cubit