본문 바로가기

Development/Editor11

VSCode - Comment 단축키(Ctrl + /) 안될 때 Visual Studio Code에서 잘 사용하던 단축키가 동작하지 않을 때 정말 답답합니다.특히, 저 같은 경우 커멘트(주석) 단축키가 그런 것 같습니다. 당황하지 마시고, 윈도우 우측 하단바에서 자판(키보드 타입)을 변경주면 정상 동작합니다. 간혹, 국책프로젝트 문서 작성때문에 한컴 한글이 설치되어 있는데 이것때문에 발생하는 현상같습니다.  "한컴 입력기"를 "Microsoft 입력기"로 변경해 주세요. 2024. 5. 14.
VS Code Keyboard shortcuts for Linux 간단한 편집용으로 사용하던 VSCode를 이제 메인 개발편집기로 사용하고 있습니다. 이것 저것 확장프로그램을 설치해서 사용하다 보니 거의 통합개발환경(IDE) 수준으로 사용하게 되는 것 같습니다. C/C++, Rust, JavaScript/TypeScript 프로그램 개발도 모두 VSCode를 사용하는데 두뇌 노후화로 인해 자주 사용하는 단축키를 깜빡깜빡 잊어먹는 경우가 있어서 별도로 VSCode 사이트에 있는 내용을 발췌하여 정리해 봅니다. General Shortcut Description Ctrl+Shift+P, F1 Show Command Palette Ctrl+P Quick Open, Go to File... Ctrl+Shift+N New window/instance Ctrl+W Close wi.. 2023. 4. 9.
VSCode - 에디터 파일 탭이 하나만 보일 때 VSCode를 사용하다 보면 여러 파일을 열었는데도 하나의 파일 탭에서만 열리는 경우가 있습니다. 이럴 때 흥분하지 마시고 에디터 설정을 확인해 주세요. or File > Preferences > Setting User > Workbench > Editor Management "Enable Preview"와 "Enable Preview From Quick Open" 속성의 체크를 해제합니다. 2023. 3. 19.
VSCode(Visual Studio Code) 쓸만한 Extensions Live Server 웹 프로그래밍할 때 코드 수정 결과를 브라우저의 새로고침을 하지 않고도 실시간으로 확인할 수 있게 해 주는 확장프로그램입니다. Prettier 단축키로 설정 창으로 이동 후 아래 처럼 설정합니다. 에디터에서 탭(Tab) 크기를 변경하시려면 아래 처럼 설정해 주세요. Single Quote를 사용하고 싶으시면 아래처럼 설정해서 사용하시면 됩니다. Auto Rename Tag HTML 작업할 때 여는 태그나 닫는 태그를 수정하면 쌍을 이루는 태그를 자동으로 수정해 주는 기능을 제공합니다. Material Theme Material Icon Theme CSS Peek HTML 작성 시 CSS에 정의한 스타일 파일로 바로 이동하고 싶을 때 유용합니다. HTML CSS Support HTML.. 2023. 2. 27.
VSCode - User Snippets 사용하기 (반복 구문 단축키 설정) VSCode 로 프로그래밍을 하다 보면 자주 사용하는 패턴이 있습니다. 매번 반복하다 보면 손가락에 피로도가 쌓일 수 있는데 이걸 좀 덜어줄 수 있는 팁이 있습니다. 즉, 자주 사용하는 구문을 단축키로 등록해서 사용하는 방법입니다. 명령어 팔렛트(Ctrl+Shift+P)에 들어가셔서 "snippets"를 입력하신 후" Configure User Snippets"를 선택하세요. 다음 화면이 뜨면 자바스크립트 JSON 파일을 선택해 주세요. 그럼, 주석문을 참고하셔서 단축키로 지정하고 싶은 구문을 작성해 주시면 됩니다. { // Place your snippets for javascript here. Each snippet is defined under a snippet name and has a prefi.. 2023. 2. 4.
Plant UML 설치하기 Plant UML은 사용자가 Plain Text 언어로부터 UML 다이어그램을 작성할 수 있는 오픈 소스 기반의 도구입니다. 텍스트 기반이기 때문에 생각보다 쉽게 작성할 수 있고 기 작성된 다이어그램을 별도의 툴 없이 웹이나 에디터에 플러그인(혹은 확장팩)를 설치하여 언제든지 유지보수가 가능하다는 장점이 있습니다. 깃허브를 통해 오픈소스로 제공하고 있으며 최근까지 업데이트가 되고 있습니다. (https://github.com/plantuml/plantuml) 설치 Visual Studio Code 에서 플러그인(Extension)을 통해 설치할 수 있습니다. Visual Studio Code에서 파일을 생성한 후 +D 로 UML을 바로 생성할 수 있습니다. Preview가 표출되지 않는다면 JRE(Jav.. 2022. 9. 6.