물멍IT

[Web] - html기초(0)_Visual Studio Code 확장팩 본문

Web

[Web] - html기초(0)_Visual Studio Code 확장팩

derlung 2020. 2. 19. 14:43

 

웹 언어 관련하여 여러가지 에디터들이 있지만

나는 visual studio code를 사용한다. (이유는 그냥 첨에 이걸로 배웠기 때문...)

visual studio code 에디터를 더 편리하게 사용하도록 확장팩을 깔아보자

나는 기본적으로 확장팩 두가지를 사용한다.

1. korean -language -pack

2. Live server

 

1. KOREAN- LANGUAGE-PACK

처음으로 visual stduio code를 실행하면 영어표기로 환경 설정 되어있을 거다. 

굳이 해석하는 번거로움을 덜도록 한국어 패치를 적용하자

맨 왼쪽 세로메뉴바에 블록을 클릭하면 확장팩을 설치받을 수 있다.

korean이라 검색 후 지구본 모양의 [install]를 눌러주면 설치끝이다.

바로 반영 안되므로, 프로그램을 껐다가 재부팅하면 한글로 변경되어있는 것을 볼 수 있다.

 

역시 한국인은 한글이 편하다. (흐뭇)

 

2. Live server

html 코드를 변경할때마다 실시간으로  해당 페이지에 바로 적용되는 확장팩이다.

방법은 위와 동일하다.

확장팩 설치(마켓플레이스)로 가서 live server를 검색하고 install 클릭하면 프로그램을 재부팅하면 끝

 

- 간단한 연습을 해보자

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  <title>연습1</title>
</head>

<body>
  <h1>HI HTML</h1>
</body>

</html>

위의 코드는 화면에 HI HTML을 출력하는 아주 간단한 코드이다.

 

페이지를 켜둔 상태에서 html 코드를 'CHANGE~'로 변경하고 '저장'하면 굳이 새로 페이지를 열지 않아도 

열어둔 페이지에 바로 반영된다.

 

 

 

'Web' 카테고리의 다른 글

[Apache-Tomcat] - 톰캣 설치 및 이클립스 연동  (0) 2020.04.15
[Web] - html기초(1) _ 역할과 기본구성  (0) 2020.02.17
'Web' Related Articles more