Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

JavaScript React Authentication Implementing Basic Authentication Set Up Basic Authentication

Killeon Patterson
Killeon Patterson
18,527 Points

authentication error

Hello, I'm attempting to use the sign-in function on this app exercise. When I sign into the app it, displays the <h1>{authUser.name} is Authenticated</h1> and the <p>Your username is {authUser.username}</p>

as is expected. Although, when I refresh the browser I get the error Cannot read properties of null (reading 'name')

On line 6 on Authenticated.js. I've tried changing the useState initial value into an empty object; (unlike the video's code). When I do this the app no longer crashes, but stops showing the {authUser.name} and {authUser.username}.

I've console logged the info on the Authenticated page and it is just receiving that empty object. How can I get this function to work correctly after a refresh?

https://github.com/Kilosince/treehouse-auth/tree/main

1 Answer

Rohald van Merode
seal-mask
STAFF
.a{fill-rule:evenodd;}techdegree seal-36
Rohald van Merode
Treehouse Staff

Hey Killeon Patterson πŸ‘‹

That behavior is to be expected at this point of the course. When refreshing the page the authUser state declared in the userContext refreshes back to the initial value of null. In the final stage of the course Laura will explain how to setup cookies to persist the data of the currently signed in user.