기록
Home
  • 분류 전체보기 (187)
    • Programming (109)
      • JAVA (15)
      • Javascript (0)
      • 데이터베이스 (8)
      • React (7)
      • 프레임워크 (1)
      • Spring (11)
      • 웹(Web) (4)
      • 운영체제 (5)
      • 서버&네트워크 (6)
      • 자료구조 (0)
      • 알고리즘 (1)
      • 형상관리 (0)
      • 에러노트 (35)
      • 개발 툴 (15)
      • TEMP. (1)
    • Project (0)
      • 트러블슈팅 (0)
    • Personal (2)
      • 리뷰 (1)
      • 업무 (0)
    • Course (0)
      • 모든 개발자를 위한 HTTP 웹 기본 지식 (1)
      • 스프링 핵심 원리 - 기본편 (51)
      • 자바 ORM 표준 JPA 프로그래밍 - 기본편 (21)
    • TEMP (0)
Home
  • 분류 전체보기 (187)
    • Programming (109)
      • JAVA (15)
      • Javascript (0)
      • 데이터베이스 (8)
      • React (7)
      • 프레임워크 (1)
      • Spring (11)
      • 웹(Web) (4)
      • 운영체제 (5)
      • 서버&네트워크 (6)
      • 자료구조 (0)
      • 알고리즘 (1)
      • 형상관리 (0)
      • 에러노트 (35)
      • 개발 툴 (15)
      • TEMP. (1)
    • Project (0)
      • 트러블슈팅 (0)
    • Personal (2)
      • 리뷰 (1)
      • 업무 (0)
    • Course (0)
      • 모든 개발자를 위한 HTTP 웹 기본 지식 (1)
      • 스프링 핵심 원리 - 기본편 (51)
      • 자바 ORM 표준 JPA 프로그래밍 - 기본편 (21)
    • TEMP (0)
블로그 내 검색

기록

  • Programming/개발 툴

    Visual Studio Code(VSCode) 에디터 설치하기

    2022. 11. 16.

    by. 개발도비

    https://code.visualstudio.com/

     

    Visual Studio Code - Code Editing. Redefined

    Visual Studio Code is a code editor redefined and optimized for building and debugging modern web and cloud applications.  Visual Studio Code is free and available on your favorite platform - Linux, macOS, and Windows.

    code.visualstudio.com

     

    공식 홈페이지에 접속한다 

     

     

    OS에 맞게 프로그램을 설치한다 

     

     

    1) 아이콘 추가 : 바탕 화면에 VSCode 아이콘 만들기.
    2) 두 번째, 세 번째 "code(으)로 열기" : 폴더나 파일을 VSCode로 바로 열 수 있도록

    마우스 우클릭 메뉴에 code(으)로 열기를 표시해준다.
    3) VSCode를 기본 편집기로 사용하고 싶은 경우 체크.
    4) PATH에 추가 :  명령 창(CMD, 파워셀 등)에서 code를 입력하면 VSCode가 바로 실행 된다.

     

     

     

    +) 한글 팩 설정 바꾸기 

     

     

    처음 설치하고 실행하면 팝업이 뜬다. 여기서 설치 및 다시 시작을 눌러준다.

     

     

    아니면 왼쪽의 '확장'(Ctrl+Shift+X)에서 Korean을 검색한다. 

    Korean Language Pack for Visual Studio Code를 인스톨해준 후 프로그램을 재실행한다. 

     

     

    +) 코드 자동정렬 확장 프로그램 설치 

    Prettier 검색해서 Install

     

    설치가 완료되었으면 Control + Shift + P 

    방금 설치한 프리티어라는 확장프로그램을 좀더 제대로 쓰기 위해 VSCode의 세팅을 바꿔볼 것

     

    UI 클릭하기 

    format on save 검색해서 체크박스에 체크해주기 (저장버튼 눌렀을 때 파일 포맷팅하라는 것) 

     

     

    +) 파일의 확장자 아이콘 

    Control + shift + P 

     

    Material Icons: Activate Icon Theme을 클릭해주면  

     

    이런식으로 아이콘이 뜬다! 

     

     

    Reference https://goddaehee.tistory.com/287

     

    [ VSCode ] Visual Studio Code 설치하기(및 추천 플러그인 설치)

    [ VSCode ] Visual Studio Code 설치하기(및 추천 플러그인 설치) 안녕하세요. 갓대희 입니다. 이번 포스팅에선 Visual Studio Code를 설치 해보려 합니다. :- ) 웹개발을 하다보면 어떤 IDE를 사용할지 고민하곤

    goddaehee.tistory.com

    'Programming > 개발 툴' 카테고리의 다른 글

    인텔리제이에서 Junit 사용하기  (0) 2023.06.04
    인텔리제이 메모리  (0) 2023.02.28
    PuTTY 다운로드 및 설치하기  (0) 2022.08.05
    [IntelliJ/인텔리제이] Spring에서 html,css,js,jsp 페이지 새로고침할 때 서버 재기동 없이 리로드하기  (0) 2022.06.14
    [IntelliJ] 인텔리제이 Spring MVC 프로젝트 설정을 STS 기준으로 바꾸기  (0) 2022.03.24

    댓글

    관련글

    • 인텔리제이에서 Junit 사용하기 2023.06.04
    • 인텔리제이 메모리 2023.02.28
    • PuTTY 다운로드 및 설치하기 2022.08.05
    • [IntelliJ/인텔리제이] Spring에서 html,css,js,jsp 페이지 새로고침할 때 서버 재기동 없이 리로드하기 2022.06.14
    맨 위로
전체 글 보기
Tistory 로그인
Tistory 로그아웃
로그아웃 글쓰기 관리

Today

Total

Powered by ⓒ Kakao Corp.

Designed by Nana
블로그 이미지
개발도비

티스토리툴바