TypeScript 플레이그라운드
코드 스니펫을 작성, 실행, 공유하세요 — 별도 설치가 필요 없습니다.
index.ts
Output
Click Run to see the output here.
브라우저에서 TypeScript를 온라인으로 실행하세요
무료 온라인 TypeScript 플레이그라운드 겸 컴파일러입니다. 브라우저에서 TS를 작성하고 실행을 누르면 tsgo(Go 기반 네이티브 TypeScript 컴파일러)가 JavaScript를 생성하고 Node 24가 몇 초 만에 실행해 줍니다. tsc, ts-node, tsconfig.json을 미리 세팅할 필요 없습니다.
tsgo가 .ts에서 .js를 생성하고 Node 24가 그 결과를 실행합니다. 덕분에 실행마다 트랜스파일러의 메모리 부담 없이 완전한 타입 검사를 받을 수 있습니다. Node API 타입 정의를 위해 @types/node가 사전 설치되어 있어, 페이지를 벗어나지 않고도 제네릭을 테스트하거나 고급 타입 레벨 기능을 살펴보거나 TS 면접을 준비하기에 좋습니다.
이 TypeScript 플레이그라운드가 유용한 이유
- TypeScript 즉시 실행 — tsgo가 .ts 파일을 컴파일하고 Node 24가 완전한 타입 검사와 함께 몇 초 안에 실행합니다.
- 완전한 TypeScript 문법 강조, 타입 인식 자동 완성, tsgo 진단까지 — VS Code와 동일한 에디터 엔진으로 구동됩니다.
- stdin 입력을 지원합니다. 입력한 줄이
process.stdin으로 전달되므로, 타입이 지정된readline인터페이스나 async stdin 이터레이터가 로컬에서ts-node script.ts를 실행할 때와 똑같이 동작합니다. tsc, ts-node, tsconfig.json을 따로 준비할 필요가 없습니다. - TypeScript 5.3에 tsgo (Go 기반 네이티브 TS 컴파일러), ts-node, @types/node — 완전한 타입 검사와 ES2022 런타임 지원까지.
TypeScript 플레이그라운드에서 만들 수 있는 것
- 인터페이스, 제네릭, 유니언·리터럴 타입, 타입 가드. 타입이 적용된 TS를 작성하면 tsgo가 깔끔한 .js로 내보내고, Node 24에서 실행됩니다.
- 고급 타입: mapped types, conditional types, template literal types, utility types(Pick, Omit, Record)까지 모두 컴파일러가 검증합니다.
- 빠른 TypeScript 실험: 새로운 타입 패턴을 시도해 보고, narrowing 규칙을 확인하고, 제네릭 제약을 테스트하고, tsgo가 타입 오류를 어떻게 보고하는지 살펴보세요.
온라인 TypeScript 플레이그라운드 자주 묻는 질문
온라인 TypeScript 플레이그라운드는 무료인가요?
네, TypeScript 플레이그라운드는 무료로 사용할 수 있습니다. 가입도, tsc 설치도, 만들어야 할 tsconfig.json도 없습니다 — 페이지를 열고 tsgo가 컴파일하게 두세요.
온라인에서 TypeScript를 실행하려면 tsc나 Node를 설치해야 하나요?
설치할 필요 없습니다. tsc 컴파일러도, ts-node도, tsconfig.json도 필요 없습니다. tsgo(Go 기반 네이티브 TypeScript 컴파일러)가 JS를 생성하면 Node 24가 실행해 줍니다.
TypeScript 플레이그라운드가 모바일과 크롬북에서도 작동하나요?
네. TypeScript 플레이그라운드는 최신 브라우저라면 데스크톱, 태블릿, 모바일 어디서든 실행됩니다. Node나 tsc를 설치하지 않고도 Chromebook이나 iPad에서 TS 스니펫을 테스트하기에 유용합니다.
TypeScript playground는 stdin을 지원하나요?
네. tsgo가 .ts를 컴파일하고 Node 24가 실행한 뒤, stdin 입력 상자에 입력하는 줄은
process.stdin으로 전달됩니다. 타입이 지정된 readline 인터페이스, process.stdin 비동기 iterator, @types/node의 NodeJS.ReadStream으로 타입이 지정된 것 모두 로컬에서 스크립트를 실행할 때와 똑같이 동작합니다.플레이그라운드를 써본 다음 TypeScript를 어떻게 배우면 되나요?
샘플 TypeScript를 수정하고 실행을 눌러 반복해 보세요. 좀 더 체계적인 학습을 원한다면 Coddy의 인터랙티브 TypeScript 코스가 타입, 제네릭, 인터페이스, 고급 타입 수준 프로그래밍까지 다룹니다.