#8.0~8.2

Reset.js

const resetBtn = document.querySelector("#reset");
resetBtn.addEventListener("click",resetUserInfo);
function resetUserInfo() {
  localStorage.clear();
  location.reload();
}

window.addEventListener ("load", function() {
  document.body.style.visibility = 'visible';
});

login.js

const loginForm = document.querySelector("#login-form");
const loginInput = document.querySelector("#login-form input");
const greeting = document.querySelector("#greeting");
const link = document.querySelector("a");
const HIDDEN_CLASSNAME = "hidden";
const USERNAME_KEY = "username";

function onLoginSubmit(event){
    event.preventDefault();
    loginForm.classList.add(HIDDEN_CLASSNAME)
    const username = loginInput.value;
    localStorage.setItem(USERNAME_KEY, username);
    paintGreeting(username);
}

function paintGreeting(username) {
  greeting.innerText = `HELLO ${username} !`;
  greeting.classList.remove(HIDDEN_CLASSNAME);
}

const savedUserName = localStorage.getItem(USERNAME_KEY);

if(savedUserName === null){
  //There is no username in localstorage, show the form
  loginForm.classList.remove(HIDDEN_CLASSNAME);
  loginForm.addEventListener("submit", onLoginSubmit);
} else {
  // show the greeting, not show form
  paintGreeting(savedUserName);
}