3줄 요약
1. cookie vs localstorage
2. cookie vs session
3. Optional chaining
잘하는 팀들의 PPT를 찾아보니 색다롭고 흥미로워서 찾아보게 되었고, 그팀의 기술에 대해 공부해보았다. 잘하는 사람들의 기술을 배우는 것은 중요하다
https://velog.io/@kymkjh2002/React-cookie-%EC%A0%81%EC%9A%A9%EA%B8%B0
(React-cookie 관련 내용)
우리팀은 JWT 토큰을 로컬스토리지에 담아서 저장을 하였는데,
이 팀은 리액트 쿠키를 이용하여 내용들을 정리하였다.
쿠키와 로컬스토리지 이 개념에 부족해서 더 깊은 탐구가 필요했다.
1. cookie vs localstorage
내용을 읽어보니 좋았던 점은 역사에 대해서 알게 되었다.
HTML 5가 들어오면서 로컬스토리지 기능이 생겼고, 그전까지는 쿠키가 로컬스토리지 역할을
모두 담당했었다.
쿠키는
1) Seesion cookies(브라우저 닫으면 만료되는 쿠키)
2) Persistent cookies(만료일이 정해저있는 쿠키)
두 종류가 존재하고 용량이 4KB
사용자 경험에 따라서 컨트롤 할 수 있다는 것을 알았다.
그에 비해 로컬스토리지는 용량이 5MB로 엄청 크고,
많은 내용들을 서버없이 클라이언트에서 직접 관리 할 수 있다는 장점이 있었다.
그리고 클라이언트내에서 로컬스토리지 중심으로 컨트롤 하면
서버 요청이 없어 오류가 적어지고 부드럽게 움직이는 장점도 직접 느꼈다.
서버에 부담을 줄여주고 싶고, 빠르게 데이터를 관리하고 싶다면 로컬스토리지에
넣으면 될 것 같다고 생각했지만, 쿠키는 좀 더 탐구가 필요해보였다
2. cookie vs session
https://jjongins.tistory.com/118
(쿠키 비교글)
Session cookies(브라우저 닫으면 만료되는 쿠키)-> session이라고 줄여말함
Persistent cookies(만료일이 정해저있는 쿠키)-> cookies이라고 부르는 디폴트값
persistent cookies 속도가 빠르며 유리하고 웹브라우저에서 관리하고 보안에 취약하며
session cookies 는 서버에서 관리해서 속도가 느리지만, 보안성에 더 유리하다
결론은 보안적으로는 세션 쿠키가 훌륭하다
그래서 기존 용량이 크던 내용은 로컬스토리지에 넣는 것이 좋아보였고,
리액트 쿠키 활용방법에 대해 더 고민해보았다.
https://ejko0911.medium.com/react-cookie-%EC%82%AC%EC%9A%A9%ED%95%98%EA%B8%B0-75dccb501851
(리액트 쿠키 장단점 정리)
세션관리 : 로그인, 접속 시간 등 서버가 알아야 할 정보를 저장할 때 사용합니다.
개인화 : 사용자마다 다르게 적절한 페이지 보이도록 할 때 사용합니다.
트래킹 : 사용자의 행동과 패턴 분석하여 기록할 때 사용합니다.
위 3가지 장점이 있었다.
확실히 다음 프로젝트때 리액트 쿠키를 사용해봐야겠다.
3. Optional chaining
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Optional_chaining
Optional chaining (?.)은 이번에 타입스크립트 쓰다가 린트가 알려줘서 사용해보았다.
데이터를 내려줄 때 있을 때가 있고 없을 때가 있어서 경우의 수를 나눠줄 때 유용했다.
알고 있었지만 명칭에 대해서 몰랐는데,
이번에 다른팀을 살펴보면서 명칭에 대해서 알게 되었다.
코딩을 하면서 느낀 것은 명칭도 정확히 알고 있어야 의사소통이 수월하기 때문에,
내용을 정리해서 올려본다.
