Node.js 개발자를 위한 Jupyter Notebook 활용: VS Code + Deno 핵심 정리

반응형

Jupyter Notebook은 오랫동안 Python 중심 생태계에서 사랑받아 왔지만, 이제는 JavaScript와 TypeScript 개발자에게도 훌륭한 인터랙티브 개발 도구가 되었습니다.

VS Code와 Deno 런타임, 그리고 Jupyter 확장을 조합하면 Python 없이도 강력한 JS/TS Notebook 환경을 구성할 수 있습니다.

 

Node.js 개발자를 위한 Jupyter Notebook 활용: VS Code + Deno 핵심 정리

📚 목차
1. 왜 JavaScript/TypeScript 개발자가 Jupyter Notebook을 사용해야 할까?
2. 개발 환경 준비: VS Code + Jupyter + Deno 설치
3. VS Code에서 Jupyter Notebook 생성하고 JS/TS 실행하기
4. JavaScript/TypeScript Notebook 예시
✔ 마무리

 

1. 왜 JavaScript/TypeScript 개발자가 Jupyter Notebook을 사용해야 할까?

전통적으로 Jupyter Notebook은 데이터 분석과 머신러닝 분야에서 Python과 함께 사용되어 왔습니다.

그러나 최근에는 Jupyter의 커널 구조가 언어-중립적(Language-agnostic) 으로 발전하면서, JS/TS 개발자도 다음과 같은 이점을 누릴 수 있게 되었습니다.

 

✔️ 셀 단위 실행으로 빠른 실험이 가능
코드 조각을 “런(Run)” 버튼만 눌러 바로 실행할 수 있어, 알고리즘 테스트, API 호출 실험, 데이터 구조 탐색 등이 빠릅니다.

 

✔️ TypeScript 개발자가 사랑하는 IntelliSense 그대로 사용

VS Code의 강력한 타입 분석 엔진이 Notebook 셀에서도 그대로 동작합니다.
즉, 자동완성, 타입 체크, 코드 힌트 등이 실시간으로 제공됩니다.

 

✔️ Python 설치가 필요 없음

Deno 런타임은 JS/TS를 1등 시민으로 다루는 현대적인 런타임이며, 공식적으로 Jupyter 커널을 직접 제공합니다.
→ 따라서 Python 환경 없이 완전한 Jupyter Notebook을 쓸 수 있습니다.

 

✔️ 문서화와 코드가 결합된 개발 방식

Markdown 셀과 코드 셀이 섞여 있어 기술 문서 작성, 실험 기록, 회의 공유용 자료에 매우 유용합니다.

 

2. 개발 환경 준비: VS Code + Jupyter + Deno 설치

🔷 Node.js + VS Code 설치

VSCode에서 Node.js 포터블 다중 버전 관리하기

VSCode에서 Node.js 포터블 다중 버전 관리하기

1편. Node.js(v20.19) 개발환경 세팅: ESLint·Prettier·VSCode·CI까지

1편. Node.js(v20.19) 개발환경 세팅: ESLint·Prettier·VSCode·CI까지

 

🔷 2. 필수 확장 설치: Jupyter

VS Code는 기본적으로 .ipynb Notebook을 실행하거나 셀 기반 실행을 제공하지 않습니다.
따라서 Jupyter 확장은 반드시 필요합니다.

Jupyter 확장 설치

 

기능 요약

▸ .ipynb 파일 열기
▸ 셀 기반 실행 UI 제공
▸ 다양한 커널 선택 기능
▸ 출력 렌더링(표/HTML/이미지/차트)

📌 Deno Kernel을 사용할 것이므로 JS/TS Notebook에 Python은 필요하지 않습니다.

 

🔷 3. Deno 설치 및 Jupyter Kernel 등록

Deno는 Node.js와는 별개의 JS/TS 런타임이지만, TS 네이티브 지원과 보안 모델 덕분에 Notebook 환경에서 특히 강력합니다.

1. 설치

https://deno.com 의 명령어를 확인 후 설치하기

deno 설치 화면

https://github.com/denoland/deno 에서 OS별 Release 파일 다운로드 하여 설치하기

GitHub - denoland/deno: A modern runtime for JavaScript and TypeScript.

 

2. 설치 확인
Deno 설치가 완료되면, 터미널에서 아래 명령으로 정상 동작 여부를 확인합니다.

