개발자 도구

Elements tools

• html/css

Console tools

• debugging
  어떤 에러에 대해 문제를 파악하고 수정하는 작업
• debugger 걸어 jacascript 돌아가는걸 확인할 수 있더

Network tools

• 프론트엔드와 백엔드 연결되는 url, js 등을 확인할 수 있다
• XHR
  프론트에서 백엔드에게 api를 호출할 때 제대로 응답하는지 알 수 있다
  웹사이트 구현시 프론트, 백엔드 중에서 어떤 부분이 오류인지 확인 가능하다

Application tools

local storage

• 기간: 영구(수정되지 않는 한)
• 자동로그인
  id/pw 직접 저장하는 것이 아닌 자동로그인 설정을 확인

session storage

• 기간: '닫기'할 때까지
  ex) 장바구니

cookies

• 기간: 일정 유효기간 존재
  ex) 팝업

Performance, Memory

• 코드가 사이트에서 제대로 돌아가는지 확인할때 보는 창