리액트 프로젝트 생성하기 #2 VS Code 에디터 설치

리액트 애플리케이션 코드를 수정하기 위해 사용할 코드 에디터 설치가 필요합니다.

 

VS Code를 설치하겠습니다.

 

비주얼 스튜디오 코드 홈페이지로 이동 하여 운영체제에 맞는 버전을 다운로드 합니다.

Download Visual Studio Code - Mac, Linux, Windows

Download Visual Studio Code - Mac, Linux, Windows

 

VS Code는 다양한 확장 프로그램을 설치하여 커스텀 할 수 있습니다.

리액트 코드 수정을 돕기 위해 몇 가지의 확장 프로그램을 설치할게요

 

좌측 메뉴에서 확장 버튼을 선택하고 

검색창에 ESLint 를 검색한 후

ESLint를 설치합니다.

 

위와 같은 방법으로  Reactjs Code Snippets, Prettier-Code formatter 를 설치하겠습니다.

 

ESLint - JS 문법, 코드스타일 검사 도구

Reactjs Code Snippets(제작자 charalampos karypidis)  -  리액트 컴포넌트 및 라이프사이클 함수 작성 시 단축 단어로 간편하게 코드를 자동 생성하는 스니펫 모음 

Prettier-Code formatter - 코드 스타일 정리 도구

 

저는 Community Material Theme 와 Material Icon Theme도 설치했어요!

 

Community Material Theme - VS Code 커스텀 테마

Material Icon Theme - 에디터 사용 시 탐색기에서 표시되는 파일 아이콘을 변경해주는 테마