Login UI using BLoC with Flutter | Day 21 -

แชร์
ฝัง
  • เผยแพร่เมื่อ 4 ธ.ค. 2024

ความคิดเห็น • 63

  • @orianatoubia681
    @orianatoubia681 ปีที่แล้ว +1

    One of the best tutorials I've seen on the topic. I can't thank you enough, I finally understood BLoC. Thank you so much!

  • @sebastiansoberon8470
    @sebastiansoberon8470 4 หลายเดือนก่อน

    Bro, you didn't know how useful this tutorial is. Thank you for your great work!!!!!!!!!!!!!!!

  • @PascualGaray-p3g
    @PascualGaray-p3g ปีที่แล้ว

    Awesome video Kilo Locuazo!

  • @atoli112
    @atoli112 3 ปีที่แล้ว

    Your tutorials is extremely great.
    I search example of bloc pattern
    so long long time then I found your tutorial!
    I love it!
    Very Thanks :)

  • @zonali2497
    @zonali2497 3 ปีที่แล้ว +2

    I love your tutorials! You explain everything very clearly and it's really easy to follow! Thank you for making those videos!!

  • @tranminhhaifet
    @tranminhhaifet 3 ปีที่แล้ว

    Your videos make magical things becomes real things but still magical, thank you

  • @sabinpoudel6969
    @sabinpoudel6969 11 หลายเดือนก่อน

    You earned by subscription !!!
    Nice tutorial

  • @nicennice
    @nicennice 2 ปีที่แล้ว

    Yep nice clean, clear tutorial. I am going to re-design my login bloc based on this.

  • @sonngo1400
    @sonngo1400 2 ปีที่แล้ว

    Thank you for this tutorial.

  • @mugume
    @mugume ปีที่แล้ว

    extremely useful tutorial. Thank you Kilo Loco ❤

  • @Sreenathsdas
    @Sreenathsdas 3 ปีที่แล้ว

    Such a great tutorial series. Great work dude 👍 and please don't stop at 30 days. Love to see more

  • @auliasabril1899
    @auliasabril1899 3 ปีที่แล้ว

    awesome man, great video, and great presentation, thank you

  • @diegotrujillo6284
    @diegotrujillo6284 3 ปีที่แล้ว

    Hey Kilo, ur A W E S O M E, keep on working with BLOC, you've made things a lot much easier to me since I'm suscribed to ur channel. Peace bro

  • @robinchauhan9065
    @robinchauhan9065 3 ปีที่แล้ว

    will be waiting for the next stream

  • @RedBeardRetroTech
    @RedBeardRetroTech 3 ปีที่แล้ว

    Thank you for the information, you explain things very nicely

  • @ahmedalial-selmy895
    @ahmedalial-selmy895 3 ปีที่แล้ว

    Nice done man 😊

  • @kd8039
    @kd8039 3 ปีที่แล้ว

    Thanks a lot ,Really really very nice video.

  • @mhaciyev6809
    @mhaciyev6809 3 ปีที่แล้ว

    Thank your for this video 👍

  • @hamzaibrahim895
    @hamzaibrahim895 3 ปีที่แล้ว

    Thanks man!
    you solve my problem.

  • @raneemyad3181
    @raneemyad3181 2 ปีที่แล้ว +23

    Hello Kilo, thank you for wonderful tutorial. it's really useful. However flutter_bloc package has changed and there is no more "mapEventToState" function and we should replace the whole function with this
    Future _onEvent(LoginEvent event, Emitter emit) async {
    if (event is LoginUsernameChanged) {
    emit(state.copyWith(username: event.username));
    }
    // password update
    else if (event is LoginPasswordChanged) {
    emit(state.copyWith(password: event.password));
    }
    //form submitted
    else if (event is LoginSubmitted) {
    emit(state.copyWith(formStatus: FormSubmitting()));
    try {
    await authRepo.login();
    emit(state.copyWith(formStatus: SubmissionSuccess()));
    } catch (e) {
    emit(state.copyWith(formStatus: SubmissionFailed(e.toString())));
    }
    }
    }
    and constructor must changed to this :
    LoginBloc({required this.authRepo})
    : super(LoginState()) {
    on(_onEvent);
    }
    I hope this will save the time of new learner.

    • @ayeshariantegally342
      @ayeshariantegally342 2 ปีที่แล้ว

      Thanks! I'm getting an error that the username and the password are null on submit, could it be because of what I've done:
      final AuthRepository? authRepo;
      LoginBloc(this.authRepo) : super(LoginState()) {
      // Username updated
      on((event, emit) {
      print('LoginBloc Username');
      state.copyWith(username: event.username);
      });
      // Password update
      on((event, emit) {
      print('LoginBloc Password');
      emit(
      state.copyWith(password: event.password),
      );
      });
      on((event, emit) async {
      print('LoginBloc LoginSubmitted');
      emit(
      state.copyWith(formStatus: FormSubmitting()),
      );
      try {
      await authRepo!.login();
      print("TRY LOGGING IN");
      state.copyWith(formStatus: SubmissionSuccess());
      } catch (e) {
      state.copyWith(formStatus: SubmissionFailed(e));
      }
      });
      }

    • @ayeshariantegally342
      @ayeshariantegally342 2 ปีที่แล้ว

      I actually, either way, on submission, the username and password is still null
      I/flutter ( 5549): LoginState: null, null, Instance of 'FormSubmitting'
      I/flutter ( 5549): REPO attempting login
      I/flutter ( 5549): error Null check operator used on a null value
      I/flutter ( 5549): LoginState: null, null, Instance of 'SubmissionSuccess'

    • @user-py5lm6ip8y
      @user-py5lm6ip8y 2 ปีที่แล้ว +3

      Thanks Friend, I was losing my mind. Really helped

    • @Nithin.Raaj.J
      @Nithin.Raaj.J 2 ปีที่แล้ว

      Thanks man , It was very usefull

    • @sutyi06
      @sutyi06 6 หลายเดือนก่อน

      This comment should be pinned. Absolute GOAT.

  • @buzztomi
    @buzztomi 2 ปีที่แล้ว +4

    Hi Kiko
    I Got error on yield state.copyWith(formStatus: SubmissionFailed(e));
    It said The argument type 'Object' can't be assigned to the parameter type 'Exception'.
    Can you help me ?

    • @ayeshariantegally342
      @ayeshariantegally342 2 ปีที่แล้ว +2

      had the same error, change the type of the argument to Object, instead of Exception :)

  • @AbhiMule404
    @AbhiMule404 3 ปีที่แล้ว +5

    Damn BLOC pattern needs a lots of code for a small functionality

  • @creativetech8471
    @creativetech8471 3 ปีที่แล้ว +5

    Gold, Thank you for sticking to bloc ( it is my best choice for state management)
    One Question: Why do we need to track username and password ? we can just make Event for LoginSuccess, LoginError , LoginLoading and then Authenticated, AuthLoading,Token, Unauthenticated, AuthError (auth bloc)..etc.... Equatable (must be used)

    • @AlexisLEGOFF
      @AlexisLEGOFF 3 ปีที่แล้ว

      I guess the reason is that he considers that the validators are business logic and then should be in the bloc. But I agree that this is a bit "too much" of UI / BL separation. My 2 cents.

    • @1080pixel
      @1080pixel 2 ปีที่แล้ว

      @@AlexisLEGOFF I'm totally with you. Especially the copy/paste of the State is a lot of boilerplate for very low reward. I'd just use a simple validation with setState in the Ui, considering the anyway low performance requirements for a login field.

  • @vinusubhash9106
    @vinusubhash9106 3 ปีที่แล้ว

    I missed Kilo in Swift but i found him in flutter again

  • @user-zd3jf7hb6e
    @user-zd3jf7hb6e 3 ปีที่แล้ว +1

    hey, It was a nice tutorial . but when the app throws the exception the state is not changing. This means when you try to change the state the snack bar reportedly showing.

  • @ObilanCenobi
    @ObilanCenobi 3 ปีที่แล้ว

    17:00, what is FormSubmitting()?

  • @nagaraj-ni2cj
    @nagaraj-ni2cj 2 ปีที่แล้ว

    A yielded value of type 'dynamic' must be assignable to 'LoginState'.

  • @名字不重要-v6u
    @名字不重要-v6u 11 หลายเดือนก่อน

    I wonder if I can just pass context to every field? so I don't need to use BlocBuilder to wrap every signal filed in the form

  • @DanaLinhartova146
    @DanaLinhartova146 3 ปีที่แล้ว +1

    great tutorial, but right now the validator is not working properly. but still thank you for excelent explanation of bloc

  • @brunofrancosentis5148
    @brunofrancosentis5148 2 ปีที่แล้ว

    thanks hope u can update this video!

  • @nebnotes5666
    @nebnotes5666 2 ปีที่แล้ว +1

    What had happen to my mind? Its simple and easy to do following you but as soon as I move on to my project, BOOM everything is gone and I remain nowhere.
    I think the way of my learning is bad. Can anyone teach me how you guys take the concepts from these kind of videos and create your own ?

  • @BigDoubleJoe
    @BigDoubleJoe 3 ปีที่แล้ว +1

    why are you using bloc instead of cubit for such a small use case? doesn't make bloc it more complex as needed?

  • @MuhammadAli-zv5vz
    @MuhammadAli-zv5vz 3 ปีที่แล้ว

    Nice video but sir I am stuck at Navigator 2.0 and bloc pattern , it's way too hard too learn I think now my journey stop at day 15 #30daysflutter . You are the best mentor I ever meet.😒😒😒

  • @nagaraj-ni2cj
    @nagaraj-ni2cj 2 ปีที่แล้ว

    The method 'copyWith' isn't defined for the type 'LoginState'.
    Try correcting the name to the name of an existing method, or defining a method named 'copyWith'.

  • @BrendenBishop
    @BrendenBishop 3 ปีที่แล้ว

    Awesome video, one question though. How does the login function get access to the values of the loginState to actually attempt to login to a server somewhere let's say? Because in the event type block where you call login you cannot access the username or password from that event type.

  • @mohamedmanas3055
    @mohamedmanas3055 3 ปีที่แล้ว

    Thanks for the video kilo! nice work!
    I have a question regarding the dispose method. Is it true that we don't have to call the dispose method for the blocs if we are using the flutter_bloc package? As Felix mentioned that the plugin takes care of disposing the blocs?

    • @jamircoen649
      @jamircoen649 3 ปีที่แล้ว

      You all probably dont care at all but does any of you know a trick to get back into an instagram account??
      I stupidly lost my login password. I would love any help you can give me

    • @giovanniryder4057
      @giovanniryder4057 3 ปีที่แล้ว

      @Jamir Coen instablaster ;)

    • @jamircoen649
      @jamircoen649 3 ปีที่แล้ว

      @Giovanni Ryder Thanks for your reply. I got to the site on google and I'm trying it out now.
      I see it takes a while so I will reply here later when my account password hopefully is recovered.

    • @jamircoen649
      @jamircoen649 3 ปีที่แล้ว

      @Giovanni Ryder it did the trick and I finally got access to my account again. Im so happy:D
      Thank you so much, you saved my ass !

    • @giovanniryder4057
      @giovanniryder4057 3 ปีที่แล้ว

      @Jamir Coen no problem =)

  • @calvinellis6493
    @calvinellis6493 3 ปีที่แล้ว

    Thanks Kilo!!! This is just in time! I was going through the flutter cubit example, but it used firebase. I want an authentication model that lets me manage how I will authenticate. This is a great start! I can't wait to see the continuation! Will there be a 'isLoggedIn' check for specific functionality?

  • @emmanuelthompson7827
    @emmanuelthompson7827 2 ปีที่แล้ว

    Thank Kilo for this tutorial.. I'm using flutter 3 and it seems mapEventToState isn't working.. the helper messages says I should use on.. however, any letter overrides the previous letter in a textFormField.. so I always end up with a single letter. How do I resolve this?

    • @ebrahimhassan2330
      @ebrahimhassan2330 2 ปีที่แล้ว

      the BLoC is updated .. you need to watch a tutorial for the new updates

  • @vianeyvargas7736
    @vianeyvargas7736 2 ปีที่แล้ว +1

    Saludos desde Colombia, excelente vídeo, puedes por favor hacer un vídeo utilizando flutter_bloc :8.0.0 Pattern Bloc y manejo de estados ?

  • @nagaraj-ni2cj
    @nagaraj-ni2cj 2 ปีที่แล้ว

    i was followed as you said but error occured

  • @darioaguilar2015
    @darioaguilar2015 2 ปีที่แล้ว

    How could you add a button that hides or shows the password?

  • @colocaps
    @colocaps 2 ปีที่แล้ว +1

    if someone has problems with the flutter_bloc, it has to be this version ^6.1.3

  • @nagaraj-ni2cj
    @nagaraj-ni2cj 2 ปีที่แล้ว

    could you please anyone help to solve this Error?

  • @kyleaustin2728
    @kyleaustin2728 3 ปีที่แล้ว

    why u always attack on first intro =D

  • @satnamsingh-qh2si
    @satnamsingh-qh2si 2 ปีที่แล้ว

    This look too much boilerplate code in comparison to Native Android Mvvm, Mvi patterns as there are only 2 input fields.. for example sake I am wondering how many classes will be need if we have 5-6 forms with almost 10 questions each with different type of input UI elements for answers. Too many questions I want to ask

  • @hc-ec6bm
    @hc-ec6bm 3 ปีที่แล้ว +1

    I push new page if state is SubmissionSuccesfull in BlocListener. When I go back to login page after navigation, every key stroke results with SubmissionSuccess state then it pushes me next page again while I only want to change username, password fields.

    • @WesFTK
      @WesFTK 3 ปีที่แล้ว

      in my case, i just yield the InitialFormStatus after SubmissionSuccess or Failed