July 20, 2020
One of my favorite tools to pull out when developing a new feature or solving a problem for a client is saving a state based on some action.
And you can do this by either saving some kind of referenced data in the database so that each time the page loads, it looks that to show content or not show content. Or show different content.
In my stack, I'm usually doing that with PHP. And it's pretty persistent. It's going to be there until you provide another way for the user (or you) to remove it.
But you can also use cookies. Cookies are cool because you can add a number of things to them to tell the browser what to do and have them expire.
Using a Database to Accomplish State
There are a number of reasons you need to do this sometimes.
When we first launched Hexater, we had a company create a large number of branded shirts to giveaway. For a time, every signup to the Hexater Club a person would have an option to be sent a free shirt!
There were a couple of points in the user journey where we offered this. They would see a page after checkout with a form to submit.
But if they didn't do that, there would be a small widget in the ‘my account' area that would remind them.
But that widget would ONLY show if they hadn't already filled out the form at checkout or they hadn't filled out the form at all.
They also had an option to opt-out and never see that widget again.
All of this was done by looking to the database. I had simply created a database table that held all the information from the form or from the opt-out. So before this widget or page displayed in the account area, it's check to see what state they were in.
Super simple to do; solid. The data can't be deleted by a browser. Pretty standard PHP form stuff.
Using Cookies to Establish State
The other option is using cookies. I actually use JS Cookie a lot. It's a great little script that gets the job done.
I'll give you a very recent, super basic example.
var dailyVisit = Cookies.get('client-website');
if (dailyVisit !== 'once-per-day') {
scene_video.on("enter", function () {
// CODE THAT CREATES SOME COOL EFFECT
Cookies.set('client-site', 'once-per-day', {
expires: 1
});
});
}
The problem I was trying to solve here is the client had a very unique, custom effect we had developed.. that occurs very quickly and only one time on the page.
However, we realized while we had it only showing once on the page (that script we were using handled that), if you left the page and used your back button, the effect would show again!
So my thought was, “use a cookie”. Now, when that effect fires for the first time, it'll never fire again because I have a conditional that checks that cookie exists.
And in this case it expires in a day. So if they come back a couple days from now, they'll be able to enjoy this effect again.
It's a unique case, but turned out really cool and delivers on what the client was looking for.
Knowledge is Power
There are other methods like PHP Sessions that can save data and state in various situations, but I personally use the two above most frequently (so far).
I feel like I have a super power now; and so will you if you didn't have these in your toolkit! Opportunities to use them will popup up from time to time.
Something I live by as a developer. It's not so much that you know how to do something, but you know that it's possible and can figure it out on the fly.
When a project lands on your desk and you are looking to solve a problem, just knowing these two options will open up new solutions for you.
I hope you find this interesting or enlightening!
Feel free to share your own experiences saving things to a database or using cookies in the comment section below!
Other Related Articles:
- The Art of Hiring: How to Attract and Select the Right Talent - March 19, 2023
- My NEW CONTENT FOCUS Hear on the ML Blog – Teams & Processes! - March 12, 2023
- Starting Solo and Building an Agency: Lessons Learned - February 22, 2023
