Spring, React 개발을 위한 Visual Studio Code (vsCode) 플러그인 추천

1. 시험환경

    · 윈도우

    · Visual Studio Code

 

2. 목적

    · React와 SpringBoot를 이용한 개발을 위해 Visual Studio Code를 사용한다.

    · React와 SpringBoot 개발을 위해 Visual Studio Code에서 유용한 Plug-In을 설치한다.

 

3. 적용

    ① Visual Studio Code의 Extentions 탭에서 플러그인 설치를 진행한다.

 

    ② 개발 공통 필수 플러그인

    · Better Comments : 코드에 작성된 주석을 색상별로 구분해 가독성을 높임

 

    · Color Highlight : CSS나 코드 내 색상 코드(예: #FF5733, rgba(...))를 시각적으로 미리 보기 제공.

 

    · GitHub Theme : GitHub와 유사한 다크 및 라이트 테마를 제공하여 VS Code UI에 적용.

 

    · Material Icon Theme : 파일 확장자나 폴더 이름에 따라 머터리얼 스타일 아이콘을 적용하여 직관적인 표시.

 

    ③ Git 관련 플러그인

    · GitLens : Git 히스토리와 블레임(누가 언제 수정했는지)을 코드 상에서 상세히 보여줌.

 

    · GitHub Pull Requests : PR 생성, 리뷰, 코멘트 작성 등을 직접 편집기에서 수행하여 VS Code 내에서 GitHub Pull Request를 열람, 리뷰, 병합 가능.

 

    · GitHub Repositories : 로컬에 클론하지 않고 GitHub 저장소의 파일을 VS Code에서 직접 탐색/수정.

 

    · Markdown Preview Github Styling : .md 파일의 스타일을 GitHub에서 보는 것처럼 똑같이 렌더링.

 

    ④ SpringBoot 관련 플러그인

    · Gradle for JAVA : 빌드, 의존성 관리, 태스크 실행 등을 VS Code 내에서 수행 가능.

 

    · Spring Boot Extension Pack : Spring Boot 개발을 지원하는 확장팩 (다수의 확장 포함).

 

    · Spring Boot Snippets : @RestController, @Service 등 자주 쓰이는 코드 패턴을 빠르게 삽입 가능.

 

    ⑤ React 관련 플러그인

    · ES7+ React/Redux/React-Navite snippets : rfc, useEffect, useState 등 자주 쓰는 구문을 빠르게 타이핑 가능.

 

    · TypeScript Extension Pack : TypeScript 개발 환경 향상을 위한 확장팩.