Flutter & Firebase App Tutorial — Part 2 App Structure

4 min readOct 23, 2021

Create a flutter authenticate app in 10 mins by using firebase as the back-end. This Flutter tutorial is for beginners to build an app step by step with Firebase authenticate feature.

If you haven’t set up your environment, please go to Flutter & Firebase App Tutorial — Part 1 Get Started.

Step 1: Create folders to better structure the codes

Create a few folders inside the lib folder so that we can organize codes efficiently.

Create folders in a Flutter App — Lumei Digital

Step 1.1 👉 screens folder: all the widgets that make up the different screens are inside this folder.

Step 1.2 Create subfolders for different sections of your app.

➡️ home: a sub-folder of screens folder. All the different widgets that create the home screen will live in this folder.

➡️ authenticate: a sub-folder of screens folder. All the different widgets that create the authenticate screen will live inside this folder.

Step 2: Create widgets

Step 2.1 Create a new file called “authenticate.dart” inside the authenticate folder. It will be the root authenticate widget and shows either the “Sign in” widget or the “Sign Up” widget.

Step 2.1 Create a stateless widget called “Home” inside the home folder. It’s the widget that wraps the list widget