로그인 하면 hidden class 를 추가함으로써 CSS 에서 숨겨주고, 인사문을 건넨다.
인사문도 처음엔 가려져 있고, 로그인 하면 나온다.

<body>
  <form id="login-form">
    <input 
      required
      maxlength="15"
      type="text" 
      placeholder="what is your name?" />
    <button>Log In</button>
  </form>
  <h1 id="greeting" class="hidden"></h1>
</body>
// app.js
const loginForm = document.querySelector("#login-form");
const loginInput = document.querySelector("#login-form input");
const greeting = document.querySelector("#greeting");

const HIDDEN_CLASSNAME = "hidden";

function onLoginSubmit(event) {
  event.preventDefault();
  const username = loginInput.value;
  loginForm.classList.add(HIDDEN_CLASSNAME);
  greeting.innerText = `Hello ${username}`;
  greeting.classList.remove(HIDDEN_CLASSNAME)
}

loginForm.addEventListener("submit", onLoginSubmit)