Folder Structure for Flutter

Introduction

Folder organization helps optimize the performance of an application. As the size of an Android project increases, proper folder organization is necessary to avoid bugs and keep your code maintainable. In as much as flutter documentation does not list a specific standard for folder organization, files and folders should be organized by programmers following a particular pattern.

Since there is no rule to flutter folder organization, this article explains just one of the efficient ways of organizing your files and folders in a flutter project.

Table of contents

  1. Default files and folders in a Flutter project.
  2. Folder organization.
  3. Benefits of maintaining a proper folder structure.
  4. Summary

Android: The Android folder contains files and folders required for running the application on an Android operating system. It’s recommended that these folders and files are left as is.

The android folder’s primary sub-folders are the res folder and AndroidManifest.xml file.


iOS: Like the Android folder, this folder contains files required by the application to run the dart code on iOS platforms. The main files under the ios folder are Assets.xcassests folder, and info.plist file. The Assets.xcassests folder is like the res folder in Android. If any modification is to be done to make the application-specific to IOS platforms, it should be done in this folder.



The .idea folder will contain settings related to the code editor you are using to build the application.

Lib: This is the most important folder in the project, used to write most of the dart code. By default, the lib folder contains the main.dart file, which is the application’s entry point. This configuration, however, can be changed.


.gitignore: The gitignore file store files are hidden from the IDE, which needs to be ignored when a project is uploaded to version control platforms like GitHub. 

.metadata: Like the .gitignore, this file is also hidden. It contains metadata required by the flutter tool to track the flutter project

.packages: Since flutter is a framework, and it comes with numerous packages and libraries. The .packages file holds the path to every package and library used in the project. Changes should not be made to this file by programmers.

pubspecam.lock: This file contains the version of each dependency and packages used in the flutter application.

pubspec.yaml: This is the file we use to add metadata and configuration specific to our application. With this file’s help, we can configure dependencies such as image assets, fonts, and app versions.


README: This markdown file is used to describe your application in the GitHub repository. You can include what your project does and the dependencies it uses in this file.


Expanding the lib folder

The lib folder is where most of the code is written. We will break the folder into several subfolders, as shown below.

Screens: This folder will contain the application UI files rendered on the device screen.


Utils: This folder contains the functions used to implement the application’s business logic. For instance, if we build a social media application that supports a multi-account login, the utilities will ensure that the data rendered is changed according to the currently logged-in account.


Widgets: This folder contains widgets that are used repeatedly in the application. If you are using an API to list GitHub accounts following a particular user, the followers’ list view remains the same. Only the data that is rendered is dynamic. In such a case, we will use the followers widget in our widgets folder.


Data: The data folder contains data collections that are fetched from services or databases. For instance, if our application will use firebase, we could have a user model containing information about the user relating to password name, age, etc.


Services: Services folder should handle your application’s networking logic. For example, once a user gets authenticated with Google or GitHub, the application needs to update the backend with the access token. The service folder will contain the implementation of the logic responsible for handling this functionality.


Summary


In this article, we have understood every file and folder generated during the creation of a flutter application. We went ahead and organized the files and folders to facilitate code maintainability


Comments

Post a Comment

Popular posts from this blog

Unlocking the Power of OOP: A Beginner's Guide to Objects, Encapsulation, Inheritance, Abstraction, and Polymorphism

Image
 OOPs (Object-Oriented Programming System) This article explains the fundamental concepts of OOP and its most significant advantages What is OOPs (Object Oriented Programming System)? Object-oriented programming System (OOPs) is defined as a programming paradigm (and not a specific language) built on the concept of objects, i.e., a set of data contained in fields, and code, indicating procedures – instead of the usual logic-based system. Key Concepts of OOP To understand and use object-oriented programming, it is necessary to know the following key concepts : 1. Class A class is a blueprint or template of an object. It is a user-defined data type. We define variables, constants, member functions, and other functionality inside a class. it binds data and functions together in a single unit. It does not consume memory at run time. Note that classes are not considered as a data structure. It is a logical entity. It is the best example of data binding. Note that a class can exist witho...
Read more

HTTP GET Response in Flutter

Model Class // To parse this JSON data, do // // final welcome = welcomeFromJson(jsonString); import 'dart:convert' ; List<Welcome> welcomeFromJson (String str) => List <Welcome>. from (json.decode(str).map((x) => Welcome . fromJson (x))) ; String welcomeToJson (List<Welcome> data) => json.encode( List < dynamic >. from (data.map((x) => x.toJson()))) ; class Welcome { Welcome({ required this . userId , required this . id , required this . title , }) ; int userId ; int id ; String title ; factory Welcome. fromJson (Map<String , dynamic > json) => Welcome ( userId: json[ "userId" ] , id: json[ "id" ] , title: json[ "title" ] , ) ; Map<String , dynamic > toJson () => { "userId" : userId , "id" : id , "title" : title , } ; } Main Class // Importing important packages require to connect // Flutter and Dart import ...
Read more

Building a Flutter Firebase Firestore CRUD App

    In this tutorial, we will walk you through the process of creating a Flutter application that performs CRUD (Create, Read, Update, Delete) operations on a list of items using Firebase Firestore. Firestore is a cloud-based NoSQL database provided by Firebase, and Flutter is a powerful open-source framework for building cross-platform mobile apps. By combining these technologies, you can create a real-time and cloud-synced list management app.  Prerequisites Before we start, ensure that you have the following prerequisites in place: Adding Dependencies First, we need to add the necessary dependencies to our Flutter project. Open your project's pubspec.yaml file and add the following dependencies: dependencies:   flutter:     sdk: flutter   firebase_core: ^latest_version   cloud_firestore: ^latest_version Replace latest_version with the actual latest versions of the firebase_core and cloud_firestore packages available on the Flutter packages webs...
Read more