Visual Studio Code 자바스크립트 실행 확인 가능하도록 추가 설치

자바스크립트를 Visual Studio Code를 이용하여 작성하였을 때 제대로 작성되었는지 확인을 하기 위해 추가로 Node.js를 설치해야 합니다. Node.js의 설치 파일 다운로드 방법과 설치 방법에 대해 알아보겠습니다.

 

Visual Studio Code 설치

Visual Studio Code 설치

 

1. Node.js 설치 파일 다운로드

 인터넷 주소 https://nodejs.org/ko/download/로 이동합니다.

 

[그림 1] Node.js 설치 파일 다운로드 사이트

[그림 1]과 같이 화면이 뜨는데 자신의 OS에 맞는 파일을 클릭하시면 다운로드됩니다. 저는 윈도우즈 64bit이므로 Windows Installer(. msi)의 64-bit를 클릭하여 다운로드하였습니다.

 

 

 

 

여기서 저는 현재 윈도7을 사용하고 있는데 다운로드 받은 파일은 윈도우 8.1 이상에서 사용 가능합니다.

그래서 [그림 1]의 화면에서 아래로 내려가면 이전 버전의 파일을 다운로드할 수 있습니다.

 

[그림 2] 이전 버전 설치파일 다운로드

[그림 2]의 빨간색 사각형으로 표시된 이전 릴리스를 클릭하면 이전 버전 파일 목록이 출력됩니다.

 

[그림 3] 이전 버전 설치파일 목록

[그림 3]과 같이 이전 버전 설치 파일 목록이 뜨는데 저는 Node.js 13.x를 클릭하였습니다.

 

[그림 4] 설치 파일 선택

[그림 4]와 같이 화면이 뜨면 node-v13.14.0-x64.msi 파일을 클릭하여 다운로드합니다.

 

 

 

2. Node.js 설치 하기

이제 다운로드한 파일을 더블클릭하여 실행합니다.

 

[그림 5] Node.js 설치 시작 화면

[그림 5]와 같은 화면이 뜨면 Next 버튼을 클릭합니다.

그리고 다음에 뜨는 화면은 License 동의, 설치 위치 확인, 설치할 항목 선택 등의 창이 뜨는데 변경 없이 그냥 Next 버튼을 클릭하셔서 설치해주시면 됩니다. 

 

 

[그림 6] 설치 완료 화면

설치가 끝나면 [그림 6]과 같이 설치가 완료되었다는 창이 뜹니다.

 

이제 Visual Studio Code를 실행합니다.

 

[그림 7] Visual Studio Code 확장 프로그램 설치

Visual Studio Code 창이 열리면 [그림 7]의 1번 표시가 된 확장 프로그램 설치 아이콘을 클릭합니다.

그리고 2번 표시가 된 사각형 안에 'code runner'라고 입력하면 아래에 Code Runner가 뜹니다. 그러면 3번으로 표시된 항목을 마우스 클릭하면 우측 창에 설치 버튼이 나타나는데 이 버튼을 마우스 클릭하여 설치합니다.

 

모든 설치가 완료되면  Visual Studio Code를 종료해주고 다시 실행합니다.

이제 새 파일을 열고 자바스크립트 코딩을 하고 .js 파일로 저장해 줍니다.

 

[그림 8] 자바스크립트 코드 실행 결과

 

자바스크립트 코드를 작성한 화면은 [그림 8]과 같습니다. 그 상태에서 Ctrl + Alt + N을 클릭하거나 화면 우측 위의 화살표([그림 8]의 1번 표시)를 클릭하면 아래에 실행 결과([그림 8]의 2번 표시)를 알려줍니다.

 

 

 

이 포스팅은 쿠팡 파트너스 활동의 일환으로, 이에 따른 일정액의 수수료를 제공받습니다.