#FlutterFlow + #Supabase - Building a Goals Tracking App + Episode 6

In this episode we finally get chance to actually record a database entry within #Supabase using our ever growing #FlutterFlow app. First we focus on constructing the Bottom Sheet which is displayed within the root of the HomePage after hitting the FAB button. Once the UI has been built we then build out our actions using the Action Flow editor to perform the database insert. We validate in Supabase that our row has been created to set ourselves up nicely for the next instalment whereby we modify our HomePage to actually display our goals. Hope you enjoy this episode!

If you are keen to commence from this point please grab yourself a FlutterFlow account and clone from this project:

If you missed a previous episode:

If you love my content why not consider buying me a coffee, it's really appreciated:

00:00 Introduction
00:29 Create the Create Goal component
03:01 Adjustments to our themed widgets
04:16 Building our Create Goal UI
11:23 Add the Form Validator
12:02 UI tweak
12:39 Adding the Create Goal Actions
18:02 Sign out user action
18:25 Displaying our Create Goal component
19:59 Testing our app

_____

(official launch in September, but welcome to join today 😉)

🎉 Your love is much appreciated ... A like to this video is like a High Five!!! Thank you all.

[Julian-pgdx]

To put the project clones into the description after every episode was a great idea, Steve!

[NukeAWhaleJezus]

Fantastic tutorial series. Great that you’re covering both the design and the supabase backend together.

[eymardigital]

I request for some help. I have followed along so well and everything seems to be fine, however on goal creation. The goal is not submitted and when I check supabase, I cant seem to find the goal there. I dont know what I could be doing wrong.

[oneavi]

Great tutorial! A questio here : Why do we need to crate a component for this ? Why didnt we create a page for the same ? If I create a page, can it be opened like a bottomsheet ?

[afriknocode]

thanks you i just finished this one and we are at the same level

[LeraMulina]

I haven't found the moment when you created the options for goal status whether it is in progress, not started or completed. How do you create the options for flutterflow projects? Do you create them in database? Where?

[Mel-kwoo]

I really like your tutorials. Could you made one to build a CRM-ERP web app . thank you

[hughgallagher]

in the completed project... why has the slider in the create component been removed?

[Joshua]

how do you make a button insert a row with information without form validation

[ezzabbas]

Great series of tutorials, thank you so much. I would like to ask a question: Is there a way in FlutterFlow to insert a list of rows into supabase? for example, If I want to register students' attendance and I have a list of students names and one button to register (attendance or absence, so the button switch between attendance or absence ) and if the student comes late to the classroom I will record the number of minutes that student delay in a textfield, So I want to record the attendance of all students of my class and save the list of rows to supabase.

[samyftaita]

Hi all. When i create the action of the submit button, i dont have access to the authenticated user infomrations. Is any one else had the same issue?

[neanda]

at 16:44 it's very important that it's set to FALSE (as was corrected in the annotation), this totally threw me in the next episode. I was listening along (not watching) and the app wasn't showing any goals.
also, if you did create the goal when you hadn't set the action as FALSE, then you'll have to edit new goal row in supabase to FALSE for it to show up.
(source: things i had to do :)
great tutorial btw, i just want to reiterate this in case anyone else has this problem later

[_benjaminphilip]

Trying to put listview in a scrollable column gives a "a column cannot be set to scrollable if it has a child that is expanded" error.
Could you please help?
The comments are off on the previous video.