Flutter Starter Architecture (MVVM)

  Flutter App

Short Intro: Starter architectures for your next Flutter project in order to make it scalable and easy for maintenance and tests.

construction_workerwrenchnut_and_bolt Flutter Starter Architecture (MVVM)

My custom starter project for Flutter apps.

I was looking for a simple way to build Flutter app in a scalable and clear way way to operate. So I’ve spent a little to search for how to implement an MVVM architecture in a proper and efficient way for scalable apps. This is the first result of my research. I use it for two projects now. This one provide an MVVM architecture powered by get_it and provider. This work was mainly inspired by the work of Filledstacks.

eyes Overview

I have made:

  • helpers folder where I have put all the utilities of the project such as constant values, dart enumerate, extensions, theming, and other general utilities.
  • models folder where I have put all the data’s classes representation.
  • services folder where I have put all folders relative to data’s storing and fetching base on local storage, firebase, or API.
  • viewmodels folder where I put all the viewmodels related files. In the easiest way, I call viewmodel a bridge between the models, services, and views. Their job is to handle the business logic of the view they are related to in order to make the views part safe from anything non-relevant to UI.
  • views folder where are stored the UI part of the application. Each view/page/screen of the application is put here in differents folders. Those folders contain the base file of the view and a widgets folder where are stored the widgets which are used only on this view. The global widgets are located in the widgets folder.

I have also added a base class for viewmodels here. All the next viewmodels you’ll write should inherit from the BaseViewModel class. There is also a BaseView widget here to mix the access easily to the base viewmodel proper to each class.

At the root of the app, you will see the locator.dart file where I registered an instance of each service and viewmodel in order to use them efficiently in the whole app. You will also find the routes.dart where the named routes of the app are stored in the AppRouter class.

boom Future

I will create new branches to add more base project with various kind of scalable architecture.

electric_plug Plugins inside

The repository contains based packages for provider, firebase, firebase_auth, cloud_firestore, and get_it

Download Flutter Starter Architecture source code on GitHub

https://github.com/NemesisX1/flutter-starter-architecture