생활코딩

Coding Everybody

코스 전체목록

닫기

크롬 개발자도구

| 공개

크롬 개발자 도구란?

구글에서 만든 웹브라우저인 크롬에는 개발을 도와주는 다양한 도구가 기본적으로 제공됩니다. 이를 개발자 도구라고 합니다. 개발자 도구를 이용하면 HTML, CSS, JavaScript의 생산성을 극대화 할 수 있습니다. 

크롬의 설치

아래 링크를 통해서 다운로드 받을 수 있습니다. 

www.google.com/chrome

HTML 개발 관련

HTML 개발과 관련해서는 아래의 토픽들이 특히 도움이 될 것입니다. 

  • Elements : HTML 코드를 분석하고, 실시간으로 수정할 수 있는 도구
  • Resources :  현재 로딩된 웹페이지에서 사용된 리소스(이미지, 스크립트, 데이터)를 열람 할 수 있는 도구
  • Network : 서버와의 통신 내역을 보여주는 도구로, 존재하지 않는 리소스를 찾는데 도움이 됩니다. 
  • Audits : 웹 에플리케이션의 성능을 향상시킬 수 있는 방법들을 컨설팅해주는 도구

참고

Code School

댓글

댓글 본문
작성자
비밀번호
  1. 알보칠
    안됩니다.
    직접 열어서 수정해야합니다.
    대화보기
    • egoing
      아래 링크 참고해주세요.
      http://www.screencast.com......bNc
      대화보기
      • 이연수
        크롬개발자도구에서 HTML,css 실시간 수정할 때 라인을 선택 후 에디팅 메뉴 클릭해서 수정을 할수밖에 없나요?
        그냥 수정하려니 키 입력자체가 안먹네요
        그리고 HTML 태그별로 닫힘되어 있어서 하나하나 클릭해서 펼쳐야 하는데, 그냥 전체 소스 모두 열려진 상태로
        수정할수는 없을까요.
      graphittie 자세히 보기