Daniel Habibi
Daniel Habibi
  • Видео 13
  • Просмотров 20 573
How to build an app with multiple user types in FlutterFlow | Role-Based Access Control (RBAC)
Hey #flutterflow fam!
I made this quick video because I see this question asked all the time.
How do I create an app in FlutterFlow with multiple user types?
This is known as Role-Based Access Control (RBAC)
A very important note that I forgot to mention:
Best practice when handling roles is not managing them from UI, but every feature call or request should be checked for roles and permission on the server side. Also, UI role management is great for user experience!
This is a short and sweet video to help give you a mental model on how to approach this.
If you would like to see how it is done on the backend, please let me know in the comments!
Просмотров: 1 020

Видео

FlutterFlow | API Best Practices using Data Types
Просмотров 2,6 тыс.7 месяцев назад
Let me know if you found the video helpful and what you want my next video to be on! Try out Xano as your backend for your next @FlutterFlow project! xano.io/tpk3qpcn
[FlutterFlow] Xano Firebase Dynamic Push Notification System
Просмотров 1,3 тыс.11 месяцев назад
Hey everyone! Sorry for not uploading in a while. I've been busy with client work, coaching, consulting, and my 2 jobs. I hope this video gives you a good mental model on how to implement this and helps you get started on your push notification system in Xano. I'll update y'all with the templates and snippets on Twitter/X so be sure to follow me there! Let me know what else you'd like to see an...
How to create hover states in FlutterFlow - Web Navigation
Просмотров 3,9 тыс.Год назад
Hey everyone! This one is on how to create web hover states in #flutterflow with the mouse region widget. Sorry again about the mic. I'm still traveling and this is the best I can do for now! So what are hover states? Also known as a "mouseover effect," they are commonly used in website navigation menus, buttons, and links to improve user experience and provide visual feedback. Let me know if y...
Map view cards with JSON and FlutterFlow's Google Map Widget
Просмотров 3,3 тыс.Год назад
Hey friends! So the audio is a little bad in this one because I'm traveling (this was the second time recording it too). Anyway, I wanted to show how you can use custom dialog boxes to display JSON data from an API (in my case it's form my Xano backend) over map markers displayed in the GoogleMaps FlutterFlow widget. Also, sorry for not uploading in a while! I've been extremely busy but I creat...
Designing for the User Experience - UI and UX in FlutterFlow [Part 1]
Просмотров 360Год назад
Hey everyone! This is a new series I'll be doing since people have requested it. Please note that this series will be showing different UX and UI functionalities and designs and how to implement them. These are not final designs so I don't recommend trying to copy them as is!
FlutterFlow and Xano Tips and Tricks
Просмотров 512Год назад
This video was requested by a user on the FlutterFlow community. It contains a bunch of tips and tricks to save time and increase your productivity. Let me know if anyone of these helped and happy building!
Calendly Style Booking System with Xano and FlutterFlow [Part 2]
Просмотров 847Год назад
This is part 2 of the Calendly style booking system where I show how I integrated it with Google workspace. This should help you create a booking system like the one I've created with Xano, Google, and FlutterFlow. I would like to show more but it would involve showing sensitive information so I can't. Let me know if you come up with something better! Xano Video for Google Service Account Setup...
How to integrate Xano + Firebase + FlutterFlow for Social Logins and Push Notifications [Part 1]
Просмотров 2,5 тыс.Год назад
Part 1 contains the token exchange process (login action flow and Xano API call) and how to avoid 401 Unauthorized due to Xano authentication token expiration. IMPORTANT: The google kids contains the key to decode our JWT identity token from from Firebase and through FlutterFlow I wasn't super clear about this in the video, I apologize! Also, you should do the Firebase setup according to Flutte...
How to get Empty List Widget working with Xano and FlutterFlow
Просмотров 413Год назад
I'm super happy to share how I got this functionality working!! I hope it helps someone! Also, if you want to learn more about the Empty List Widget I recommend this video from a FlutterFlow livestream: ruclips.net/video/zSDzmU1Vfvs/видео.html
Toggle Icon Update and quick fix for FlutterFlow and Xano
Просмотров 1,4 тыс.Год назад
This is a follow-up/update to this video: ruclips.net/video/uz2H7UBS4aQ/видео.html I didn't want to let this one go and I had to let y'all know that I found a better workaround because I discovered the root issue! I hope this helps someone out there!
Calendly Style Booking System with Xano and FlutterFlow [Part 1]
Просмотров 2,1 тыс.Год назад
This isn't complete yet but I wanted to share my progress so far and hope it helps someone with the model of how to build something like this!
Why it took me a week to get Toggle Icon working with Xano and FlutterFlow
Просмотров 417Год назад
UPDATE: I couldn't let this one go and found a better workaround that involves a custom function! Check it out here: ruclips.net/video/JTDAwYdaiU8/видео.html I have no idea what the title should be for this video but I go over a bunch of things having to do with Flutter, API Calls, JSON, Authentication, Toggle Icon, Xano, Firebase, and experimenting with different logic flows. For native Englis...

