Flutter and Riverpod for Beginners | Task Management App

Set up a Flutter to-do app project, learn naming conventions like lower camel case or snake_case, and configure a com dot yourname organization for automatic app naming.

Create an onboarding screen as a stateless widget, import the material library, and override build to return a scaffold with a body and a background color from the material library.

Explore image asset management in Flutter by creating a media resource file, defining a static image base, and encapsulating access with a private constructor to prevent string errors.

Learn how to set up flutter screen utils to adapt layouts and fonts across different devices. Understand the builder and child requirements in screen util initialization within the material app.

Employ screen utilities to adapt Flutter layouts to different devices by using h and w units, replacing containers with lightweight size boxes, and leveraging extensions to scale heights and widths.

Learn to integrate Google Fonts in a Flutter app using the Google Fonts package or by editing pubspec.yaml for Poppins, and tailor font size and style.

Learn to build a row layout in Flutter using the Row widget, exploring mainAxisAlignment options and mainAxisSize to position image, title, subtitle, and the skip button.

Build a bottom row layout by nesting a secondary row for the button before skip, skip, and swipe indicator, using a size box for precise spacing and nullable width/height handling.

Build a swipeable two-page onboarding in Flutter using a page view inside a stack, with a persistent bottom row and a smooth page indicator, managed by a stateful widget.

Launch the authentication UI by building a sign-in screen with phone login, country picker, and OTP flow, while standardizing a dark scaffold background via the material app theme.

Add an image asset and centered instruction text on the sign-in page, apply 30 horizontal padding, and style with Google fonts dot Poppins and a non-underlined text field border.

Install the pinput plugin in flutter, configure a six-digit otp field, and customize its appearance while wiring onChanged and onCompleted to capture pin for firebase authentication on iOS and Android.

Learn to enable Firebase phone authentication in Flutter apps, configure SHA-1 for Android, connect to Firebase console, and test OTP flows safely with a testing number.

Implement Firebase authentication in a Flutter app by building an authentication repository and controller, enabling send otp and phone verification, and handling errors with snack bars.

Learn to build apps with riverport and flutter-hooks, creating shared state via a state provider, using consumer widgets and watch or read, and transitioning to local state with hooks.

Learn how Riverpod code generation automates provider creation for a counter app, using build runner, Riverpod generator, and annotations, while leveraging part directives to generate boilerplate-free providers.

Add and configure Riverpod, hooks, and Firebase in a Flutter to-do app. Implement a country code picker with the country picker package and a prefix icon.

Learn how to wire Riverpod providers to a Firebase authentication flow by building a reusable authentication repository and controller, and integrating them into the sign-in screen.

Learn to send an OTP via the auth controller with Riverpod, manage phone input using a text editing controller or hooks, and show a loading indicator during async operations.

Learn to implement Firebase phone otp verification, sign in, and store authenticated user data locally with a lightweight database, enabling on-device CRUD and json-based server communication.

Learn robust error handling in Flutter: complete sign-up and save verified user, navigate to home screen with push and remove until, and display snackbars for Firebase and errors with try-catch.

Implement and style the app bar with an add icon button and rounded border, and create a Field widget-based search field with prefix/suffix icons, hint text, and keyboard type.

Build a two-tab task interface with a tab bar and tab controller, showing pending tasks and completed tasks, inside a safe area with padding and a scrollable list.

Enhance the todo page with padding, centered layout, and a dynamic round button, using conditional border and background colors, while adding controllers and notifiers for title, description, and date pickers.

Build a todo tile in a Flutter Riverpod app, displaying today’s active and completed tasks with a consumer widget and FutureBuilder, and assign a random color for each tile.

Add a todo model in a Flutter app using Riverpod, build a task tile with formatted start/end times via a date extension, and handle basic save flow.

Build reusable task expansion tiles in Flutter by creating a task expansion tile widget, using an expansion tile controller to toggle icons, and applying zero padding and responsive styling.