[Chrome] 크롬 개발자도구 실행과 한국어 변경 방법

Author:jarvis Hours 등록일 Hours 업데이트

구글에서 만든 크롬 브라우저는 개발을 도와주는 ‘크롬 개발자도구’가 있습니다. 개발자 도구(Developer tools)를 이용해서 HTML, CSS, JavaScript의 생산성을 높일 수 있습니다. 개발자를 위한 도구이지만 글자 크기, 색, 간격과 같은 값을 확인할 수도 있고 웹사이트의 속도를 PC뿐만 아닌 모바일 버전으로도 확인할 수 있는 장점이 있습니다.

1. 개발자모드 실행 방법

실행 방법은 2가지가 있습니다. 검수하려는 웹사이트에 접속 후 맥에서 [command+option+I], 윈도우에서는 [ctrl+shift+I]를 눌러 실행하면 됩니다. 제일 많이 사용하는 단축키는 [F12]이겠죠. 직접 접속 할 때는 크롬 앱의 우측 상단 [더보기] > [도구 더보기] > [개발자 도구]를 클릭하면 확인할 수 있습니다.

크롬 개발자도구-더보기 메뉴에서 실행하기

2. 크롬 개발자도구 한국어 변경 및 다크모드 설정

개발자도구를 한국어로 변경 후 사용할 수 있습니다. 개발자도구의 기본 인터페이스입니다.

크롬 개발자도구-기본 인터페이스(영어)

크롬 개발자도구 실행 후 우측 상단 톱니바퀴 모양 [설정] 버튼을 클릭합니다.

크롬 개발자도구-우측 상단 설정 버튼

개발자 도구 설정 화면의 기본 인터페이스입니다.

크롬 개발자도구-설정 기본 인터페이스(영어)

Language를 클릭해서 한국어 변경 및 크롬 개발자도구 테마를 다크모드로 변경할 수 있습니다. 설정 변경 후 창을 닫아 주면 됩니다.

크롬 개발자도구 설정-한국어 변경 및 다크모드 설정

3. 동기화 설정하기

PC에서 설정한 것을 집에 가서 노트북 등으로 작업을 해야 하는데 재 설정을 해야 한다면 번거로울 수 있습니다. 동기화 설정이 가능합니다. 기본 환경설정 하단에 보면 [설정 동기화 사용]을 체크해서 사용할 수 있습니다.

크롬 개발자도구 환경설정-동기화 사용하기

개발자도구의 가장 기본적인 설정 법에 대해 알아 봤습니다.

GA4 설치 방법

Similar Posts

  • 페이오니아: 가입, 수취 계좌 등록, 현지 은행 계좌 연결 방법(데스크탑)

    Published:macbeth

    페이오니아는 미국에 본사를 둔 글로벌 금융 서비스 기업으로, 주된 목적은 국제 온라인 송금, 글로벌 결제 처리, 프리랜서·기업을 위한 현지 통화 계좌 제공입니다. 예를 들어 아마존 어소시에이트 등을 할 때 연동이 필요한 경우 페이오니아를 사용할 수 있습니다. 해외 클라이언트로부터 대금을 받을 때, 혹은 글로벌 플랫폼(예: 아마존, 업워크, 피버 등)의 수익금을 인출할 때 페이오니아는 합리적인…

  • 웹페이지 속도 측정 사이트 Big 4

    Published:jarvis

    내가 운영하는 웹사이트의 속도가 어느 정도일까? 속도가 많이 느린거 같은데 개선이 필요하지 않은지 웹페이지 운영자라면 이 점을 고려하게 됩니다. 속도 측정 사이트 4군데를 알아 보겠습니다. 목차1. 개발자모드 실행 방법2. 크롬 개발자도구 한국어 변경 및 다크모드 설정3. 동기화 설정하기1. 구글 페이지스피드 인사이트 첫 번째 소개할 사이트는 구글에서 서비스 하고 있는 페이지 스피드 인사이트(PageSpeed Insights)입니다….

  • 인터넷 속도 측정 사이트 5개(무설치) 추천

    Published:jarvis

    보통 가정에서 사용하는 Internet 상품은 100Mbps, 500Mbps, 1Gbps 상품 중 하나를 선택해서 사용하게 됩니다. 내가 사용하는 Internet 속도가 잘 나오는지 궁금할 때가 있습니다. 인터넷 속도 평균 Mbps 등을 디테일하게 체크할 필요가 있을 수 있습니다. 설치나 로그인 없이 평균 인터넷 속도 측정이 가능한 6군데를 사이트 5군데를 사이트 리뷰 해 보겠습니다. 목차1. 개발자모드 실행 방법2….

  • 아이폰 디스플레이 및 밝기 설정(&라이트모드 다크모드 2가지 모드)

    Published:wilson

    아이폰은 설정 화면의 디스플레이 및 밝기 설정탭으로 들어가면 아이폰 라이트모드 다크모드를 각각 설정을 할 수 있습니다. 아이폰 디스플레이 및 밝기 설정 탭으로 접속하면 첫 화면에서 바로 확인할 수 있습니다. 전 구매하자마자 다크모드를 사용해서 눈의 편안함을 추구하고 있습니다. 디스플레이 및 밝기 설정 탭의 기능들을 하나 씩 알아보겠습니다. 목차1. 개발자모드 실행 방법2. 크롬 개발자도구 한국어…

  • 구글 태그와 구글 태그 매니저의 이점 3가지

    Published:jarvis

    태그는 웹사이트나 모바일 앱에 제품을 통합하도록 도움을 주는 애널리틱스, 마케팅, 지원 공급업체가 제공하는 코드 세그먼트(code segment)입니다. 목차1. 개발자모드 실행 방법2. 크롬 개발자도구 한국어 변경 및 다크모드 설정3. 동기화 설정하기 1. 마케팅 태그 웹페이지 코딩에 사용되는 표준 HTML 태그 <head>, <body>, <p>와 같은 태그와 비슷하지만 다릅니다. 구글 애널리틱스와 마케팅 업계에서 말하는 태그는 자바 스크립트로…

  • 캐싱 개념과 분류: 웹사이트 성능 최적화 | 원리와 활용 | 서버 측 캐시 5가지와 클라이언트 캐시

    Published:I-var uknew

    사이트 성능 최적화란 사용자에게 더 빠른 로딩 속도와 쾌적한 경험을 제공하기 위해 웹 자원과 서버 구조를 효율적으로 관리하는 작업입니다. 이를 위해 일반적으로 캐싱, 파일 최적화, 전송 최적화, 서버 최적화 네 가지 핵심 전략이 활용됩니다. 캐시를 통해 반복되는 데이터를 저장하고, 파일 최적화를 통해 CSS·JS·이미지 등의 용량을 줄이며, 전송 최적화에서는 압축과 CDN, HTTP/2 등을 활용해…