개인적으로 deno.exe를 node 설치 경로에 함께 두어 PATH 관리가 편리하도록 구성했습니다.

 

버전이 정상적으로 표시되면 Deno 환경 설정이 완료된 것입니다.

> deno --version

deno 2.5.6 (stable, release, x86_64-pc-windows-msvc)
v8 14.0.365.5-rusty
typescript 5.9.2

 

3. Jupyter Kernel 설치

Deno는 공식적으로 Jupyter Notebook용 커널 설치 기능을 제공합니다.
아래 명령 한 줄로 자동 설치가 가능합니다:

> deno jupyter --install

Warning "deno jupyter" is unstable and might change in the future.
✅ Deno kernelspec installed successfully at C:\Users\x\AppData\Roaming\jupyter\kernels\deno.

 

커널이 설치된 후에는 VS Code를 한 번 재시작해야 커널 목록에 정상적으로 반영됩니다.
재구동하지 않으면 Kernel Picker에서 Deno 커널이 보이지 않을 수 있습니다.

 

설치 후 VS Code에서 커널 선택기(Kernel Picker)를 열면 → Deno 커널이 나타납니다.

반응형

 

3. VS Code에서 Jupyter Notebook 생성하고 JS/TS 실행하기

Deno 커널 설치 후 VS Code를 재시작하면 이제 .ipynb Notebook을 활용할 준비가 완료됩니다.

 

1. VS Code에서 notebook.ipynb 파일을 더블 클릭합니다.

2. Notebook이 제대로 열렸다면, 오른쪽 상단의 커널 선택기에서 Deno Kernel이 정상적으로 표시되어 있어야 합니다.

3. Deno Kernel이 보이지 않는다면 VS Code를 재실행하세요.

Select Kernel 선택 화면

 

4. 오른쪽 상단의 커널 선택기에서 Deno Kernel이 정상적으로 표시되어 있어야 합니다 .

Deno 커널 선택 화면

 

5. 테스트 코드를 입력하고 Execute Cell을 실행하면 코드 실행 결과가 화면과 같이 표시됩니다.

 

 

4. JavaScript/TypeScript Notebook 작성 예시

✔️ Markdown 셀

# 1. JavaScript 기본 문법 테스트

이 셀에서는 JavaScript의 가장 기본적인 문법을 테스트합니다.

- 변수 선언 (`let`, `const`)
- 문자열 출력
- 기본 연산
- 템플릿 문자열 사용

기초 문법이 잘 동작하는지 확인해 보세요.

 

✔️ Code 셀

// JavaScript 기본 문법 테스트
console.log("[JavaScript] 기본 문법 테스트");

// 변수 선언
let name = "Alice";
let age = 25;

// 출력
console.log("이름:", name);
console.log("나이:", age);
console.log(`템플릿 문자열 테스트: ${name}의 나이는 ${age}입니다.`);

// 기본 연산
console.log("나이 + 10 =", age + 10);

 

✔️ Markdown 셀 Render 및 코드 Cell 실행해 보기

Markdown 셀 Render 및 코드 Cell 실행 화면

 

✔ 마무리

지금까지 Node.js + VS Code + Jupyter Notebook + Deno 커널 조합으로 Python 환경 없이도 JavaScript와 TypeScript를 강력하게 실험할 수 있는 인터랙티브 개발 환경을 구축해 보았습니다.

전통적으로 Jupyter Notebook은 Python 개발자를 중심으로 성장해 왔지만, Deno 커널과 VS Code의 발전 덕분에 JS/TS 중심의 새로운 Notebook 활용 방식이 완전히 열렸습니다.

특히 다음과 같은 장점은 JS/TS 개발자에게 매우 실용적입니다:
✔ 셀 단위 실행으로 빠르게 실험하고 결과 확인
✔ TypeScript 타입 체크 + IntelliSense 그대로 지원
✔ Markdown 기반 문서화와 코드 예제가 하나의 파일에서 관리됨
✔ 알고리즘 테스트, 데이터 처리 실험, API 호출 테스트 등에 최적화
✔ Python 설치 없이 Jupyter Notebook 기능 90% 활용 가능

 

---

반응형

 

※ 게시된 글 및 이미지 중 일부는 AI 도구의 도움을 받아 생성되거나 다듬어졌습니다.