😃 Today I Leaned
- 팀 소개 웹 페이지 _ 발표
- 웹 스토리지 (localStorage, sessionStorage)
팀 소개 웹 페이지 _ 발표 및 회고
한 주 동안 진행되었던 팀 소개 웹 페이지 제작 프로젝트가 마무리되었다!
오늘 발표와 피드백을 진행하고 회고를 작성하였다
회고를 작성하는 동안 이번주 팀원들과 회의하고 문제를 해결하였던 모습이 생각났고
flask를 이용한 서버와의 통신에 대해 자세히 배울 수 있었던 시간이었던 것 같다
다음 주부터는 새로운 팀원들과 Java 문법을 학습한다고 한다
아직 가야할 길이 멀지만 자신 있는 개발자로서 거듭날 수 있도록 앞으로 더욱 노력해야겠다!
웹 스토리지 (localStorage, sessionStorage)
참고 ) https://www.daleseo.com/js-web-storage/
다른 팀의 발표를 듣던 중 나와 다른 방식으로 팀원 별 상세페이지에 접속하는 것을 알게 되었다.
그 방식은 바로 localStorage였는데, 처음 들어보는 기술이라 공부해보려고 한다:)
웹 스토리지
- DB 서버나 클라우드 플랫폼에 데이터를 저장하지 않고
클라이언트 상, 즉 브라우저 상에 데이터를 저장할 수 있는 기술
localStorage vs sessionStorage
- 차이점 : 데이터가 어떤 범위 내에서 얼마나 오래 보존되느냐에 있음
- localStorage : 웹페이지의 세션이 끝나더라도 데이터가 지워지지 않음
- sessionStorage : 웹페이지의 세션이 끝날 때 저장된 데이터가 지워짐
오늘 중점적으로 알아볼 것은 localStorage입니다.
(sessionStorage를 사용할 때에는 localStorage를 sessionStorage로만 바꾸면 됨)
기본 API
- 기본적으로 키와 값으로 이루어진 데이터를 저장할 수 있음 (해시 테이블 자료 구조를 생각하면 됨)
// 키에 데이터 쓰기
localStorage.setItem("key", value);
// 키로 부터 데이터 읽기
localStorage.getItem("key");
// 키의 데이터 삭제
localStorage.removeItem("key");
// 모든 키의 데이터 삭제
localStorage.clear();
// 저장된 키/값 쌍의 개수
localStorage.length;
- window.localStorage를 사용해야 하지만, window 객체 속성을 이용해 localStorage로 줄여서 사용 가능
- 오직 문자형(String) 데이터 타입만을 지원
⭐알게 된 점⭐
웹 스토리지
서버에 데이터를 저장하지 않고 브라우저 상에 데이터를 저장해 가지고 올 수 있는 방법이 있다.
그것은 바로 웹 스토리지이다.
localStorage와 sessionStorage가 있고
세션이 끝나더라도 데이터를 저장하려면 localStorage를 사용해야 한다.
웹 스토리지는 오직 문자형 데이터만 사용할 수 있으므로 사용 시 유의해야 한다.
🐰 END
일주일간 진행되었던 프로젝트가 마무리가 되었다!
모든 팀원들이 너무나 잘해주어 힘들지 않게 마무리할 수 있었던 것 같다
앞으로 남은 수업과 프로젝트가 많은데
지치지 않고 열심히 수행해 좋은 결과를 만들어내야겠다
파이팅😆