[html] 스토리지 관리

HTML5에서는 로컬 스토리지세션 스토리지를 사용하여 브라우저에 데이터를 저장할 수 있습니다. 이러한 스토리지 옵션은 웹 애플리케이션을 개발하는 데 유용하며, 사용자 정보, 설정, 상태 등을 클라이언트 측에서 유지하는 데 활용됩니다.

로컬 스토리지

로컬 스토리지는 브라우저에 영구적으로 데이터를 저장하는 데 사용됩니다. JavaScript 코드를 사용하여 데이터를 저장하고, 나중에 사용자가 동일한 웹 페이지를 다시 방문해도 데이터가 그대로 유지됩니다.

로컬 스토리지에 데이터를 저장하는 예제 코드는 다음과 같습니다.

// 데이터 저장
localStorage.setItem('username', 'john_doe');

// 데이터 불러오기
const username = localStorage.getItem('username');

세션 스토리지

세션 스토리지는 브라우저 세션 동안에만 데이터를 저장하는 데 사용됩니다. 사용자가 웹 페이지를 닫거나 브라우저를 종료하면 세션 스토리지에 저장된 데이터가 삭제됩니다. 세션 스토리지를 사용하는 방법은 로컬 스토리지와 유사합니다.

세션 스토리지에 데이터를 저장하는 예제 코드는 다음과 같습니다.

// 데이터 저장
sessionStorage.setItem('language', 'korean');

// 데이터 불러오기
const language = sessionStorage.getItem('language');

스토리지 옵션을 사용하여 데이터를 관리하면 사용자 경험을 향상시키고, 웹 애플리케이션의 기능을 확장할 수 있습니다.

참고 자료


태그, 로컬 스토리지, 세션 스토리지, JavaScript, 데이터 관리, HTML5