비쥬얼 스튜디오 코드(VS Code) 기본 세팅 확장프로그램 및 설정 // 자주쓰는 단축키 메모

https://code.visualstudio.com/

Visual Studio Code - Code Editing. Redefined

다운로드는 위에서
보라색 있고 파란놈 있는데
헤비한 개발자 아닌 이상 걍 새파랗고 라이트하고 무료인 Visual Studio Code 깔면 됨

(1) 확장프로그램

1. 한국어 (영잘알 아닌이상... 영잘알이어도 안 그래도 안 익숙해 뒤지겠는데 개빡치는 지점 존재함)
2. Livs Sass Compiler - scss 파일을 자동으로 css로 변환해 줌
3. Live Server - 브라우저에서 열기 + 새로고침 의 고통을 끝내 줌 (파일에 변경사항이 일어나서 저장된 경우 자동으로 새로고침 해서 보여줌)
4.open in brower - 브라우저 실행 단축키 (alt + b) 근데 3번 쓰면 쓸 일이 거의 0에 수렴하게되긴 함

-----------------

확장프로그램 설명

1. scss 

하단 파란 상태표시바에서 Watch Sass 를 클릭해주면 된다
그러면 scss 파일을 저장할 때 마다 자동으로 css 파일을 생성해줌
종료도 마찬가지로 저 Watching 된걸 클릭해주면 됨

2. 브라우저 단축 실행키 Alt + b
윈도우 시스템에서 기본 브라우저로 등록된 인터넷브라우저로 실행해줌

 

3.Live Server (★노동 이제 굳베이)

단축키보다는 우측 탐색기 (Ctrl + B) 에서 우클릭으로 하는걸 많이 하는듯

 

--------------------

기본 설정 관련

(0) 비쥬얼 스튜디오 코드 환경설정 어디서?
파일(F) > 기본설정 > 설정(Ctrl + ,)

 

 

 

-------------------

 

3. 단축키 관련

(0) 폴더 열기 Ctrl K + Ctrl O (파일 > 폴더열기)
조금 느긋하게 한,둘,셋,넷 느낌으 컨>케>컨>오 순차적으로 누르셈
폴더열기가 필요한 이유 : 탐색기에서 파일 구조 보기가 용이

(1)내어쓰기
- 가끔 복붙하다보면 미친듯이 들여쓰기 되서 정리해줘야 할 때 있음
그럴땐 드래그 쭉 해서 Shift + Tab

- 가끔 특정문단 이하에서 한 탭씩 들여쓰기 되서 붙여지는 경우가 있음.
또는 일단 복붙 해보고 Ctrl + Z 눌러보셈 그럼 알아서 붙음

(2) 복붙할 문장에 커서를 클릭한 상태로 Alt + Shift + Tab : 윗문장/문단 그대로 복사
컨트롤씨 컨트롤복붙 할 에너지 없을때 또는 드래그하다가 눈 돌아가서 영역 지정에 자신 없을때, 이상한 들여쓰기 효과 개 빡칠 떄 (이것도 어디 설정에서 할 수 있을 것 같은데 귗낳다..)

(3)자동 서식 정렬 (메모장에서 한 문장 너무 길면 가로 스크롤바 생기는데 서식 > 자동줄바꿈 하면 자동으로 정리 하는 그거)
Alt + Z

(4) ( 찾기 > 모두 바꾸기 )
텍스트 편집기 바꿀내용 드래그 하고 우클릭 > 모든항목 변경 (Ctrl + F2)

(5) 편집기 측면에서 열기 (분할 화면) Ctrl + Enter
(6) 측면 화면 오가기 Ctrl + 숫자패드