What I am trying to do is when someone navigates to my website, it will ask their name or simply have a generic and say "Not you, click here". Afterwards, in the corner it will display "Welcome back, [name]." However, this is a GitHub Pages website so I am not certain if this is possible, and it would have to simply leave out the name.
It does work to simply hardcode a name or have none at all, but without some sort of database or ability to store and retrieve credentials I don't know how I can achieve this.
All I have currently in the webpage is
<p style="text-align:right; color:gray"><i>Welcome back.</i></p>.
I was unable to find something similar to my question on Google, I'm not certain on how to word it besides keywords that don't quite get me where I'm going.
I don't believe that the website can write to the user's system without some sort of cookies, but I do not know much about storing data with them. I'm guessing I will need to take advantage of the HTML5 window.LocalStorage
but I am not sure how to implement it.
Essentially, is there a way to store someone's name in cookies, website cache, or somewhere not on the server end, as from what I can tell GitHub Pages is read-only.
As pointed out in comments, localstorage (or a cookie) is about the only way to do what you want without your own server or some external service.
This is by no means a permanent storage solution and you have no control over how the user manages their local storage, but here is a minimal example you could throw into an HTML file and open in your browser to test out.
<input id="local-input" onkeydown="store(this)">
<script>
// keep the contents of the input in local storage, called by input onkeydown
function store(e) {
localStorage.setItem('local', e.value)
}
// if previous storage exists, use it
if(localStorage.getItem('local') !== null) {
document.getElementById('local-input').value = localStorage.getItem('local')
}
</script>
Local storage is quite easy to use. Refer to online documentation for more examples and guidance: MDN Window.localStorage