flutter_redux_boilerplate

by FranPitri

Flutter application boilerplate, with Redux included

216 Stars 38 Forks Last release: Not found 69 Commits 3 Releases

Available items

No Items, yet!

The developer of this repository has not created any items for sale yet. Need a bug fixed? Help with integration? A different license? Create a request here:

flutterreduxboilerplate

A Flutter application boilerplate, with Redux included.

Motivation

Coming from a React Native background, using Redux in dart feels rather awkward. This project's purpose is to provide a well-structured starter project, with an architeture that resembles Redux.js'.

This boilerplate includes:

Structure

This project is split into a few directories:

Store directory has only one file (

store.dart
), which is used to initialize the Store. It makes use of some middlewares, which are imported from midddleware directory. There, you will find
middleware.dart
. That file's purpose is to return an array of middlewares, as well as initializing a persistor (read redux_persist.dart docs for more info).

Models directory holds objects used across the app, such as State objects.

app_state.dart
defines the Store's main State, which has other State objects (like
auth_state.dart
) as its properties. This way, you will be able to access to State just like you would in Redux.js.
AppState{
    auth: AuthState {
        // AuthState props...   
    },
}

(you can then read that in your app with store.state.auth.{prop})

Reducers are built with redux.dart's helper functions. You can read about that here.

Screens, containers and presentation directories just hold widgets. They're separated for clarity matters.

Containers are widgets which access to State data via flutter_redux.dart connector widgets. Presentation widgets just receive and show props (usually coming from container widgets). Screens are presentation widgets too, with the difference they hold other widgets to form screens. They're rendered in

main.dart
routes.

Styles directory holds some Maps used to style the app consistently.

main.dart
is the application's entry point. There you set up your StoreProvider and your routes.

Inspiration

This has been inspired by this delightful projects:

We use cookies. If you continue to browse the site, you agree to the use of cookies. For more information on our use of cookies please see our Privacy Policy.