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

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

1. 개발자모드 실행 방법

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

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

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

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

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

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

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

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

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

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

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

3. 동기화 설정하기

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

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

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


Similar Posts

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

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

  • 구글 CCPA 및 GDPR 메시지 확인 테스트

    구글의 GDPR과 CCPA 설정을 한 후에 메시지가 나오는지 궁금할 수 있습니다. “구글의 CCPA 및 GDPR 메시지 확인을 진행할 수 있는 방법이 있는가?” 라는 의문으로 시작하여 2가지 메시지를 직접 확인해 보기로 했습니다. 유럽 규정 메시지에 대한 정보에서 확인 했을 때는 두 개의 버튼(옵션 관리, 동의)이 있는 유럽 규정 메시지가 나온다는 내용을 확인하였으며 아래와 같은…

  • 저작권 없는 무료 이미지 다운로드 사이트 추천 LIST 35+@-라이선스 확인

    블로그나 상업용으로 이미지를 사용해야 하는데 저작권 때문에 유료 이미지를 사용하지만 유료 이미지 사이트를 사용하는 것에는 한계가 있습니다. 예를 들어 한 달에 발행하는 뉴스·블로그 글이 이용하는 유료 이미지 사이트의 이미지 수를 초과하는 경우입니다. 저작권 없는 무료 이미지 사이트를 같이 사용하는 방법을 고려할 수 있습니다. 무료이미지 상업용 사용 조건 등은 어떻게 되는지 확인해 보겠습니다. 스톡…

  • 구글링 개요 | 효율적인 구글 검색 방법 10가지

    구글링(Googling)이란 Google에 -ing가 붙여져 만들어진 동사입니다. 영어권에서 구글의 영향력으로 구글링 단어 자체가 “검색 엔진에서 검색한다.”의 뜻을 가지게 되었습니다. 전 세계 어느 검색엔진보다 더 높은 신뢰성을 기반으로 점유율을 가지게 된 결과이기도 합니다. 목차1. 개발자모드 실행 방법2. 크롬 개발자도구 한국어 변경 및 다크모드 설정3. 동기화 설정하기 구글링 방법: 연산자 사용으로 검색 세분화 하기 구글 검색…

  • [GA4] 구글 애널리틱스 데이터 설정-수집 및 보관 설정

    애널리틱스 GA4 계정 및 데이터 스트림을 생성했다면 ‘애널리틱스 데이터 설정’과 ‘내부 IP 제외’를 해서 통계를 보다 정확히 볼 수 있도록 하는 것이 필수 설정이라고 할 수 있습니다. 세 번째로 ‘추천 트래픽’을 제외 시키는 방법에 대해 알아 보겠습니다. 목차1. 개발자모드 실행 방법2. 크롬 개발자도구 한국어 변경 및 다크모드 설정3. 동기화 설정하기 1. 애널리틱스 데이터…

  • 랜덤 비밀번호 생성기: 숫자(123)+대소문자+특수문자

    대문자, 소문자, 숫자, 특수 문자를 조합하여 최상의 보안을 달성하세요. 최소 6자리 비밀번호부터 최대 30자리 까지 가능합니다. 비밀번호 관리의 걱정을 덜어드립니다. 온라인 안전성을 높이는 데 도움이 되는 무료 도구입니다. 목차1. 개발자모드 실행 방법2. 크롬 개발자도구 한국어 변경 및 다크모드 설정3. 동기화 설정하기랜덤 비밀번호 생성기 ▲ 웹사이트 보안을 강화하고 안전한 비밀번호를 손쉽게 생성할 수 있습니다….