Welcome to my introduction to Flutter for Beginners.

I have created this tutorial to help you learn about basic layouts in Flutter.

INCLUDED IN THIS TUTORIAL

• MaterialApp, ThemeData, and how to create a Scaffold with an AppBar
• Column and Row widgets, and how to use the CrossAxisAlignment, MainAxisAlignment properties
• the Padding widget
• how to create and customise Text widgets
• creating custom button widgets: how to customise their color & shape, and add images with logos
• how to design a good and ergonomic widget API
• and much more

LESSONS:

• 00:00 - Intro
• 02:01 - Writing the root widget of the app
• 06:11 - Adding the MaterialApp
• 09:14 - Adding some folders to our project
• 11:26 - Adding a sign-in page
• 15:03 - The ThemeData class
• 17:17 - The AppBar widget
• 19:57 - Preview of the SignInPage layout
• 21:27 - Adding a Column layout
• 24:46 - The CrossAxisAlignment property
• 28:44 - Code formatting with dartfmt
• 32:57 - Adding some boxes and extracting code into a method
• 36:38 - Private methods
• 40:06 - Adding some padding
• 44:42 - The MainAxisAlignment property
• 45:58 - Text, TextStyle and FontWeight
• 49:12 - Introduction to buttons
• 51:04 - Adding the first button
• 54:35 - Button callbacks explained
• 58:51 - Customising button colors
• 01:02:03 - MaterialColor explained
• 01:05:13 - Changing button shapes
• 01:07:31 - Making code reusable
• 01:08:58 - Creating a reusable custom RaisedButton
• 01:15:40 - Creating a reusable SignInButton
• 01:19:55 - Setting default values
• 01:22:20 - Making the button height configurable
• 01:26:17 - Adding the remaining buttons
• 01:30:56 - Adding logos: introduction
• 01:32:16 - Updating the pubspec.yaml file
• 01:36:20 - Image variants
• 01:38:15 - Adding an image inside a button
• 01:41:51 - Arranging widgets horizontally in a Row
• 01:46:20 - The Opacity widget
• 01:49:01 - Creating a custom SocialSignInButton
• 01:55:02 - The @required annotation
• 02:00:08 - Using assertions for better widget API design
• 02:09:12 - Conclusion

Happy coding!

#flutter #mobile-apps #programming #developer