Login Authentication Tutorial in React Native using AsyncStorage | useReducer, useContext, useMemo

Подписаться 42 тыс.

Просмотров 194 тыс.

50% 1

In this tutorial, you'll learn how to implement login authentication in react navigation v5 for react native app. I have used AsycStorage, useReducer hook and context API to implement global state management for our authentication.
GitHub repo for this complete project bit.ly/3dZfb7U
React Navigation v5 Tutorial Series • React Navigation 5 Tut...
If you found my tutorials helpful, you can buy me a coffee from this link paypal.me/itzpradip
Follow me on GitHub github.com/itzpradip
Subscribe to my Channel bit.ly/2PaUqOk
For more tutorials on WordPress, React JS, React Native and Digital Marketing visit: www.pradipdebnath.com/blog/

Опубликовано:

22 апр 2020

Ссылка:

Скачать:

Готовим ссылку...

Добавить в:

Мой плейлист

Посмотреть позже

Комментарии : 249

@adamfrank9400 3 года назад

What I like most about this video is that you took it in two steps, so that allows me and my team to understand the context api first and THEN the reducer, which IMO are two separate and equally difficult concepts to understand. Thanks!

@BrunoCarvalhomCTM 4 года назад

Thank you for the tutorial, it was very helpful, even the way that it is presented: you dont just throw codes on our faces, you took the care to explain what each function does and how to use them. Greetings from Brazil!

@itzpradip 4 года назад

Glad it was helpful!

@LoFiRadio-tp5tj 2 года назад

Man, thank you!!! You just save my life! I spend about a day read articles, but all of the articles about auth is is not explaining what's happening in details, but with your video I make it just for the 1 our! THAAAAAANX A LOOOOOT!!!!

@Yahookudi 4 года назад

Thank you for your effort. You did a great job and by far, the best and most simplistic tutorial on the internet for this topic!

@itzpradip 4 года назад

Wow, thanks!

@keld7151 3 года назад

Wonderful tutorial, i'm so glad i found your video. I've been struggling for hours, and you're literally the only one that made it simple! Thank you so much !!

@nikhilemmanuelmusic 3 года назад

This is the simplest tutorial I found so far. Great job. Thanks a ton.

@unknownman1 4 года назад

Just discovered your channel and I must admit your videos are great. Thanks

@4You190 2 года назад

You are the legend of ReactNative thank you for your effort and the way how you explain and simplify it. 👍🏼

@hypersudo8092 4 года назад

He covered almost everything in react-navigation version 5. I highly recommend this video for development. lots of learning from it. Thank you so much. Looking more tutorials from you.

@itzpradip 4 года назад

Thanks for your comment & support.

@hypersudo8092 4 года назад

@@itzpradip How can I implement this auth flow with redux??

@TheSHQNKS 3 года назад

I really love your tutorials man. You help me so much as I am a web developper and I'm developping my first ever mobile app thanks to you.

@jesuserwinsuarez65 2 года назад

I've been searching the authentication tutorial of react native and this video is the solution! keep up the good work man!

@neerajsaxena8108 4 года назад

This is by far one of the best tutorials for authentication flow using v5. Amazing work. Keep it up

@itzpradip 4 года назад

Wow, thanks!

@rajatgoyal8162 4 года назад

@@itzpradip Hey Bro, your videos are really awesome and you explained each and everything in a very easy way, can you please extend this tutorial and connect this app with firebase (for Authentication and all) please

@chaudharypraveen98 3 года назад

Thank you so much. You saved me. I searched a lot but unable to find a good resource for beginner learning auth.

@LADodgerBlue 4 года назад

I have watched many videos on this topic and yours is the most succinct. Thank you!

@itzpradip 4 года назад

Wow, thank you!

@chandikalakshan468 2 года назад

This still useful for me in 2022. Well organised content that I can absorb easily.

@vigneshlokeshbabu1686 2 года назад

Sir, this is something that I exactly wanted. This is literally saving my life. Thank you so so much.

@ajmalhasan9759 4 года назад

Sir thank you very much, I am professional react native developer but watching your tutorial for getting knowledge about new RN features. I must say u explained and mentioned everything latest. Thanks again for your great playlist :)

@itzpradip 4 года назад

Glad to hear that

@jidnyeshaj9219 3 года назад

Cant thank you enough. Thanks man for such a clean explaination

@chiderapaulugwuanyi9843 4 года назад

Thank you so much for this. It really helped to clarify things for me in react Navigation v5.

@itzpradip 4 года назад

Glad it helped!

@thanhtrungvu8895 3 года назад

Thank you so much! This is what i'm looking for and my code worked!!

@girishparate6410 3 года назад

This playlist is amazing.

@NickKubde 3 года назад

Really again Lucky to have you for this tutorial

@grkraogajini6027 4 года назад

Nice concept explaining us, thank you . And we need more tutorials from you

@itzpradip 4 года назад

Thanks, keep supporting for more tutorials like this.

@kevink263 2 года назад

thank you! from Vietnam with love

@FabianD1991 2 года назад

Thank you so much !! great tutorial.

