Visual Studio Code에서 Deno 프로젝트 시작하기

 

Deno는 Ryan Dahl에 의해 만들어진 모던한 JavaScript/TypeScript 런타임입니다. Node.js의 창시자로 알려진 Ryan Dahl은 Deno를 만들면서 Node.js에서 발견된 디자인 결함을 수정하려 했습니다. 그 결과, 보안에 더 집중하고, 더 나은 개발자 경험을 제공하며, 최신 JavaScript 기능을 지원하는 새로운 런타임을 만들었습니다.

Deno가 시스템에 설치되어 있다면, Deno 프로젝트를 시작하는 것은 매우 간단합니다. 이번 포스트에서는 Visual Studio Code에서 Deno 프로젝트를 생성하고, Deno를 위한 Visual Studio Code 설정을 구성하는 방법에 대해 알아보겠습니다.

 

 

공식 홈페이지 : https://deno.land/

 

 

1단계: Visual Studio Code에서 Deno 확장 설치

Visual Studio Code는 여러 확장을 통해 다양한 언어와 런타임을 지원합니다. Deno를 사용하려면 먼저 Deno 공식 확장을 설치해야 합니다.

Visual Studio Code를 열고, 왼쪽 사이드바에 있는 "Extensions" 아이콘(네모 상자 모양)을 클릭합니다.
검색 창에 "deno"라고 입력하고, "justjavac"이나 "denoland"가 제공하는 "Deno" 확장을 찾습니다.
"Install" 버튼을 클릭하여 Deno 확장을 설치합니다.

 

2단계: 프로젝트 폴더 생성
Deno는 JavaScript와 TypeScript를 지원하므로, 특별한 프로젝트 구조를 필요로 하지 않습니다. 새로운 폴더를 만들어 봅시다.

터미널을 열고, 새 프로젝트 폴더를 생성합니다.

mkdir my_deno_project
cd my_deno_project

 

 

Visual Studio Code를 이 폴더에서 엽니다.

code .

 

이 명령은 Visual Studio Code를 현재 디렉토리(.)에서 열라는 의미입니다.

 

 

3단계: Deno 설정 파일 생성

Deno 확장이 제대로 동작하려면, 프로젝트 루트 디렉토리에 .vscode 폴더를 생성하고 그 안에 settings.json 파일을 생성해야 합니다.

Visual Studio Code에서 프로젝트 루트에 .vscode 디렉토리를 생성합니다.
.vscode 디렉토리 안에 settings.json 파일을 만듭니다.
settings.json 파일에 아래 설정을 추가합니다.

{
  "deno.enable": true,
  "[typescript]": {
    "editor.defaultFormatter": "denoland.vscode-deno"
  },
  "[typescriptreact]": {
    "editor.defaultFormatter": "denoland.vscode-deno"
  }
}

 

deno.enable 설정은 Deno 확장을 활성화하는 데 사용됩니다. 나머지 설정은 TypeScript 파일을 위한 기본 포맷터로 Deno를 설정하는 것입니다.

 

 

4단계: 코드 작성 및 실행

이제 Deno 프로젝트를 설정했으므로 코드를 작성하고 실행해봅시다.

프로젝트 루트에 main.ts 파일을 생성합니다.
main.ts에 아래 코드를 추가합니다.

console.log("Hello, Deno!");

 

 

터미널을 열고, 다음 명령을 입력하여 코드를 실행합니다.

deno run main.ts

 

이제 "Hello, Deno!"라는 메시지가 출력되는 것을 확인할 수 있습니다.

 

 

 

Deno는 편리하고 강력한 개발 도구로, 모던 JavaScript 개발에 대한 새로운 접근법을 제공합니다. 이 포스트를 통해 Visual Studio Code에서 Deno 프로젝트를 어떻게 시작하는지 간단하게나마 알게 되었을 것입니다. 앞으로의 블로그 글도 응원해주시고 직접 자유롭게 코드를 작성하고, Deno의 흥미로운 기능을 탐험해 보세요!