vscode4 VSCode 웹 개발 시작하기 - Live Server로 만드는 '니' 첫 번째 웹 페이지 HTML 웹 개발을 진행할 때는 웹 브라우저에서 실시간으로 결과를 확인하며 작업하는 것이 가장 정확합니다.아직 설치하지 않았다면, 이전 글에서 설명한 Live Server 설치 방법을 참고하세요.HTML 초보자를 위한 VSCode 확장 추천간단한 HTML 페이지를 작성해보자.바탕화면에 만든 HTML 폴더를 VSCode에서 'Open Folder' 버튼을 통해 열어줍니다. 첫 번째 새 파일 아이콘을 클릭하여 index.html 파일을 생성합니다. index.html 파일을 선택한 후, 오른쪽 코딩 창에 "Hello World!"를 입력합니다.이후, Ctrl + S를 눌러 저장합니다. 그리고 우측 하단의 'Go Live' 버튼을 클릭합니다.(Live Server 단축키: Alt + L, Alt + O) 웹 .. 2024. 11. 9. VSCode 언어별 들여쓰기(탭) 지정 - Settings.json 코드 스타일에서 중요한 요소 중 하나는 들여쓰기 규칙입니다. 최근에는 탭 대신 공백을 사용하여 일관된 서식을 유지하는 것이 일반적인 추세입니다. 과거에는 문서 작성 시 기본 탭 크기를 8칸으로 설정했고, 코드에서는 깊이를 줄이기 위해 4칸 들여쓰기를 주로 사용했습니다. 그러나 탭 크기를 줄이면서 줄 맞추기 효과가 줄어들었고, 각기 다른 에디터나 사용자가 설정한 탭 크기에 따라 문서 포맷이 혼란스러워지는 문제가 발생했습니다. 이러한 문제를 해결하기 위해 탭 대신 공백으로 들여쓰기를 처리하는 방식이 도입되었습니다. 특히 HTML과 같이 들여쓰기가 많은 경우에는 탭 크기를 2칸으로 설정해 더 깔끔하게 표현하는 것이 일반적입니다.VSCode 들여쓰기 설정VSCode 설정 파일에는 사용자 모드와 작업 영역 모드 .. 2024. 11. 8. HTML 초보자를 위한 VSCode 확장 추천 VSCode는 웹 개발에 최적화된 강력한 툴입니다.로컬 환경에서는 물론이고, 원격 서버에서 작업할 때도 마치 로컬에서 작업하는 것처럼 빠르고 편리하게 사용할 수 있습니다. 이번 글에서는 VSCode 설치부터 시작해, HTML 개발에 필요한 확장을 설치해보겠습니다. VSCode 설치https://code.visualstudio.com/ HTML 개발에 필요한 VSCode 확장을 최소한으로 설치해봅시다.앞으로 진행하면서 필요할 때 추가합니다. 확장 설치 아이콘은 좌측에 있습니다. 1. 코드 포메팅VSCode는 HTML 코드 포메팅을 지원한다. (Alt + Shift + F) 2. Auto Rename TagHTML을 작성하다보면 태그 앞뒤 맞추기가 항상 번거롭고 불편하다.이것을 자동화해주는 확장이다. 3. .. 2024. 10. 28. VSCode 터미널에서 도커 컨테이너 사용 중 빠져나오기. VSCode 터미널에서 도커 컨테이너 사용중 빠져나오기도커 컨테이너 종료 없이 빠져나오려면 ctrl+p, ctrl+q 를 입력해야하는데VSCode에서는 해당 명령어가 다른 기능으로 맵핑되어 있다.터미널에서 입력할 때에는 해당 기능을 제외하려면 아래 설정이 필요하다. 터미널 사용중일 때 해당 키 바인딩 사용을 제외한다.그러면 도커에서 제공하는 키 바인딩이 동작한다. 메뉴 위치File -> Preferences -> Keyboard Shortcuts. CommandKeybindingWhenSourceGo to File...Ctrl + P!terminalFocusUser CommandKeybindingWhenSourceworkbench.action.quickOpenViewCtrl + Q!terminalFocu.. 2024. 5. 19. 이전 1 다음