@techcodification2815 3 года назад

That was a great tutorial my friend , thanks for the knowledge

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

3 years later still saved my ass thank you so much

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

I'm glad that it helped you. 😀

@vishoodicooray2389 3 года назад

Thank you very much. I learned a lot of things from this video list

@sandupaegodage8163 3 года назад

you are awesome. I learned a lot. Reaally informative keep up the good work much love from Sri Lanka

@ajayb8730 2 года назад

Very Very useful video bro! Keep Going ... I'll give my full support !

@jaysolanki593 2 года назад

You are awesome.... Saved my heap of days.

@preetikasingh6611 2 года назад

Awesome Learning. Thank you so much for this gift !! Greetings !!

@chukwuemekaedeh30 3 года назад

Thank you very much sir. I must confess that your tutorials has really helped me in many projects and i can't thank you enough. Keep the good work going. Meanwhile, on your login tutorials, i would like you to add more details like, how to accept custom fields from the registration page. I want to learn how to collect users country and display name and add them to the firebase console. Please make tutotrial on this.

@deepanshmakkar5118 4 года назад

Thanks a lot Sir! Your tutorials are helping me a lot!!

@itzpradip 4 года назад

Glad to hear that

@paulochaves3612 4 года назад

Great content! Lots of learning from it. Thank you

@itzpradip 4 года назад

Glad to hear it!

@jaydeepdas9326 4 года назад

thinks from making this video...I will gain lot of knowledge.. from ur video

@reycerio7465 Год назад

Thank you Pradip.

@hassanforever11 4 года назад

Find it very useful, Thankyou keep up the good work :)

@itzpradip 4 года назад

Glad to hear that!

@alexandr999kulpanov 2 года назад

Thank you so much for the work you have done!💪👍 Your videos are very helpful and informative! Greetings from Ukraine!

@meven90 3 года назад

Thanks , i follow step by step and manage to use jwt token in my react native app ... cheers

@44roel44 4 года назад

Subscribed! Thank you for this!

@itzpradip 4 года назад

Thanks for the sub!

@manojgp1991 3 года назад

Awesome login authentication sir, This video help me to implement my first app login and auth. Thanks sir

@alimodz6253 4 года назад

I love the app design man!

@itzpradip 4 года назад

Glad you like it!

@codewithmesfin 3 года назад

Thank you, very helpful tutorial.

@jiamingtan9756 3 года назад

Your tutorial is really useful, thank you so much

@Ali-jg1ut 3 года назад

hey im getting error after this step 18:30 and error is "can't find variable: userName" help pls?

@amonperes1755 4 года назад

You're awesome, bro! Very usefull tutorial!!

@itzpradip 4 года назад

Glad it was helpful!

@artwellnjanji Год назад

best tutorial ever

@ATageH 3 года назад

great tutorial, thanks for sharing!

@shaurtv2856 3 года назад

Thank you, We learned a lot

@robertocandales08 4 года назад

Excellent video, thank you very much for sharing your knowledge

@itzpradip 4 года назад

My pleasure!

@anirudhmishra3453 4 года назад

Awesome Bro .. You clear my doubt Thanks

@itzpradip 4 года назад

Glad to hear that

@cristianecheverria3995 4 года назад

This Playlist is pure GOLD!

@itzpradip 4 года назад

WOW! thanks for your appreciation.

@rushclintakam7621 2 года назад

Very nice tutorial 😍

@melihozgor7927 4 года назад

Excellent job bro,Your videos are very helpful,im waiting for new videos.

@itzpradip 4 года назад

Glad to hear that

@jagdish_2326 4 года назад

you are too good for teaching concepts.

@itzpradip 4 года назад

Glad you think so!

@eeek4368 3 года назад

Thank you for your effort!

@itzpradip 3 года назад

My pleasure!

@arypratama3471 4 года назад

Great content, thank you very much... you are amazing

@itzpradip 4 года назад

Glad to hear that! Thanks

@aminefekih8830 4 года назад

thanks for this video, how can i test on my machine? should i install "NPM install" after "react-native run-android".

@immanueldiaz5710 4 года назад

Hey bro i have a question, the "React context" it's similar if you use redux? you can have a data persisting ?

@zakirbangash3185 2 года назад

appreciated Man

@wasilislam6663 2 года назад

Thanks man

@baselqhawiesh3660 3 года назад

thanks so much for these tutorials , helped alot , i have a question , i working on a project but iam using SQL instead of AsycStorage , meaning my user details will be saved in sql tables so do i need to use all those useEffect+useReducer+useMemo ,etc...??? hoping you can answer me soon , THANKS

@oscarparedez1417 3 года назад

Hi Pradip. I have a question for you: After a user logging in, how can i set the drawer menu's username to be the one captured by the authContext?

@leolynn89 2 года назад

Great tutorial, there is just one thing missing: how do you handle signup/signin errors that would occur in the backend and show them to the user with the given structure of code ? I can't find a way to pass the errorMessage in the loginState down to the signup or signin screen.

@AhsanAli-gg7tk 3 года назад

