어제 오늘 내일

VSCode 에디터의 글자 크기는 디폴트로 settings.json 파일에 정의된 크기로 고정됩니다. 하지만, Ctrl 키와 마우스 휠 스크롤로 크기를 조절할 수 있도록 설정할 수 있습니다. 1. 설정 메뉴에 들어갑니다. 다음 중 한가지 방법을 선택하여 설정 메뉴에 들어갑니다. File > Preperences > Settings 메뉴 이용 화면 왼쪽 하단의 톱니바퀴 모양의 '설정' 아이콘 이용 단축키 : Ctrl + , 이용 2. User > Text Editor > Mouse Wheel Zoom 이 항목의 체크박스를 체크하면 마우스 휠로 텍스트 에디터를 확대/축소 할 수 있습니다. 텍스트 에디터에서 Ctrl 키를 누른 채로 마우스 휠을 위아래로 조작하면 화면이 확대/축소 됩니다. (Ctrl + 마우스..

프로그래밍을 할 때 들여쓰기를 어떻게 하느냐는 가독성을 위해 중요한 문제입니다. space 2칸, 4칸, 또는 Tab을 사용하는 것 중 어느 것을 선택해도 문제가 없지만 중요한 것은 일관성을 유지하는 것입니다. 그래서, 지금 사용한 indent가 3칸인지, 4칸인지, Tab인지를 확인하는 것이 중요합니다. 여기서는 VSCode에서 공백 문자를 표시해 주는 기능을 활성화 해 보도록 하겠습니다. 1. 설정 메뉴에 들어갑니다. 다음 중 한가지 방법을 선택하여 설정 메뉴에 들어갑니다. File > Preperences > Settings 메뉴 이용 화면 왼쪽 하단의 톱니바퀴 모양의 '설정' 아이콘 이용 단축키 : Ctrl + , 이용 2. User > Text Editor > Render Whitespace 아..

기본적으로 VSCode는, 파일 수정 후 사용자가 '저장'을 실행하야만 파일이 저장됩니다. VSCode는 사용자가 파일 저장을 따로 실행하지 않아도 파일이 수정되면 자동으로 저장이 되도록 설정할 수 있습니다. 1. Setting(설정) 메뉴에 들어갑니다. 다음 중 한가지 방법을 선택하여 설정 메뉴에 들어갑니다. File > Preperences > Settings 메뉴 이용 화면 왼쪽 하단의 톱니바퀴 모양의 '설정' 아이콘 이용 단축키 : Ctrl + , 이용 2. User > Text Editor > Files Auto Save, Auto Save Delay 속성을 이용하여 자동 저장을 설정할 수 있습니다. Auto Save Auto Save 속성은 다음의 값들을 가질 수 있습니다. off : 자동 저..

VSCode로 작업을 하다 보면 왼쪽의 파일 트리에서 파일을 선택하여 오픈할 때 선택한 파일이 '새 탭'에서 열리는 것이 아니라, 기존에 다른 파일이 열려 있던 탭에, 새로 선택한 파일이 열려서 난감한 일이 발생하기도 합니다. 이런 일이 생기는 이유와 해결 방법을 알아보도록 하겠습니다. Preview(미리보기) 모드 vs Edit(편집) 모드 VSCode의 explorer에서 파일을 여는 방법은 preview모드와 edit모드 두 가지가 있습니다. 왼쪽의 file explorer에서 파일을 '더블 클릭'해서 열면 'edit(편집) 모드'로 파일이 열리고, '싱글 클릭'으로 파일을 열면 'preview(미리보기) 모드'로 파일이 열립니다. preview 모드로 열린 파일은 이탤릭체로 표시됩니다. 아래에서 ..

VSCode의 터미널 배경색과 글자색을 변경하는 방법입니다. 1. 설정 메뉴에 들어갑니다. 다음 중 한가지 방법을 선택하여 설정 메뉴에 들어갑니다. File > Preperences > Settings 메뉴 이용 화면 왼쪽 하단의 톱니바퀴 모양의 '설정' 아이콘 이용 단축키 : Ctrl + , 이용 2. User > Workbench > Appearance > Color Customization Edit in settings.json 링크를 클릭하여 settings.json 파일을 엽니다. 3. "workbench.colorCustomizations" 속성을 정의합니다. workbench.colorCustomizations 속성 안에 터미널의 배경색과 글자색을 정의합니다. workbench.colorCu..

VSCode의 터미널 출력 버퍼(buffer) 크기를 조정하는 방법입니다. 1. Setting 메뉴에 들어갑니다. File > Preperences > Settings 메뉴 이용 화면 왼쪽 하단의 톱니바퀴 모양의 '설정' 아이콘 이용 단축키 : Ctrl + , 이용 2. User > Features > Terminal > Integrated:Scrollback 항목 설정 기본값은 1000으로, 터미널의 버퍼에 저장하여 보여줄 수 있는 최대 라인 수입니다. 여기서는, 값을 3000으로 늘려서 저장하였습니다. 보통 '-1' 또는 '0'을 입력하는 경우, 버퍼 사이즈를 무제한으로 지정할 수 있는 옵션이 있는 에디터들이 많은데, 여기서는 무제한 버퍼 사이즈는 제공하지 않으므로, 반드시 필요한 만큼 버퍼 사이즈를..

VSCode에서 사용하는 터미널의 폰트를 변경하는 방법입니다. 터미널 폰트설정은 VSCode의 설정 메뉴에서 할 수 있습니다. 1. 설정 메뉴에 들어갑니다. 설정 메뉴에 접근하는 방법은 여러가지가 있습니다. File > Preperences > Settings 메뉴 이용 화면 왼쪽 하단의 톱니바퀴 모양의 '설정' 아이콘 이용 단축키 : Ctrl + , 이용 2. User > Features > Terminal Integrated: Font Family 항목에 폰트를 지정합니다. 예제에서는 '나눔바른펜' 폰트를 지정하여 터미널의 폰트가 변경된 것을 확인 할 수 있습니다. 폰트 외에도 다음 속성들을 지정하여, 폰트, 사이즈, 굵기, 자간, 줄간격 등을 설정할 수 있습니다. Integrated: Font Fa..

기본적으로 VSCode의 windows default 터미널은 powershell로 설정되어 있습니다. (터미널이 열려있지 않다면, 메뉴에서 Terminal > New Terminal 을 선택하여 터미널을 열 수 있습니다.) 이 default 설정을 변경하여 VSCode의 터미널에서 powershell 대신 cmd를 사용할 수 있도록 하는 방법을 알아보도록 하겠습니다. 설정하는 2가지 방법이 있는데, 사실 둘 다 VSCode의 같은 부분의 설정을 변경합니다. 다만, UI에서 어떻게 접근하느냐만 다를 뿐입니다. Setting에서 직접 변경하기 1. File > Preperences > Settings 메뉴를 선택 2. User > Features > Terminal > Integrated>Shell:Win..

command 창에서 vscode 를 실행하기 위해서는 다음과 같은 구문을 사용합니다. code [열고자 하는 파일 또는 폴더 경로] 위와 같이 command 창에서 'code [열고자 하는 파일명 또는 폴더]'를 입력하면 vscode가 실행되면서, 지정된 파일 또는 폴더를 오픈합니다. 위 이미지에서는 'code .'를 실행하여 현재 위치 프로젝트를 vscode로 열었습니다. 간단하게 command 창에서 vscode를 여는 방법을 알아보았습니다.

지난 번에는 사용자가 로컬에서 파일을 선택하고, 그 파일 내용을 읽어오는 방법을 알아보았습니다. [HTML] input type='file' 속성 알아보기 ( 파일 입력 ) [HTML] input type='file' 속성 알아보기 ( 파일 입력 ) 웹페이지에서 사용자의 로컬 파일을 입력받기 위해서는 다음과 같이 input 태그의 type속성을 file로 지정하는 방법을 사용합니다. See the Pen read file by anna (@hianna) on CodePen. 여기에서는 input의 type.. hianna.tistory.com [Javascript] 로컬 텍스트 파일 읽기 (다중 파일 선택) [Javascript] 로컬 텍스트 파일 읽기 (다중 파일 선택) HTML/Javascrip로 로..