User 정보 저장하기

const loginForm = document.querySelector("#login-form");
const loginInput = document.querySelector("#login-form input");
const greeting = document.querySelector("#greeting");

const HIDDEN_CLASSNAME = "hidden"; 
//일반적으로 string만 포함된 변수는 대문자로 표기학 string을 저장하고 싶을 때 사용

function onLoginSubmit(event){
    event.preventDefault(); //브라우저가 기본동작을 실행하지 못하게 막음
    loginForm.classList.add(HIDDEN_CLASSNAME);
    const username = loginInput.value;
    localStorage.setItem("username", username) //localStorage.setItem(key, value) 
    greeting.innerText = `${username}님 환영합니다.`;
    greeting.classList.remove(HIDDEN_CLASSNAME);
} 


loginForm.addEventListener("submit", onLoginSubmit);

• Local Storage 브라우저에 무언가를 저장한 후 나중에 가져 올 수 있음.
  - 저장하기: localStorage.setItem("key", "value");
  - 저장한 storage가져오기: localStorage.getItem("key");
  - storage지우기: localStorage.removeItem("key");
  

이 글은 패스트캠퍼스 노마드코더 '바닐라 JS로 크롬 앱 만들기'을 수강하며 정리한 노트입니다.
https://nomadcoders.co/javascript-for-beginners/lobby