개발자가 꼭 써봐야 할 크롬 익스텐션 15개 추천

프로필 사진EKO

우리가 매일 사용하는 브라우저, 그 중에서도 크롬(Chrome)은 방대한 확장 프로그램 생태계를 가지고 있습니다. 그래서 다양한 익스텐션을 활용하면 생산성을 높이고 웹 브라우징을 더욱 편리하게 할 수 있습니다. 이 글에서는 브라우징 효율성을 높여주는 도구부터 개발에 도움을 주는 도구까지, 개발자가 꼭 써봐야 할 크롬 익스텐션을 소개해드리겠습니다. 모든 익스텐션에 설치 링크를 첨부해두었으니 필요한 익스텐션을 찾아서 사용해보세요.

크롬 익스텐션 로고

목차

효율적인 브라우징을 위한 익스텐션

  • Toby
    웹사이트를 그룹화하여 관리할 수 있는 탭 관리 도구입니다. 탭이나 북마크가 너무 많아지면 원하는 웹사이트를 바로 찾기가 어려워지죠. Toby를 사용하면 자주 사용하는 웹사이트를 크롬 초기화면에 깔끔하게 정리해놓고 빠르게 접근할 수 있습니다. 열려있는 탭을 그룹화하여 저장할 수도 있고, 그룹에 속한 탭을 한 번에 열 수도 있습니다.

  • Perplexity
    코딩할 때 ChatGPT나 Claude 등의 AI 서비스를 자주 사용하실 겁니다. Perplexity는 AI 기반의 검색 서비스로, 간단한 질문에 대한 답변을 빠르게 얻고 싶을 때 유용합니다. Perplexity 익스텐션을 상단 바에 고정해두고 궁금한 점이 생길 때마다 바로 검색해보세요. 복잡한 웹 탐색 없이 필요한 정보를 빠르게 찾을 수 있습니다.

  • Dark Reader
    많은 개발자분들이 다크모드를 선호하실 겁니다. 하지만 다크모드를 지원하지 않는 웹사이트가 많아서 눈이 피로해질 때가 있습니다. Dark Reader를 사용하면 웹사이트의 색상을 반전시켜 강제로 다크모드로 만들 수 있습니다.

  • Notion Boost
    웹 브라우저에서 노션 문서를 볼 때 여러 가지 편의기능을 제공해주는 익스텐션입니다. 사이드바에 목차를 표시하거나, 폭이 좁은 페이지를 전체 너비로 보여주는 등 다양한 기능을 제공합니다.

  • CrxMouse
    마우스 제스처를 사용하여 브라우징을 더욱 편리하게 할 수 있는 익스텐션입니다. 뒤로 가기, 앞으로 가기, 페이지 스크롤, 탭 닫기 등 다양한 제스처를 지원합니다. 익스텐션 설정 페이지에서 제스처 목록을 확인하고 수정하거나 추가할 수 있습니다. 키보드 단축키를 잘 사용하지 않고 마우스를 선호하는 분들에게 유용합니다.

  • Vimium
    키보드로 브라우징을 할 수 있게 해주는 익스텐션입니다. 웹사이트의 링크를 키보드로 선택하거나, 뒤로 가기, 앞으로 가기, 페이지 스크롤, 탭 이동 등을 편리하게 할 수 있습니다. ? 키를 눌러 단축키 목록을 확인할 수 있습니다. 평소에 단축키를 많이 사용하는 분들이라면 마우스를 사용하지 않고 키보드만으로 브라우징할 수 있어 편리합니다.

개발에 도움이 되는 익스텐션 (프론트엔드 중심)

  • Wappalyzer
    웹사이트의 기술 스택을 분석해주는 도구입니다. 웹사이트가 어떤 기술로 만들어졌는지, 어떤 프레임워크를 사용하는지, 어떤 서버를 사용하는지 등을 알 수 있습니다. 내가 방문한 웹사이트가 어떤 기술로 만들어졌는지 호기심을 갖고 다양한 웹사이트를 분석해보세요.

  • CSSViewer
    CSS 속성을 간편하게 확인할 수 있는 도구입니다. 특정 element에 마우스를 hover하면 폰트, 컬러, 사이즈, 여백 등 다양한 속성을 한눈에 볼 수 있습니다. 개발자 도구를 열지 않고도 간단하게 CSS 속성을 확인할 수 있어 편리합니다.

  • CSS Peeper
    웹사이트의 전반적인 스타일을 분석해주는 도구입니다. 현재 페이지에 사용된 폰트, 컬러 팔레트를 확인할 수 있고, 이미지, 아이콘 등의 리소스를 다운로드할 수도 있습니다.

  • ColorZilla
    컬러를 추출할 수 있는 컬러 피커입니다. 브라우저 익스텐션이지만 웹사이트 내부뿐만 아니라 외부에서도 컬러를 추출할 수 있습니다. 컬러를 따고 싶은 부분을 클릭하면 자동으로 컬러 코드를 복사해줍니다.

  • WhatFont
    웹사이트에서 사용된 폰트를 확인할 수 있는 도구입니다. 텍스트에 마우스를 hover하면 어떤 폰트인지 볼 수 있고, 특정 텍스트를 클릭하면 폰트 스타일도 확인할 수 있습니다.

  • JSON Formatter
    JSON 형식의 데이터를 읽기 쉽게 파싱해주는 도구로, API 응답 결과를 확인할 때 유용합니다.

  • Material Icons for GitHub
    GitHub 파일 브라우저의 아이콘을 Material Design 아이콘으로 바꿔주는 익스텐션입니다. VS Code에서 Material Icon Theme을 사용하는 분이라면 GitHub에서도 동일한 아이콘을 사용할 수 있어 폴더 구조를 파악하기가 더욱 쉬워집니다.

    VS Code 테마와 아이콘 테마를 설정하는 방법은 이전 글을 참고하세요.

    Loading...

영어 문서를 읽기 위한 번역 익스텐션

“개발자가 반드시 배워야 할 언어는 영어다.”라는 말이 있습니다. 영어로 된 문서를 읽는 것은 개발자에게 필수적인 능력이죠. 하지만 영어에 자신이 없더라도 번역 도구를 사용하여 언어 장벽을 극복할 수 있습니다. 번역 관련 익스텐션들은 이전 글에서 사용법을 자세히 다루었으니 참고해보세요.

Loading...