How to create folders in the project, grouping them by file types
How to separate and structure widgets into different files
In this chapter, you will learn how to create a Flutter starter project and how to structure the widgets. (I'll cover widgets in depth in the next three chapters.) In future chapters, every time you start a new example, I'll refer to this chapter, which contains the steps to create a new starter project. Like when building a home, the foundation is the most critical factor, and the same is true when creating new apps.
CREATING AND ORGANIZING FOLDERS AND FILES
All the example apps created in this book start with the same steps in this chapter for creating a starter project, so I'll refer to this process often. To keep the project code organized, you'll create different folders and files to group similar logic together and to structure the widgets.
STRUCTURING WIDGETS
Before you start developing an app, it's important to create your structure; like when building a house, the foundation is created first. (In Chapter 5, “Understanding the Widget Tree,” you'll explore widgets in more detail.) Structuring widgets in an organized manner improves the code's readability and maintainability. When creating a new Flutter project, the software development kit (SDK) does not automatically create the separate home.dart file, which contains the main presentation page when the app starts. Therefore, to have code separation, you must manually create the pages folder and the home.dart file inside it. The main.dart file contains the main() function that starts the app and calls the Home widget in the home.dart file.
SUMMARY
In this chapter, you learned how to create the starter project you'll use for all future apps in this book. You created folders with the mkdir command and named them accordingly to group the logic. You also created two Dart files: main.dart for the main() function that starts the app and home.dart to contain the code for the Home widget.
In the next chapter, we analyze the widget tree. Flutter works by nesting widgets together, and we find out quickly that readability and maintainability takes a hit quickly. We take a look at an example of how to flatten the widget tree.
WHAT YOU LEARNED IN THIS CHAPTER
TOPIC
KEY CONCEPTS
mkdir
This is the command to create folders by name.
main.dart
The main() function starts the app and returns either a MaterialApp (Android) or CupertinoApp (iOS).
home.dart
This contains widgets that show the first page's layout, or home page.