Nice teaching Sir, I g through all the tutorials of mosh but can't implement the authentication, now I implemented the authentication working fine, Also If you do some code into different files it will understandable good

@exlntsoftwarellc4287 3 года назад

@Pradip Debnath - Great tutorial. I watched the whole series and you explained it really well. I followed and implemented all of your code until video #7 in the series. After that I added in my firebase authentication code. In the SignIn screen on the button click I call my firebase login method. Soon as I implemented that code, I keep getting this error: "Error: Rendered fewer hooks than expected. This may be caused by an accidental early return statement. " Any ideas on how to resolve this error?

@HelianGamePiano 2 года назад

Thank you, please allow me to note for my works ! 8:37 - Sign out in DRAWER screen. 19:35 - Async. 20:51 - explanation.

@matthewwillis2201 2 года назад

This was fantastic. What theme/font/style are you using for VScode - I like it a lot!

@guessousghassan5087 3 года назад

Thanks for the effort (y)

@Ali-jg1ut 3 года назад

MANNNNNNNNN you are great...

@souradeepmajumdar4167 3 года назад

you are awsome!!!!!!

@rudraItSolutions2299 3 года назад

Can explain me how can I use redux store in my app after login using react navigation 5 with authcontext and there is possibility I can use authcontext in different module and import to app.js file I confuse how can I manage all auth and main app store in app thank you for your help.

@prabhashswain1878 4 года назад

you r d best !!!!

@albnayem8652 3 года назад

Thanks!

@tusharraj9785 3 года назад

Thank you love from india.... :)

@Rifzulzul 3 года назад

great explanation bro 👍👍

@orgiel1203 3 года назад

Thank you, excellent job! You have any repository?

@cloudtechyy 3 года назад

Thanks a lot

@canismajor1392 3 года назад

Thanks, great tutorial. But how can I use that state (e.g. userName) in other components?

@jensysantana8663 3 года назад

Hola, tengo una pregunta. Quiero hacer una app tipo eBay y pienso que usar sockets podría ser bien. Pero aún no me queda claro de cómo integrarlo con redux en proyectos grandes por cuestión de performance. Podrías darme alguna idea o bien si tienes Algún código que me pueda ayudar a entenderlo mejor. Gracias.

@ahsanhussain5161 3 года назад

Hi Pradeep, I am trying to run your code but I am getting this error: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: undefined. You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports. Check the render method of App. Also my react version is 16.13.1 as opposed to your 16.9.0

@hestiaproject2942 3 года назад

can you explain why you are using react memo for the object that will be pass as context?

@TadeuMelembe 3 года назад

Helpful

@huandreydesouzapontes9218 3 года назад

Thank you

@iraisaguirrevalente677 3 года назад

Hello, i was doing the same steps has you but i have an error when i compile, in App.js in the useEffect i have an error that says "warning: can't perform a react state update on an unmounted component. this is a no-op, but it indicates a memory leak in your application. to fix, cancel all subscriptions and asynchronous tasks in %s.%s, a useeffect cleanup function" i try to fix this error with clearTimeOut but this method dont fix the error, i would be great if you can help me

@ReactSinghCoder 3 года назад

thank you so much sir

@mln4you 3 года назад

Am i missing something, when u reload an app, how do u get username info if u didn’ t save it to storage ?

@stefanirimia5758 3 года назад

when i create more screens in the app, how do i keep the bottom tab navigator visible? Thank you in advanced.

@angelgabrielhernandezherna3861 3 года назад

thanks for all bro, it worths , i just have a question... i have already made the first 10:23 minutes and then i tried to do it on my own, so ,do you think that i would have a trouble in the future without the another part of the code of the video?, thanks bro

@sanjaykymardas941 4 года назад

Great One ..I like the way of you explaining.

@itzpradip 4 года назад

Thanks for liking

@ManishAtri 4 года назад

You are doing great job. Please add google and Facebook auth in the series :)

@itzpradip 4 года назад

I'll do it soon.

@loveallu 4 года назад

What about andorid in android icons and ui alignment not good can u run and explain parallel

@amirnazir2998 2 года назад

I have follwed the same step but i got an errors that is "TypeError: undefined is not an object (evaluating 'loginState.isLoading')"?

@AkshitSylvester 4 года назад

Hi pradip can you please demonstrate with backend data base authentication for user and token to update global state from mongo db

@anujbidkar7512 3 года назад

@react-native-community/async-storage is deprecated ? what to use

@rajanayel7447 3 года назад

Sir could you please tell me how I can implement firebase with this GUI?

@nkeirukawhenu4600 Год назад

What do we do for the SignUp action?

@MonkeyCantClap 3 года назад

Awsome! Am I allowed to use this source code and modify for my app?

@Vihansh0810 4 года назад

Hi Pradip, your explanations is very nice. Can you please clarify the below issue. How to show username and password globally using useContext without asyncStorage in home.js?

@ankitjaishwal2165 3 года назад

You are doing great but Please make a video to elaborate what if i use Firebase for Authentication. I have done the Authentication using firebase but i'm not able to navigate to homescreen after authentication, since i don't have Authentication token in case of firebase.