Комментарии

  • @sgmxmx9008
    @sgmxmx9008 6 дней назад

    Hi, thanks for everything. can i get a discord invite please? Regards

    • @danielhabibi
      @danielhabibi 6 дней назад

      @sgmxmx9008 My pleasure! Here you go discord.com/invite/uU8xXU3Z

  • @edwhard2000
    @edwhard2000 23 дня назад

    I'm trying to build an app that has partners and clients, and obviously this needs to be separated. I'd love to see how to set this up in depth. I'm using firebase

  • @IECVanuatu-g6e
    @IECVanuatu-g6e Месяц назад

    Thanks was seeking to convert json to datatype for days and found your video... manage to make it working in 2 minutes. Thanks again.

  • @Mwelwajr
    @Mwelwajr Месяц назад

    The question is, how does one sign up and update each user document separately?

    • @danielhabibi
      @danielhabibi Месяц назад

      @Mwelwajr it depends on the type of app. For example, a 2-sided marketplace can have a single signup, and during onboarding, the user can select their roles. In my example, the admins are assigning user roles in the admin dashboard.

    • @Mwelwajr
      @Mwelwajr Месяц назад

      @@danielhabibi can you please do a full video for this role-based access

  • @practicalNoLowCoder
    @practicalNoLowCoder Месяц назад

    Would you know if FF has introduced features to be able to access the card without use of custom functions since your recording? Regardless, would love a peek at your code. Would appreciate a discord invite.

    • @danielhabibi
      @danielhabibi Месяц назад

      I don't believe they have, and just so you know, the app shown in the video is using this method in production. I've had a few ideas on how to improve it, but haven't had the time to explore them yet. I'll try to prioritize it and release an updated video if any of those ideas pan out. In the meantime, here's a link to my discord! discord.gg/7wkm5pEc

  • @E2dbro
    @E2dbro Месяц назад

    Hi Daniel, Can I please get access to the discord

    • @danielhabibi
      @danielhabibi Месяц назад

      @@E2dbro discord.com/invite/WhCxx8td

  • @XxJonCxX
    @XxJonCxX Месяц назад

    This is helpful! I would love to see a more in depth video on this

    • @danielhabibi
      @danielhabibi Месяц назад

      @XxCancerKid15xX you got it. I'm adding it to the list. Thanks for letting me know!

  • @katz87
    @katz87 2 месяца назад

    Looks great, would love to join the discord as well

    • @danielhabibi
      @danielhabibi 2 месяца назад

      Thanks, here you go! discord.com/invite/wWbQm7yU

  • @AmadiHunt
    @AmadiHunt 3 месяца назад

    Sorry if this is a silly question but could you maybe show what your get user data call is at the very end of the login action chain and also the get user data call you used for the 401 error, I just want to make sure I have set both up correctly.

    • @danielhabibi
      @danielhabibi 3 месяца назад

      There's no such thing as a silly question! The get user data call is a standard auth/me endpoint in Xano, which is used to grab stuff like their name and update the app state with those variables. Please let me know if that clears things up for you or if I need to clarify anything!

    • @AmadiHunt
      @AmadiHunt 3 месяца назад

      @@danielhabibi Thank you for clarifying, it is much appreciated. I was attempting to use the user endpoints which in hindsight was rather silly. This makes much more sense.

  • @saruskas
    @saruskas 4 месяца назад

    Hi, thanks for everything. can i get a discord invite please? Regards

    • @danielhabibi
      @danielhabibi 4 месяца назад

      My pleasure! Here you go discord.gg/WMfzqMMU

    • @saruskas
      @saruskas 3 месяца назад

      @@danielhabibiI appreciate it very much, thank you! Do you know why I can't close the cards when I tap on the map? The cursor on the map is a "hand" and does not recognize the click :S

    • @danielhabibi
      @danielhabibi 3 месяца назад

      @saruskas My pleasure! Thanks for posting on Discord. I replied to you there.

  • @AristonJumagbas-jp4xt
    @AristonJumagbas-jp4xt 4 месяца назад

    can I get a discord invite too

    • @danielhabibi
      @danielhabibi 4 месяца назад

      Here you go! discord.gg/pUsVStCU

  • @J-the-Rod
    @J-the-Rod 4 месяца назад

    Do you still have the discord channel?

    • @danielhabibi
      @danielhabibi 4 месяца назад

      Yup, here you go! discord.com/invite/ewCquAUd

  • @topazyates
    @topazyates 5 месяцев назад

    nice. would love see all of this. can i get a discord invite?

    • @danielhabibi
      @danielhabibi 5 месяцев назад

      Of course! Here it is: discord.com/invite/6vDJPevc

  • @danielhabibi
    @danielhabibi 5 месяцев назад

    Hey friends! This method is unfortunately outdated, and I recommend following the steps here instead. I'll make a video on the new method soon! docs.flutterflow.io/data-and-backend/api-calls/api-calls-101

    • @becraveiro1
      @becraveiro1 4 месяца назад

      Hi Daniel! Can you please create a video showing this update? I don't think I am creating my Data Type correctly, as if doesn't seem like my page state is updating. Thanks again for the helpful videos!

    • @danielhabibi
      @danielhabibi 4 месяца назад

      @@becraveiro1 Hey! The FF team actually just added an auto-create Data Type from a JSON response because so many people were struggling with it and spending too much time trying to get it to work. 1. Test your API 2. Copy the JSON response 3. Go to Data Type Tab 4. Click the new button and paste your JSON in the box Hope this helps!

    • @becraveiro1
      @becraveiro1 4 месяца назад

      @@danielhabibi Hmmm Should I copy the entire Body JSON form the API Response test or should I copy the Raw Body? Also, im only interested in a few paths, does that make a difference? Just to give some context, my API Call is a google maps one that outputs a list of restaurants (lat, long, name, address). I am parsing my Data Type as a List, but the Data Type itself is not a list (each item form the API has only one lat, long, name, and address). Seem like my Page State (DataType List) is not being updated using the JSON to Data Type.. Weird.

  • @MusicbyAnt
    @MusicbyAnt 5 месяцев назад

    hey Daniel thanks for the quick tuto. i follow the same tuto as you did however im returning an error. Would you be able to help me by any chance to figure out where is the blocking?

    • @danielhabibi
      @danielhabibi 5 месяцев назад

      Hey, my pleasure! Here's an invite to my discord server where I'll be glad to help you out! discord.com/invite/8sXqh3eR

  • @anhoangthien6715
    @anhoangthien6715 5 месяцев назад

    Can you please share the function google_service_account_access_token sir? I stuck at this step to get Authorization token.

    • @danielhabibi
      @danielhabibi 5 месяцев назад

      You can get the snippet for the function from the description of this video and it shows you how to create the service account: ruclips.net/video/SJd-oC-OG_E/видео.html

    • @anhoangthien6715
      @anhoangthien6715 5 месяцев назад

      Thanks for your support!@@danielhabibi

  • @leonlim1625
    @leonlim1625 5 месяцев назад

    Hi Daniel, I clicked on the discord invite in the post below but it is no longer valid. Could you please resend the invite or share the sample app here? I need this function for my app and hope to hear from you soon. thanks and much appreciated!

    • @danielhabibi
      @danielhabibi 5 месяцев назад

      Hey! Here's an invite. You'll find it under the custom-code channel. discord.gg/ZvY6pHad

    • @leonlim1625
      @leonlim1625 5 месяцев назад

      @@danielhabibi Thank you so much Daniel, managed to access the discord. I just subscribed to your YT channel and looking forward to more amazing tutorials on FF. Cheers!

  • @selimmete4879
    @selimmete4879 6 месяцев назад

    We want to build app can you help as contractor?

    • @danielhabibi
      @danielhabibi 6 месяцев назад

      Hi! Please email me at danielhabibiofficial@gmail.com

  • @togugram
    @togugram 6 месяцев назад

    Thanks!

  • @jules_gyn_
    @jules_gyn_ 6 месяцев назад

    Hi, how did you put the button to navigate back on the map? Mine stays outside

    • @danielhabibi
      @danielhabibi 6 месяцев назад

      There are two ways to do it. Option #1 is how I did it using a stack. You can see it in the widget tree at 1:20 in the video. #2 Click on the scaffold and add a Floating Action Button (FAB). It's under Page Elements and can't be added as a child of another widget which is why we need to select the scaffold to see it show up when adding a widget. Hope this helps!

    • @jules_gyn_
      @jules_gyn_ 6 месяцев назад

      @@danielhabibi Thank you for your help! Just suscribed, I stay tuned whenever you post helpful videos like this

  • @projects-flow
    @projects-flow 6 месяцев назад

    Hello, very good video. Which recorder and editor do you use for your videos?

    • @danielhabibi
      @danielhabibi 6 месяцев назад

      Thanks! I use screen.studio/@oKP8q for both recording and editing. It's mac only though.

  • @ksrath1
    @ksrath1 7 месяцев назад

    hey Daniel, do you think the JSON parsing issue is resolved now with the Data Types? I will give it a go!

    • @danielhabibi
      @danielhabibi 7 месяцев назад

      Hey! Yes, exactly! You shouldn't have any issues by using Data Types.

  • @ksrath1
    @ksrath1 7 месяцев назад

    Hi Daniel, thanks for this video! I'm just wondering, how does FF take the API 'parse as Data Type' and map it from the JSON path to the relevant field in 'Data Type', as per your video at 4:55? I'm trying to do that but I don't have the option 'Data Structure Field' underneath the 'course' option.

    • @danielhabibi
      @danielhabibi 7 месяцев назад

      Hi! I think I left out that part by accident. We want to create our Data Types and build out the schema the way our API is structured. This image should help imgur.com/LzUzdrR Also, FF actually changed the documentation on this so I'm going to re-record it and upload it as soon as possible!

    • @ksrath1
      @ksrath1 7 месяцев назад

      Hey@@danielhabibi TYSM, your image makes sense, and of course it now makes sense that the data type is mapped the way the API is structured! I went through the FF documentation and noticed that I had to update my FF app on my mac...that seemed to have the 'Data Structure' options. And it didn't need the 'Update App State' variable to map the API response to the data type. Hurray! Can I be cheeky...and ask for a next video request? Would it be possible to do something with Xano/API populating dynamic children that ISN'T a list view? e.g. some sort of stack? ❤

    • @danielhabibi
      @danielhabibi 7 месяцев назад

      @@ksrath1 My pleasure! Yes, I need more requests but I'm not sure I understand this one... What do you mean exactly? Like one that is generating dynamic children of a PageView or Swipeable Stack? Feel free to send me a Loom or screenshot through a DM on twitter, on discord, or to my email.

  • @AndrewBurchfield
    @AndrewBurchfield 7 месяцев назад

    Such a great video! (And teacher! #Subscribed) I’m still having issues though 😔 Is there somewhere I could send you an email or show you what I’m dealing with?

    • @danielhabibi
      @danielhabibi 7 месяцев назад

      Haha thank you! Yes, of course, and I'm sorry to hear that. You can email at danielhabibiofficial@gmail.com

  • @boldbold7398
    @boldbold7398 7 месяцев назад

    yeah free marketplace is a great idea please do it, also this video was amazing and informative, thank you so much

    • @danielhabibi
      @danielhabibi 7 месяцев назад

      Great, will do! My pleasure!

  • @danielhabibi
    @danielhabibi 7 месяцев назад

    Sorry about the weird aspect ratio on this video!

  • @SaifShariff-fk2zo
    @SaifShariff-fk2zo 7 месяцев назад

    what do you do if there are multiple markers on the same location, how can you give the user an option on which marker to see more information about???

    • @danielhabibi
      @danielhabibi 7 месяцев назад

      Great question! Unfortunately, I haven't had time to add that functionality. Right now, it returns the first object it finds. I'm not positive you can hack the FF GoogleMaps widget to do that. If you find a solution, please share it with the community!

  • @netoguaxupe
    @netoguaxupe 7 месяцев назад

    Hi Daniel congrats!!! man you helped me a lot. I'm from Brazil and I have a low experience in code but i'm doing well with xano and FF and I was looking fo this solution for a long time because I think as you, xano is amazing but a native integration with firebase is also amazing. Man I have no way to tank you for that. Sucssess and send more amazinf videos like that!!!!!

  • @togugram
    @togugram 8 месяцев назад

    I need a very strong coffee...

  • @user-zi2wn8vf5q
    @user-zi2wn8vf5q 8 месяцев назад

    share this project link

  • @SahanRuchika
    @SahanRuchika 9 месяцев назад

    Great tutorial! Good luck

  • @willembarnard2596
    @willembarnard2596 10 месяцев назад

    You are a lifesaver. Thank you so much. I had massive headaches getting the JSON object parsed

  • @flutterflowexpert
    @flutterflowexpert 11 месяцев назад

    Great work! Keep on pushing! And good luck with your future, btw!

    • @danielhabibi
      @danielhabibi 11 месяцев назад

      Thanks Dimitar ❤️ I really appreciate your support and encouragement 🙏

  • @AlexMoorhouse
    @AlexMoorhouse 11 месяцев назад

    Amazing info mate, thank you!

  • @AlexMoorhouse
    @AlexMoorhouse 11 месяцев назад

    Great tips mate, gona have to re-watch again as there is lots of tips!

    • @danielhabibi
      @danielhabibi 11 месяцев назад

      I'm about to record another one because I've found even more ways to improve my workflows in FlutterFlow!

  • @alydiallo4179
    @alydiallo4179 11 месяцев назад

    Can you make tutorials for notifications on foreground?

    • @danielhabibi
      @danielhabibi 11 месяцев назад

      I'll add it to the list. Thanks for the suggestion! Is there a specific use case you have in mind?

    • @alydiallo4179
      @alydiallo4179 11 месяцев назад

      @@danielhabibi Allow the user to see his notifications when he clicks on the notification icon

    • @danielhabibi
      @danielhabibi 11 месяцев назад

      If you're using Firebase, check the official FF channel. They just showed how to build this on yesterday's livestream. If you're doing it in or another relational DB, I'll make a video on it!@@alydiallo4179

  • @stevereekie-qk6mt
    @stevereekie-qk6mt Год назад

    Hi Daniel, amazingly useful. Many thanks for the upload and your effort putting the video together. Just wondering when/if you'll be releasing Part 2 for notifications?

    • @danielhabibi
      @danielhabibi Год назад

      My pleasure, Steve! I'm a little slammed at the moment, but you're the second person to ask for it recently, so I'll try to do it asap! Also, I was thinking of creating a FF template and Xano snippet for all this to make people's lives easier and help jump-start projects quicker. Let me know if you're interested in that!

    • @unaialapont5500
      @unaialapont5500 11 месяцев назад

      Hi Daniel! Thank you so much for your help, I would love to see Part 2. The snippet would make it super useful, I'm sure many people would use it. Keep up the good work!

  • @mediacode_
    @mediacode_ Год назад

    Hello, thank you for this very interesting video. I would like to see the custom functions, can I have an invitation to the discord? thank you.

  • @luchoo1991
    @luchoo1991 Год назад

    Great Guide Video! Are you releasing the second part for the Push Notification soon? I'm really looking forward to that.

    • @danielhabibi
      @danielhabibi Год назад

      Thanks! Sorry, I never got around to recording part 2. I'll try to get it out asap!

  • @katnissapp
    @katnissapp Год назад

    I have another question @danielhabibi , when you make the : Create Authentification Token at 6:30, the return value (authToken) in a percist App State, but at 8:47, you make a first action : Backend Call to a get user Data with the current 'authToken App State' and i don't understand how your api call work * How can you know if the authToken is still valid or not ?

    • @danielhabibi
      @danielhabibi Год назад

      I actually changed the way I set up the homepage flow and will record a new video on it soon. The purpose of the Get User Data call is to know if the Xano authToken is still valid using the conditional (200 means it's still good). If it isn't, then make the Firebase Auth call again and reupdate the appstate with the new token (the same way we do on the login button). This way the user doesn't have to log back in since the Firebase Authentication refreshes on its own (the JWT will always be valid AFAIK, still not sure about the Firebase JWT TTL). The only difference is that we will use "rebuild current page" so it refreshes the homepage calls with the new valid Xano authToken.

    • @katnissapp
      @katnissapp Год назад

      Ok i understand the logic ! so is that what you do @@danielhabibi : ruclips.net/video/mShwpzv4bj0/видео.html

  • @katnissapp
    @katnissapp Год назад

    Hey daniel, can you show us the backend api call you made in flutterflow please, thanks a lot for this tuto!

    • @danielhabibi
      @danielhabibi Год назад

      Hey, my pleasure! are you talking about the call "Firebase Auth" shown at 1:00? It's just a post call with an id_token variable (string). Make sure to add the variable to the JSON body. If you're still having trouble, let me know and I'll try to help!

    • @katnissapp
      @katnissapp Год назад

      thanks !! I made it@@danielhabibi

  • @nocodeable
    @nocodeable Год назад

    Would love to see your custom function for generating the list of lat/lng values for the markers. I have an Algolia search via an api call where I return results and am trying to pull the values from the json results into the lat/lngs wanted by the Google Maps Widget.

    • @danielhabibi
      @danielhabibi Год назад

      For sure! It's posted in my discord server with instructions because I accidentally hard-coded the path name. Anyway, here's an invite discord.gg/ZGrM38pF

  • @stevenyliu
    @stevenyliu Год назад

    Hi Daniel, I'm facing the same issue however for expecting double but receiving dynamic. For your argument, how were you able to define jsonList as dynamic? I don't see any option for type dynamic.

    • @danielhabibi
      @danielhabibi Год назад

      Hey Steven! Everything set as JSON Type will show up as dynamic. In the custom code I show, jsonList is set to Type JSON and List is checked/enabled. I actually got a notification for your message on github and think you're right, might be the same bug for double as it was with int!

    • @stevenyliu
      @stevenyliu Год назад

      @@danielhabibi ah thank you! this definitely worked! I feel futterflow has a lot of issue interpreting JSON value type.

    • @danielhabibi
      @danielhabibi Год назад

      @@stevenyliu Awesome! Yeah it has quite a few issues with parsing JSON. Now that more people are using it and reporting bugs, it should be getting much better!

  • @salincorp
    @salincorp Год назад

    Hello, thank you very much for your publications, they are excellent, I would like to have access to Discord, but I can not send you messages on Twitter because I am not verified, is there any other way to get access, thanks....

    • @danielhabibi
      @danielhabibi Год назад

      My pleasure! Sorry you couldn't DM me on Twitter, I'll have to fix that. Here's an invite: discord.gg/2JGGWqqV

    • @salincorp
      @salincorp Год назад

      @@danielhabibi thank you very much, this is a great help. 😃😃

  • @bruhhhhh718
    @bruhhhhh718 Год назад

    hey man i applied to y combinator with my idea and wanted to get your thoughts on if you think flutterflow would be a good place to build it

  • @solvsmart6278
    @solvsmart6278 Год назад

    How to get Discord access?

    • @danielhabibi
      @danielhabibi Год назад

      DM me on Twitter or on the FlutterFlow Forums!

  • @younessegi1094
    @younessegi1094 Год назад

    Wow... I'm looking for this function for a while and you seem to have it done but impossible for me to clone what you've done, i'm too novice. Do you think it is possible to create the same function with Firebase?

    • @danielhabibi
      @danielhabibi Год назад

      Yes, it's definitely possible. Look up James NoCode on RUclips. I think he has a video on how to do it with Firebase.

  • @chuckles1980
    @chuckles1980 Год назад

    Great stuff! Avoiding 401 makes sense and I didn't consider that.

  • @kytyzovv
    @kytyzovv Год назад

    Thanks, man! Very helpful!

  • @kytyzovv
    @kytyzovv Год назад

    Hi! Nice job! Can you make a video about frontend (FF) part?

    • @danielhabibi
      @danielhabibi Год назад

      Thanks for the comment! I think there are other front-end videos, but I will make one since my approach seems a lot different than the rest. Anything in particular you would like me to focus on?

    • @kytyzovv
      @kytyzovv Год назад

      @@danielhabibi very interesting how you made disabled buttons and selection on click. Some chains of actions?