Vue.js로 todolist 만들기 - 로컬 스토리지

Yuri Lee·2020년 9월 23일
0
post-thumbnail

todolist 살펴보기

간단하면서도 반드시 알아야 할 컴포넌트 구조화와 컴포넌트 통신을 구현해볼 수 있음.


추가된 할일 텍스트 데이터는 브라우저 저장소인 로컬 스토리지에 저장된다. 브라우저 저장소를 사용하면 서버와 db를 별도로 구성하지 않고도 간단하게 js 한줄로 data를 저장하고 삭제할 수 있다.

브라우저 저장소의 종류

  • 로컬스토리지(local storage)
  • 세션 스토리지(session storage)
  • 인덱스드 디비(indexedDB)

vue CLI를 이용한 프로젝트 생성
vue init webpack-simple vue-todo

프로젝트 초기 설정

<meta name="viewport" content="width=device-width, initial-scale=1.0">

width=device-width: 기기의 너비만큼 웹 페이지의 너비를 지정
initial-scale: 페이지의 배율로 페이지가 로딩되었을 때 줌 레벨을 의미


[Reference]

Do it Vue.js 입문(이지스퍼블리싱)

profile
Step by step goes a long way ✨

0개의 댓글