mobx_effective_architecture

An effective architectural pattern for Flutter Apps using MobX

Getting Started

Prepare you environment

Install the following VSCode Plugins:

Awesome Flutter Snippets
flutter_mobx

Leave the following command running in a background prompt, to generate the MobX/JsonSerializable files:

flutter pub run build_runner watch

In your settings.json file, insert the following content:

"files.exclude": {
    "**/*.g.dart": true,
}

Create the .env file, based on .env.example.

Wiki

Introduction
Features
Scaffolding
Third-Party Libraries
Lint
Contributors

Introduction

This project aims to help developers who are starting a new project in Flutter, using MobX to manage the state. MobX is a state-management library that makes it simple to connect the reactive data of your application with the UI. As a developer, you focus purely with on the data that will be consumed by the UI, without worrying about keeping the two in sync.

This application was developed to contain examples of features that are usually needed in apps, as well as features that we had difficulty implementing during our App development journey in Flutter.

Features

Splash Page

The Splash Page loads data used as the basis for the application, checks the existence of a User Token and validate whether the user has ever logged into the App.

Login Page

Joke Page

The application's home page, makes HTTP requests for a joke API to exemplify the rendering of a Loading component, as well as an in-App notification presenting the success of the request. This page also exemplifies Navigation to other pages, along with the presentation of a Dialog, both without using Context.

Add Custom Joke Page

Exemplifies the state sharing between two totally independent pages.

Scaffolding

Core concepts for this project's structure

Sub-packages should not introduce new concepts, just more details
Packages should reflect business-concepts, not technical ones

Explanation of this project's folders:

lib\components: Helper Widgets that will be used throughout the whole app

lib\domain: All classes that are inside a specific 'domain', considering the business-concepts

lib\shared: Classes that are shared throughout more than one domain

lib\utils: Helper classes

Third-Party Libraries

firebase_analytics: Plugin to use the Google Analytics for Firebase, an app measurement solution that provides insight on app usage and user engagement on Android and iOS

firebase_crashlytics: Plugin for Firebase Crashlytics. It reports uncaught errors to the Firebase console

flutter_dotenv: Used to configure any flutter application with global variables using a .env file

mobx and flutter_mobx: Libraries to reactively manage the state of the application

get: Navigation library that lets you navigate between screens, open dialogs, and display snackbars easily with no context

get_it: Service Locator that allows to "inject dependencies" and request them everywhere in your App. It can be used instead of InheritedWidget or Provider

hive: Key-value database. Strongly encrypted using AES-256. Faster than Shared Preferences and SQLite

json_annotation: Library used to generate code for JSON serialization and deserialization

modal_progress_hud: A modal progress indicator widget. Wrap around another widget to block access to widget during an async call

oktoast: Toast library to provide in-app toast notifications