저장 버튼 없이 자동으로 서버와 싱크되는 편집기를 만들어보자!
API
API_END_POINT = https://kdt-frontend.programmers.co.kr 편집 가능한 글 목록 불러오기 : /posts 특정 게시글 불러오기 : /posts/{id} 게시글 저장하기 : [POST] /posts 게시글 수정하기 : [PUT] /posts/{id}
+) url 주소창에
/posts/new
입력 ⇒ 새 에디터 등장여기서 수정하면, 아이디 부여하고 포스트로 등록됨
- 에디터의 값을 로컬 스토리지에 저장하고, 특정 시간마다 로컬 값을 서버에 저장 하고 동시에 로컬을 비워내는 식으로 작업하기
⇒ 최신의 값을 서버에 저장하지 못했다면, 로컬스토리지에 있는 최신 값을 가져오도록 하기
⇒ 저장 시간으로 비교
- customeEvent를 dispatch해서 url 라우팅 처리
- 새글쓰기, 목록으로 버튼도
코드
- App ⇒ 페이지 두개를 렌더링
- PostList ⇒ 리스트를 렌더링
- PostsPage ⇒ 왼쪽 컨테이너 +) 리스트 패치해서 postlist에 데이터 넣어줌
- Editor ⇒ 에디터를 렌더링
- PostEditPage ⇒ 오른쪽 컨테이너 +) 에디터 값(타이틀, 내용)을 패치해서 Editor에 넣어줌
- title, content 상태 갖기
- 현 상태 + 저장 시간을 로컬스토리지에 저장하기