1 크롬 개발자 도구로 웹 구조 파악

• 크롬 개발자 도구는 웹 페이지 구조 분석하기 위한 툴. HTML뿐 아니라, 자바스크립트, CSS로 구성된 웹 페이지 구조 쉽게 파악 가능.
• 특히 크롤링 시 특정 태그나 CSS 선택자 쉽게 찾을 수 있어 유용.
• 우측 상단 - 도구 더 보기 - 개발자 도구
  혹은 F12로 연다
  
• 여기서 상단 창은 HTML
• 하단 창은 CSS 구성
• Elements탭
  • 웹 페이지에 대응되는 소스 코드가 보인다
  • HTML 상단의 가장 왼쪽 아이콘을 클릭하고, 사이트의 특정 지정에 갖다대면 그 부분의 HTML 부분으로 넘어간다. 그렇게 원하는 데이터가 어디 있는지 찾을 수 있다. => 확인 삼아 ctrl+F로 똑같은 걸 몇 개 찾아본다.
• Sources 탭
  • 웹 페이지에 포함된 모든 리소스 파일 확인 가능
  • 도메인별 리소스 트리 펼쳐서 특정 리소스 파일 찾을 수 있고, ctrl+P로 입력란에 검색도 가능