fetch to my
SessionsController every single time.
The process of sending a
fetch every time I needed to check who was logged in and then sending another
fetch from the
response of the first
fetch to actually do what I needed to do didn’t seem very effective to me. This isn’t a huge issue in the grand scheme of things, however it got to be a bit tedious. My brain went down the rabbit hole of trying to learn how to use session cookies that are stored in your browser.
Unfortunately all of the documentation I found involved installing some type of middleware into my application that, probably because of a user error on my end, never worked properly for me. After a few hours of trying to get this to work I felt that I was stuck in the same place for too long, I decided that there had to be an easier way for me to store my logged in users
sessionStorage. According to W3, ‘The … sessionStorage properties allow [you] to save key/value pairs in a web browser.’ This was the golden ticket I needed, and I’m going to explain to you how I used
sessionStorage in my application.
Having had my
user model set up, and the form for
user login/signup built, my issue kept arising when I would reload the page to reset my DOM. Each time the DOM would load my application would have no knowledge of the user that I had signed in or created before the reload. As a regular user of any website, my vision was that unless a user logged out explicitly, the session should persist. This isn’t a universal rule, however most websites (Amazon, Twitter, GitHub) don’t log a
user out when the
user closes or reloads the webpage, and if they did it would be a little annoying. The problem as I saw it was that my frontend needed to recognize that there was a
user logged in. This is what
sessionStorage was built for. Implementing this was simple; when a
user successfully logged in, set the
id of the
user to the key
:user-id inside of the
fetch sent when
user is signed in
This set a key/value pair to persist throughout my application as is unless explicitly set to something else or reset. Anywhere in my application at any point during my session,
sessionStorage.user_id will return my current
:user_id. This is useful for several reasons. For starters, now when I load my DOM, I can set a conditional to check the
With the rapid development in technology, the old ways to do business have changed completely. A lot more advanced and developed ways are ...
You name the business and I will tell you how web development can help you promote your business. If it is a startup or you seeking some...
Top 10 Web Development Trends in 2020 will provide you with a detailed list of the trends which are currently being noticed. Upskilling to these trends will help you in landing onto better jobs in 2020-2021.