About a year ago, I was working on a project that incorporated the beautiful fullPage.js library. It was the first time thinking about Single Page Applications, and it was a good first exposure. fullPage allows you to change the url endpoint in the browser window depending on how you navigated the page. Transitioning to the third slide on the page, for instance, might activate a setting that would change the url to match, something like: example.com/#third-slide. I thought that was pretty cool.
Now that I'm working with React, I can better understand the need for a library to handle the complex state that emerges from large SPAs. It's an understanding that clarifies questions and issues like the one I had in this post from Week 3 of Hack Reactor:
What's more, I'm not sure what I like about [Django] is directly comparable to what I find disorienting about React. I don't know React enough to say, and I may be comparing apples to french fries.
Or at least partially answers. I'm not sure how the client-side code changes the url. I'm also not sure how SPAs should be designed, or what makes it such a popular paradigm.
Two recent projects have made me think about SPAs: the Technical Assessment, and now my blog project.
The Technical Assessment had us working on an SPA-style blog. Flipping between the home page and a blog post was a matter of changing state, not navigating to a different url. It was pretty neat. I was inspired by that when starting the recent blog project.
I used a similar idea when setting up the early stages of the blog project, using the React Router library to manage the endpoints. It's a cool app. But I ran into issues when integrating the auto0-OpenID authentication system I chose.
Authentication is handled entirely server-side, but the Routes api allows you to navigate to different pages entirely on the client-side. So going to a auth-protected page wouldn't trigger to authentication process. I ended up refactoring, replacing the Routes <Link> tag with an anchor tag to go through the WWW and thus back to my server to take advantage of auth.
One thought that I have now is how may I use an API call to perform authentication without navigating away from the page. But the real answer lays, I think, in the Routes documentation. When troubleshooting some issues on redirection, I came across some examples demonstrating a Routes-friendly authentication procedure.
Many good lessons. And another example of the old adage that I'll phrase thusly: the more you learn, the less you know.
Top comments (0)