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

공정위 광고 문구 Ver 3.0

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

1. 개발자모드 실행 방법

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

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

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

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

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

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

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

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

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

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

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

3. 동기화 설정하기

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

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

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


ℹ️ 제휴 안내
본 사이트의 콘텐츠에는 제휴 링크가 포함되어 있습니다. 방문자가 이 링크를 통해 상품 또는 서비스를 구매하면 본 사이트는 판매처로부터 수수료를 지급받습니다. 이 과정에서 구매자가 지불하는 금액(이벤트 할인 시 금액이 내려갑니다↓)은 오르지 않습니다. 게시된 가격·할인·재고 정보는 작성 시점 기준이며 실제와 다를 수 있으므로, 구매 전 판매처에서 최종 확인하시기 바랍니다. 상품 선정과 평가는 자체 기준에 따라 작성되며, 수수료 지급 여부가 소개 순서나 평가 내용에 영향을 주지 않습니다.

Similar Posts

  • 구글 애널리틱스 서치콘솔 연결 방법

    구글 애널리틱스 서치콘솔 연결 시 사용자가 어떤 방식으로 구글 검색에서 내 사이트를 접속했는지 알 수 있습니다. 이를 기반으로 ‘구글 애널리틱스’에서 접속 한 장소(국가 및 도시)와 구글, 네이버, 다음, 빙 등 접속한 경로를 알 수 있기에 유용하게 사용할 수 있습니다. 그 외에 데이터도 제공하기에 웹페이지에 접속했던 통계를 보다 체계적으로 사용할 수 있게 도와주는 유용한…

  • [Chrome App-PC] 세이프 브라우징 설정 방법

    Google의 데스크탑 및 모바일 앱인 Chrome 세이프 브라우징은 유저가 위험한 웹사이트를 탐색하는 중 위험한 파일을 다운로드 하려고 할 때 사용자에게 경고하는 구글의 서비스입니다. 랜섬웨어, 스파이웨어, 바이러스, 웜 및 트로이 목마를 포함한 맬웨어 등의 감염을 사전에 방지할 수 있도록 해 주는 서비스인 것이죠. 크롬 브라우저를 사용하던 중 빨간 화면의 안내 창을 본 적이 있을…

  • 티스토리 단점과 장점

    한국에서 가장 많이 사용하는 블로그는 네이버 블로그와 티스토리 블로그입니다. 티스토리 단점과 장점은 어떤 점이 있는지 알아 보겠습니다. 1. 티스토리란? 티스토리는 2006년 5월 개설된 서비스형 블로그이며, 테터툴즈 개발사인 테터앤컴퍼니(TNC)와 다음의 공동 운영 형태였습니다. 이후 2007년 운영권 전체가 다음으로 이전되었으며, 다음이 카카오에 인수되면서 카카오가 운영중인 서비스입니다. 2. 티스토리 단점 2.1 저품질 다른 블로그에서는 찾아 볼…

  • [WP] 워드프레스 페이지 빌더 vs 블록 에디터 5가지 차이

    워드프레스 구텐베르크(Gutenberg) 블록은 블록 에디터입니다. 공식 블록 에디터가 출시된 이후 워드프레스 페이지 빌더(Page Builder)를 대체하는 방향으로 흐르지 않을까? 라는 의문을 워드프레스를 이용한 웹사이트를 운영한다면 누구나 가졌을 법한 의문입니다. 많은 사람들이 페이지 빌더를 버리고 블록 데이터(Block Editor)로 이동하게 될까요? 이 글에서는 여기에 대한 해답을 찾기 위해 각각의 차이점과 앞으로의 미래를 개인적인 의견으로 예측해 보겠습니다….

  • 내 브라우저 해상도 크기 확인하기:해상도 확인 사이트

    사용하는 PC 및 모바일 내 브라우저 해상도 크기 확인이 필요할 때가 있습니다. 모니터 별 다양한 디바이스 크기가 있으며 우선 대표적인 3가지 디바이스 크기입니다. 크롬 브라우저에서 이 페이지에 접속하면 목차 1.에서 접속한 디바이스(PC,테블릿,스마트폰 등) 해상도 크기를 확인할 수 있습니다. 1. 내 브라우저 해상도 크기 확인 하기 내가 사용하는 브라우저 화면 크기가 몇 인치인지 아래…

  • magicxml 프로그램 삭제

    컴퓨터로 인터넷을 하다가 우연히 프로그램 파일에서 magicxml 프로그램 삭제를 안랩에서 진단해서 알려 줬습니다. 처음 보는 프로그램이고 윈도우에서 삭제해도 전혀 무방할 거 같아 바로 동의하고 삭제를 진행했습니다. magicxml 프로그램 삭제 후 확인 삭제 전에 확인해야 겠지만 필요 없는 프로그램으로 밖에 안 보여 어떤 프로그램인지 조회를 해 봤습니다. 확인 결과 드림 시큐리티라는 기업에서 개발되어으며, magicxml은…