You Can Become A
늦게 시작해도 누구든지 노력하면 개발자가 될수 있어요 !
![[VSCode] 💽 코딩 폰트를 바꿔보자 (D2coding / Fira)](https://img1.daumcdn.net/thumb/R750x0/?scode=mtistory2&fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2FcmKD7Y%2FbtrmvewgD2b%2F3IHNa1bPfLBeP4pHKDeS1k%2Fimg.png)
[VSCode] 💽 코딩 폰트를 바꿔보자 (D2coding / Fira)
D2coding 네이버에서 오로지 개발을 위해서 만든 폰트이기 때문에 당연히 개발할 때 폰트 가독성이 상당히 뛰어나다. d2codingfong 깃헙(github)에 들어가서, 최신 릴리즈(현재자 Ver 1.3.2)를 선택 후, D2Coding으로 시작하는 zip 파일을 선택하여 다운로드 한다. Releases · naver/d2codingfont D2 Coding 글꼴. Contribute to naver/d2codingfont development by creating an account on GitHub. github.com 위 폰트 설치 화면에서 설치를 클릭하여 D2Coding 폰트를 설치한다. vscode - preferences - settings에서 'font'를 검색해준 후 'Edit in ..
![[VScode] 💽 터미널에 cmder 사용하는법](https://img1.daumcdn.net/thumb/R750x0/?scode=mtistory2&fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2FLHa1X%2FbtrmjbNDVat%2F1rOhsPs1DziKajmlQ8tiX0%2Fimg.png)
[VScode] 💽 터미널에 cmder 사용하는법
VS Code에서 cmder 사용 vs code의 터미널을 칙칙한 bash나 cmd가 아닌 알록달록한 다 기능의 cmder을 설정하는 법을 포스팅 해본다. 1. Cmder 다운 [CMDER] 💽 cmder 설치 & 설정 (+문자깨짐 해결법) Cmder Cmder는 윈도우가 기본으로 제공하는 CMD 환경을 git을 사용하는데 최적화한 프로그램이다. git은 Command 를 이용하여 사용하는 것이 모든 기능을 충분히 사용할 수 있는 방법이기 때문이다. 다 inpa.tistory.com Cmder | Console Emulator Total portability Carry it with you on a USB stick or in the Cloud, so your settings, aliases and hi..
![[VSCode] 💽 Project Manager 익스텐션 사용법](https://img1.daumcdn.net/thumb/R750x0/?scode=mtistory2&fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2FvDzVT%2FbtrqVvffmq5%2FREyjW8SYKkCKD3RpKTPDyk%2Fimg.png)
[VSCode] 💽 Project Manager 익스텐션 사용법
프로젝트 매니저 사용이유 이클립스나 비주얼스튜디오 같은 경우 보면, 프로젝트를 생성할 때마다 프로젝트명으로 알아서 폴더를 생성해주고 관리를 해준다. 그런데 비주얼스튜디오코드는 사실 개발환경이라기보단 편집기에 가까워서, 내가 다른 프로젝트로 변환하려면 폴더로 직접 이동해 드래그 해서 워크스페이스에 가져오는 방법밖에 없다. 폴더별로 project 들이고 폴더별로 배포를 진행하니 점점 더 많아질 수 밖에 없다. 수동으로 폴더 전환을 Open Folder 로 하면 번거롭고 해당 폴더별로 열려있던 파일도 다 닫아야 하고 아주 귀찮다 위처럼 자주 사용하는 프로젝트들을 저장해 편집기 내에서 목록으로 쉽게 관리하고 간편하게 스위칭 해주는 기능을 제공하는게 Project Manger 익스텐션 이다. 한마디로 요약하자면 ..
![[VSCode] 💽 BookMarks 익스텐션 사용법 - 코드에 북마크를 걸자](https://img1.daumcdn.net/thumb/R750x0/?scode=mtistory2&fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2FrlNwF%2FbtrqNL4JB5S%2FmPrPbPD0PkXyM5qEh5rfb0%2Fimg.png)
[VSCode] 💽 BookMarks 익스텐션 사용법 - 코드에 북마크를 걸자
bookMarks 확장팩 브라우저에서 사이트를 북마크하면, 나중에 메뉴에서 찾아 클릭만 하면 바로 그 사이트로 이동한다. 이것 역시 특정 코드 줄에 북마크를 지정해, 메뉴에서 바로 찾아들어가는 기능을 제공해준다. 북마크 추가하기 해당 라인을 클릭하고, 마우스 우 클릭 후, Bookmarks -> Toggle을 클릭하면 왼쪽에 북마크 표시가 뜰 것이다. 이제 메뉴에서 원하는 북마크를 참고할 수 있다. 북마크 단축키 변경 File>>Preferences>>keyboard shortcuts를 선택하거나 Ctrl-K Ctrl-S를 차례로 누른 후 Bookmark로 검색하고 적당한 단축키로 변경해 줍니다.
![[VScode] 💽 새파일 / 새폴더 단축키 설정하는 법](https://img1.daumcdn.net/thumb/R750x0/?scode=mtistory2&fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2FvtJd0%2FbtrkAiUyA62%2FE8RTIUYcTqRCs4ZSgPNp81%2Fimg.png)
[VScode] 💽 새파일 / 새폴더 단축키 설정하는 법
Visual Studio Code를 사용하면서 새파일, 새폴더를 만드는 방법이 너무 까다롭다는 생각이 들었다. 일일이 new File, new Folder등을 마우스로 클릭하는 작업말이다. 그에반해 IntelliJ에서 개발을 진행할 떄는 ctrl+n, ctrl+shift+n등을 통해 새파일 새폴더등을 만들수 있었는데 말이다. 이번 시간에는 새폴더/새파일 에 대한 단축키 추가 설정을 포스팅 해본다. 1. ctrl + shift + p를 누르고 Open keyboard Shortcuts (JSON) 으로 들어가 설정한다. Default가 아니다. 유의하자 2. 그리고 다음 처럼 작성해주면 된다. [ { "key": "ctrl+n", "command": "explorer.newFile", "when": "!e..
![[VSCode] 💽 터미널 알록달록하게 꾸미기](https://img1.daumcdn.net/thumb/R750x0/?scode=mtistory2&fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2Fci80Al%2Fbtrjudmo0ex%2FzkUMOpVpSLcO13EDSbycM0%2Fimg.png)
[VSCode] 💽 터미널 알록달록하게 꾸미기
VSCode 내장 터미널 하이라이팅 이번 시간에는 vscode 터미널을 알록달록하게 꾸며보는 법을 살펴볼 것이다. 1. 터미널 색깔 템플릿 고르기 해당 사이트에서 여러 터미널 색깔 템플릿을 고를 수 있다. 좌측 nav메뉴에서 원하는 템플릿을 고르고, Copy to clipboard를 클릭하자. Base16 Terminal Colors for Visual Studio Code glitchbone.github.io 2. setting.json 파일을 열기 3. 데이터를 setting.json에 추가하기 "workbench.colorCustomizations": { "terminal.background":"#1D2021", "terminal.foreground":"#A89984", "terminalCursor..
![[VSCode] 💽 터미널 ↔ 에디터 포커스 전환 단축키 설정하기](https://img1.daumcdn.net/thumb/R750x0/?scode=mtistory2&fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2FRBxP0%2Fbtrjisq0nFI%2FkOajmz9vS8LaEZpKE44HPK%2Fimg.png)
[VSCode] 💽 터미널 ↔ 에디터 포커스 전환 단축키 설정하기
터미널 ↔ 에디터 간편 전환하기 개발을 할때, 터미널과 코드 에디터 사이를 포커스 전환을 할 경우가 많이 생긴다. vscode에는 따로 이 기능에 대한 단축키를 지원하지 않아 우리가 직접 구현해주어야 한다. 1. ctrl + shift + p를 누르고 Open keyboard Shortcuts (JSON) 으로 들어가 설정한다. Default가 아니다. 유의하자 2. 그리고 다음 처럼 작성해주면 된다. 필자는 ctrl + ; 로 두 창을 손쉽게 전환하도록 설정하였다. // 키 바인딩을 이 파일에 넣어서 기본값 재정의 [ // Place your key bindings in this file to override the defaultsauto[] { "key": "ctrl+;", "command": "te..
![[VSCode] 💽 설정 동기화 하기 👪 - 다른 컴퓨터에서도 같은 코딩환경을 구축](https://img1.daumcdn.net/thumb/R750x0/?scode=mtistory2&fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2FSudoW%2FbtrgdGLVmWK%2Ffk6i44XoI9dckKJ5gCjTT0%2Fimg.png)
[VSCode] 💽 설정 동기화 하기 👪 - 다른 컴퓨터에서도 같은 코딩환경을 구축
설정 동기화 기능 설정 동기화를 사용하면 설정, 키 바인딩 및 설치된 확장과 같은 Visual Studio Code 구성에 대해서 변경이 있을 때 마다 백그라운드로 Microsoft 계정이나 github계정에 저장해 놨다가 필요할 때(다른 컴퓨터나 아니면 컴퓨터를 포맷 후 다시 VScode를 사용할 때) 다시 복구해서 동일한 환경을 한번에 구현해 주는 기능입니다. 설정이 변경되든지, 키 바인딩을 변경하던지 확장프로그램을 설치 또는 삭제 하면 자동으로 업데이트를 해 줍니다. 설정 동기화 실행하기 설정 동기화는 파일 > 기본 설정 > 설정 동기화 를 실행하면 됩니다. 아래와 같이 동기화 할 항목을 선택하는 창이 뜹니다. 5가지 종류를 동기화 해줍니다. 1번 GitHub 계정을 선택하면 신규 또는 로그인을하여..
![[VS Code] 💽 Prettier 도구 설정법 - 한방 코드 포맷터](https://img1.daumcdn.net/thumb/R750x0/?scode=mtistory2&fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2FbsCqZi%2FbtrfqgPox9e%2FdlI06kd2kI9Ahj4xGVaEKK%2Fimg.jpg)
[VS Code] 💽 Prettier 도구 설정법 - 한방 코드 포맷터
VSCode - Prettier Visual Studio Code에서는 사용자 편의를 위해 코드의 줄 간격이나 행을 자동으로 깔끔하게 정리해주는 확장프로그램이 존재한다. 설치를 완료하면, 에디터 밑부분에 Prettier: ✔ 표시가 되어있다면 활성화된 것이다. Prettier - Code formatter - Visual Studio Marketplace Extension for Visual Studio Code - Code formatter using prettier marketplace.visualstudio.com Prettier 설정 Format on Save 확인 vscode 설정에서 format on save를 입력하고 나오는 설정에 체크되어 있는 지 확인한다. 이 기능은 항상 저장을 할때마다..
![[VSCode] 💽 주석 단축키 (Ctrl + /) 가 안될때](https://img1.daumcdn.net/thumb/R750x0/?scode=mtistory2&fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2F0EL6k%2FbtrfzkKct5Q%2FVRY9u6YfNaO67jIYT0j0L0%2Fimg.png)
[VSCode] 💽 주석 단축키 (Ctrl + /) 가 안될때
vscode에서 Ctrl + /로 편하게 주석을 씌울 수 있다. 그러다 어느날 뭘 잘못만졌는지, 주석 단축키가 먹통이 되버려서 굉장히 당황스러웠는데, 그 해결 방법을 포스팅 해본다. 해결 방법은 간단하다 작업표시줄에 언어입력기에서 Microsoft 입력기 로 설정하면 해결 된다.
