Build a Recipe Management App with Flutter

In this course we will build a Recipe Management App with Hasura GraphQL Engine and Flutter. We will design our database using the one-to-many relationship between Recipe and Ingredients. We will be developing a Cupertino styled app that will use the Ferry GraphQL client to communicate with our Hasura GraphQL endpoint. We will download the GraphQL schema into a Dart package and implements the various operations for our app.

We will use ferry_generator to generate the relevant Dart classes based on our schema, queries and mutation operations. We will use the get_it package to register our GraphQL client as a singleton, which will allow us to use this around the app in a way that is decoupled from our UI.

=== Contents of this course ===
00:00 Intro and Demo
01:18 Visualise the Database model
01:54 Create recipes and ingredients tables
04:01 Explain project setup and packages
05:24 Create CupertinoApp widget and routes
06:06 Launch app in iPhone simulator
06:36 Implement AllRecipesScreen widget
11:06 Implement NoRecipes and NewRecipeScreen widget
13:30 Implement RecipeListTile widget
18:05 Implement Cupertino modal popup
20:03 Download GraphQL Schema
21:26 Generate Dart classes from GraphQL Schema
21:55 Define GraphQL query operations
24:34 Export generated classes for use in Flutter App
25:14 Implement GraphQL client initialisation function
26:05 Use GetIt package to register GraphQL client initialisation function as singleton
27:07 Use Operation widget to retrieve list of recipes
30:37 Pass response data to RecipeListTile widget
32:52 Implement RecipeDetail widget
41:15 Perform fetch ingredients query
42:20 Generate Ingredients query Dart classes
42:55 Fix Dart Analyser issue picking up
43:22 Fetch Ingredients and display in RecipeDetail widget
49:46 Implement Slidable widget from flutter_slidable package
50:58 Implement Delete recipe alert dialog
53:40 Summary
54:18 Outro

Get the source code → https://github.com/graphicbeacon/recipe_management_app

Subscribe : https://www.youtube.com/channel/UCHSRZk4k6e-hqIXBBM4b2iA

#flutter #mobile-apps