Flutter Redux tutorial

There's a lack of flutter redux tutorials so I'm here to fill that gap.

If you guys do better with YouTube tutorials I have one of those also.

Flutter is great Because you can create android and iOS apps with a single code base. I feel it's super easy to get things done. Flutter has that startup entrepreneur feeling to it.

This tutorial shows you how to get started with flutter and redux.

Here's a preview of what we're building.

Getting Started

Let's get right into it. I recommend you get VS code and install the flutter extension or at least get android studio.

First we need to create a Flutter app.

In the terminal type:

flutter create flutter_redux_app

All done: You will end up with this.

Here it is opened and VS code

Click the button down there to open up the emulator selection. I am on a mac so I can run iOS and Android. Although, on windows you can only run android.

Here I can select which emulator I want to use. I am going to pick iPhone 8.

my iPhone 8 emulator has started.

In our main.dart file we have started code that we need to get rid of.

Here is the library that we need. They consist of:
Shared preferences, Flutter_redux, redux_thunk, and redux.

Save those library inside the pubspec.yaml file. Then cmd + S or ctrl + S

We're going to put everything in the main.dart file for simplicity.

Here we created a Class that will display a text and a button. The button will engage a function and the function will save data into shared preferences. Shared preferences is basically a database.

We create a model for data that the redux library is going to use.

This is an action that redux will fire off. This action is fired off after we save the user data.

The reducer takes the action and spits out A piece of specific data. In this case that data is the user input.

And finally this is the screen that will show us the data that comes from redux.

Full code can be found at my github.

ottokafka/flutter_redux_easy

That's it guys. That's all we need to do to integrate redux into a flutter app.

If this article helped you go ahead and smash that clap button. Cheers 🍺