Simple Recipes App made in Flutter — List View

Michal Krol
7 min readOct 28, 2018

In the article Simple Recipes App made in Flutter — Introduction you’ve learned about stateless widgets, layouts, themes and how to navigate in Dart and Flutter. Requirements to follow this series of articles are basic approaches of object-oriented programming and basic command line knowledge. You may follow the previous article to continue the implementation from that point. Over the next few weeks, I will publish further articles to continue the story of our Recipes app and to write about a few more topics.

Today, we are going to enjoy a good coffee and familiarize us with list views, create a data model and get more confident in implementing custom widgets and in using themes.

You can find the final result of this article in 02_list_view branch in recipes_app repository on github.

Ready, set, go!

Data Model

In the first step, we’re going to create a data model for recipes as a Dart class. Let’s call it Recipe and implement fields id, type, name, duration, ingredients, preparation and imageURL, which we’re going to use to store data of many tasty recipes.

As always, bear a clear structure of the project in mind and create a directory…

--

--

Michal Krol

👨🏼‍🏭📱 freelance fullstack mobile and web apps developer | 💙 Flutter enthusiast | https://krolmic.dev/