From the course: React: Cloud-Powered Apps with Firebase
Unlock the full course today
Join today to access over 22,600 courses taught by industry experts or purchase this course individually.
Solution: Authentication redirect
From the course: React: Cloud-Powered Apps with Firebase
Solution: Authentication redirect
(upbeat music) - [Instructor] Let's work together on the solution now. Our new component will look very similar to the ProfileRedirect Component. Let's go ahead and grab this entire code here. Let's create a new file, call it PrivateRoute.js. Let's paste this. Let's rename this to PrivateRoute. Let's get rid, of the contents of the render prop here. We have access to the Route props. And here, we can get access to the ID using props.match.params.id. If we have a user, and the user ID matches the Route param ID, then we can return the desired component. Otherwise, we can Redirect the user, to the login page. Heading over to App.js. we can replace this route component here with PrivateRoute. Let's head over to our application now. Let's refresh. I'm going to copy the URL, log out and then paste that URL. We can see that I'm redirected back to the login page. Let me go ahead and login. I'm going to…
Practice while you learn with exercise files
Download the files the instructor uses to teach the course. Follow along and learn by watching, listening and practicing.
Contents
-
-
-
-
Firebase Authentication setup3m 20s
-
Creating users6m 57s
-
(Locked)
Displaying current user7m 17s
-
(Locked)
Redirect user upon signup2m 30s
-
(Locked)
User logout3m 55s
-
(Locked)
User login4m 56s
-
(Locked)
Authenticated user redirect4m 38s
-
(Locked)
Challenge: Authentication redirect2m 30s
-
(Locked)
Solution: Authentication redirect2m 2s
-
-
-
-
-
-
-