생산성을 높여주는 최고의 VScode 확장 프로그램 15선

이 글에서는 생산성을 높이기 위해 VScode에 반드시 설치해야 할 15가지 최고의 확장 프로그램을 소개합니다.

코딩은 모든 비즈니스의 근간입니다. 목표 달성을 지원하는 수백만 개의 애플리케이션을 구축합니다. 많은 사람들이 코딩 덕분에 다양한 삶의 목적에 접근할 기회를 얻었습니다.

어떤 사람들은 커뮤니티를 지원하는 도구로 사용하기도 하고, 어떤 이는 세상을 더 나은 곳으로 만들기 위한 더 큰 목표를 가지고 있습니다. 또 다른 사람들은 기술 산업에서 많은 돈을 벌기 위해 직업을 갖고자 합니다. 사람마다 목표는 다르지만, 코딩이 세상에 강력한 영향을 미친다는 점에서 결코 쉬운 일이 아닙니다.

좋은 코더가 되려면 인내와 노력이 중요합니다. 약간의 논리적 사고도 필요합니다. 하지만 이 모든 것만으로는 코더가 작업을 완성하기에 충분하지 않습니다. 작업을 완료하기 위해 기술의 작은 지원도 필요합니다.

시작해 봅시다.

#1. Setting Sync

아마도 이 확장 프로그램이 가장 먼저 꼽힐 것입니다. 키보드 구성, 설정, 기타 확장 프로그램 등 VScode에서 사용자 지정한 거의 모든 것을 Github에 동기화할 수 있습니다. 덕분에 좋아하는 설정으로 작업하는 즐거움을 누릴 수 있습니다. 긴 코딩 시간 동안 더 큰 즐거움을 느끼면 생산성을 효과적으로 자극할 수 있습니다.

Setting Sync는 하나의 설정을 저장하여 다른 장치에서 빠르게 사용할 수 있도록 해줍니다. 이제 처음부터 수동으로 설정을 변경하는 걱정을 하지 않아도 됩니다. 몇 단계만 거치면 바로 사용할 준비가 됩니다.

#2. Live Server

라이브 서버는 작업을 훨씬 쉽게 만들어 줍니다. 변경 사항을 즉시 업데이트하는 라이브 리로드 기능입니다. 코드를 조금만 수정해도 페이지를 다시 로드할 필요가 없습니다. 자동으로 작업을 처리해 줍니다.

#3. Remote SSH

이름에서 알 수 있듯이, 이 확장 프로그램은 원격에서 개발 작업을 할 수 있게 해줍니다.

이 도구를 사용하면 SSH 서버를 통해 원격 머신의 파일이나 폴더를 VScode의 모든 기능과 함께 열 수 있습니다. 서버에 연결되어 있을 때 원격 파일 시스템의 폴더에 쉽게 원격 접속할 수 있습니다.

소스 코드는 필요하지 않습니다. 이 확장 프로그램은 명령과 다른 확장 프로그램을 원격 장치에서 직접 실행하기 때문입니다.

#4. Prettier

Prettier는 코드를 표준 형식으로 포맷팅하는 데 도움을 줍니다. 여러 사람이 같은 프로젝트에서 작업할 때 특히 유용합니다. Prettier는 모든 것을 일관되게 유지하여, 매번 수동으로 코드를 포맷할 필요가 없게 해줍니다.

#5. TODO highlight

많은 사람에게는 중요하지 않아 보일 수 있지만, 저에게는 확실히 중요한 확장 프로그램입니다. 저는 TODO를 종이에 필사적으로 적었지만 자주 잊어버렸습니다. TODO highlight는 목록을 훨씬 더 명확하게 만들어 줍니다. 또한 전통적인 손글씨보다 추적하기가 더 쉽습니다.

TODO를 돋보이게 하는 기능도 있습니다. 의도적으로 무시하려 해도 더 어렵게 만듭니다.

#6. GitLens

코드를 추적하는 데 있어 GitLens는 그룹 프로젝트에 필수적인 도구입니다. 누가, 어떻게, 왜 코드 라인을 변경했는지 알려줍니다.

또한 설정을 즉시 끌 수 있어 사용자 맞춤화가 가능합니다.

#7. Git history

대부분의 경우 VScode에서 제공하는 기능으로 현재 변경 사항을 보고, 브랜치를 관리하며, 차이점을 확인할 수 있습니다. 하지만 코더로서 기본 정보 이상이 필요합니다. Git history는 더 심층적인 뷰를 제공합니다. Git history는 다음을 보여줍니다:

• 라인이나 파일에 대해 언제, 어떻게, 무엇이 변경되었는지 보기
• 브랜치, 커밋, 커밋 간 파일 비교

#8. Peacock

Peacock은 멋진 이름의 확장 프로그램입니다. 기능은 간단합니다: VScode 환경의 색상을 변경합니다.

일반적으로 개발자는 프로젝트 작업을 위해 여러 개의 VS code를 엽니다. 다음에 어떤 것을 사용해야 하는지 구분하는 것이 중요합니다. 모두 같은 색이면 전환이 번거롭습니다. 따라서 각각 다르게 색칠하여 생산성에 영향을 주지 않도록 합니다.

#9. Colorize

생산성을 높이는 또 다른 유용한 색상 도구입니다. CSS/Less/SASS/… 파일에서 코드 작업 위치와 내용을 탐색하는 것이 더 이상 골칫거리가 아닙니다.

#10. Bracket Pair Colorizer

어떤 괄호가 서로 짝인지 인식하는 것이 얼마나 어려운지 모두 알고 있습니다. 그래서 각 쌍에 다른 색을 부여하는 것은 훌륭한 아이디어입니다. 특히 초보자에게는 특정 코드와 기호를 구분하는 데 더 나은 시각적 도움을 줍니다.

#11. Auto rename tag.

새 태그를 열면 VScode가 자동으로 닫아준다는 것을 알고 계실 겁니다. Auto rename tag도 같은 기능을 합니다. 태그 한쪽 이름을 변경하면 반대쪽 이름도 자동으로 변경됩니다.

정말 편리합니다.

#12. Code spell checker

웹 개발자라면 웹사이트에 오타가 있는 것을 원치 않을 것입니다. 고객이 오타를 발견하면 당황스럽습니다. 저도 실수할 때마다 모든 오타를 감지할 수 없습니다. 따라서 코드 맞춤법 검사기는 작업 효율을 높이는 최고의 동반자입니다.

#13. Bookmarks

Google Drive나 다른 플랫폼에서 Bookmarks를 많이 사용해 보셨을 겁니다. VScode의 Bookmarks도 같은 역할을 합니다. 다양한 코드를 북마크하여 언제든 클릭 한 번으로 유연하게 확인할 수 있게 도와줍니다.

#14. VScode-icons

이 도구는 일상을 훨씬 더 흥미롭게 만들어 줄 수 있습니다. VScode 파일의 아이콘과 색상을 변경합니다. 코딩과는 관련 없지만, 긴 작업 시간 동안 즐길 거리를 제공합니다.

#15. Debugger for Chrome

마이크로소프트에서 개발한 확장 프로그램입니다. VScode에서 JS로 작성된 코드를 디버깅할 수 있게 해줍니다. 많은 코더들이 가장 원활한 디버깅 도구 중 하나라고 평가합니다.

이상으로 생산성을 높여줄 15가지 최고의 VScode 확장 프로그램을 소개했습니다. 기술 전반이나 코딩에 대해 더 알고 싶다면 TECHVIFY를 팔로우하여 더 많은 기술 이야기와 기사를 확인하세요. 계속 지켜봐 주세요!!!