DEV TOOLS(개발자도구)

Room9·2021년 5월 10일
0

WEB을 빠르게 진단하고, 간편하게 편집한다
WEB 관리의 최전선 TOOL


KEY WORD

  • ELEMENTS(Publish and Section)
  • CONSOLE(JAVA SCRIPT)
  • NETWORK(API and DB)
  • APPLICATION(Client,Browser storage)

ELEMENTS

  • 기능: Page의 Publishing(HTML, CSS) 을 파악함으로써 전체 SECTION 구분 가능

CONSOLE

  • 기능: JAVA SCRIPT 직접 적용 및 구현 사항 확인 패널
  • Console은 객체이며 log를 포함한 메서드를 가진다
  • Console.log에서 debug
  • Backend response에 따른 Front단 구동 설정

NETWORK

  • 기능: 백엔드 API와의 연결을 통해 DataBase와 통신 진행 및 상황 확인 패널
  • http 네트워크 통신 확인/ API 크롤링, 페이지 로딩 성능 테스트 /이미지, 영상 등의 소스
  • http의 request와 그에 따른 Backend response 확인가능

APPLICATION

  • 기능: Server가 아닌 Client,Browser 자체적으로 Data 저장, 웹 구동의 효율 증대
  • PW 등의 주요정보는 절대 저장해선 안된다
  • Local storage / Session storage / Cookie 내 Key : Value 형식으로 저장

Local storage : 브라우저 스토리지 내 영구적으로 존재, 지속적으로 유지해도 되는 DATA 저장

예시] ID 기본입력 , 비회원 장바구니 등

Session storage: 탭이나 페이지 단위로 저장되며, 닫을 시 데이터도 소멸, 잠깐동안만 유지 됨

예시] 은행사이트 등 보안 중요한 페이지, 기본 언어 설정 등

Cookie : 가장 적은 용량으로, 일정 시간만 데이터를 유지할 수 있다, 백엔드와 프론트엔드에 걸쳐있음

profile
개발아 사이좋게 지내자

0개의 댓글