[리팩토링] 로컬 스토리지

🎈 로컬 스토리지(Local Storage)

• 로컬 스토리지는 HTML5에서 추가된 저장소
• 키-밸류 스토리지의 형태, 쉽게 말해 브라우저 상의 데이터베이스
• 사용자가 직접 지우지 않는이상 절대 지워지지 않음
• URL을 기준으로 저장되기 때문에 웹페이지 주소가 다른 곳에서는 정보가 저장되어 있지 않음

📝과제 : https://bighuni.github.io/JS-Study/Assignment/1회차

[회고]

• 1회차 과제인 로컬 스토리지를 활용하여 간단한 메모장을 만들었었는데, 한 가지 메모 내용만 저장하고, 화면 전환 없이 바로 해당 메모를 삭제할 수 있는 기능 등을 보완하기 위해 html, css & js 전반적인 코드를 다시 뜯어내고 getItem과 setItem, JSON의 stringify로 값이나 객체를 문자열로 변환하고, liMaker()함수를 호출하여 li 엘리먼트에 텍스트 값을 넣어 Item 목록인 ul을 추가할 것

• 기입할 내용을 저장할 수 있도록 저장하기 버튼을 누르면 메모 내용이 아래 리스트처럼 나열될 수 있도록 의도하기

• 초기화 버튼을 누르면 기존에 기입한 메모들 삭제 기능 추가하기

[UI]