React Native Login with JWT Auth Context

In this video, we'll explore how to add JSON Web Token (JWT) authentication to a React Native app in order to protect users' sensitive data. And how to use Expo's Secure Storage to manage your JWTs.

#############################

🤷‍♂️ Want more Ionic tutorials?

#############################

❤️ You can also find me on:

Or join the Simonics Facebook group:

#############################

00:00 Intro
00:46 Creating an Authentication Context
10:43 Secure your React Native App
15:00 Building the Login
18:10 Making authenticated API Requests
24:15 Outro

[galaxies_dev]

Join Galaxies.dev today - the Home of the Best React Native content🚀

[Jopu]

Hi!
Thank you for the video. You need to set autoCapitalize="none" inside the TextInput, so the simulator or real device does not capitalize the first character. And you don't have to type it in your Text editor and copy it :D

[comanmaryan]

Yeah, I suppose not enough revenue from ads, so let's add a subscription for the source code, not that I needed it personally, but would be great if you have mentioned that a subscription is necessary in order to get it.

[ricecodesdev]

Hey Simon, once the user is authenticated, is there any way of accessing their data in the app?

For example, I need to make a GET request and pass in the user's ID to get their data on the home page. Right now I can't make this call, because I have no way of passing any information (such as an id or a token) into the GET request on the homepage. Cheers

[diebeziehung]

i got render error: "look like ypo have nested a 'NavigationContainer' inside another...." someone known why?

[mpal]

I followed everything but I get NavigationContainer problem. Anyone experienced the same thing? I'd doesn't work in the end. AuthProvider is ok but the final app does not work.

[Nothwarren]

Far from perfect actually. There's no reconnect after JWT token expired but it's a good starting point :)

[Fybuh]

this video helped me greatly SImon, but i kept laughing so hard at that textfield making the first character uppercase 🤣, the password field is probably doing the same thing too (was)

[asihankhang]

every and each time watch your tutorial, you confused us as much as you did to your self. You are a good film maker then coding, don't promote your training pal

[MOGE_]

at the end you forgot to reverse your api url to 'https' and was instead trying http lol. not sure if you saw it after reviewing your video.

[nguyen-van-quang]

I follow you a long time ago, you're finally back to react-native? Maybe flutter in next time : ), flutter is better for mobile cross-platform now! But react-native is still the best choice for a web js developer.

[messylife]

@galaxies_dev awesome tut!
Curious what version of react-native and typescript did you run for this proj?
I am getting an error from your Login.tsx - line:21 - when clicking login
TypeError: onLogin is not a function (it is undefined)

same goes for the register block. Would appreciate your guidance brotha!

[quemasps]

The error occurred because the "authentication" header was not deleted, in logout() method.
delete

[jduffy]

I have something similar but what I’m trying to work out is how to handle when that token expires? Do I need to implement refresh tokens or how do I sign the user out once it expires?

[arjunsharma-]

what happens, whe the token gets expired, and it is still there in secure storage, the home page request to API will fail right? What is the better way to handle it.

[WhiteRickRoss]

Waiting for Expo router and JWT videoo

[ivanbatanov]

Great video!

How would you deal with refresh tokens when the JWT Token expires after some time for example.

[tomodiero]

Putting out content without the code accessible without paying is frustrating. Just make it paid content and then people will buy without feeling tricked or cornered.

[abdielabbadsudiro]

Many thanks dude. You save my time a lot for my first React Native project with this!

[janspoerer]

Would you recommend using one of the provider-specific libraries for login, or would you prefer this more generic approach that is shown in the video? I will probably anyway use a SaaS/backend-as-a-service such as Firebase, so probably the Firebase login library would be best?