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

Solution: Authentication redirect

From the course: React: Cloud-Powered Apps with Firebase

Start my 1-month free trial

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…

Contents