← 홈

🔷TypeScript

⌘K
🤖
Claude Code AI 도구
🤗
Hugging Face AI 도구
🦜
LangChain AI 도구
🧠
Keras AI 도구
🦙
Ollama AI 도구
🐍
Python 프로그래밍 언어
🟨
JavaScript 프로그래밍 언어
🔷
TypeScript 프로그래밍 언어
⚛️
React 프로그래밍 언어
🐹
Go 프로그래밍 언어
🦀
Rust 프로그래밍 언어
📊
MATLAB 프로그래밍 언어
🗄️
SQL 프로그래밍 언어
⚙️
C/C++ 프로그래밍 언어
Java 프로그래밍 언어
🟣
C# 프로그래밍 언어
🍎
Swift 프로그래밍 언어
🟠
Kotlin 프로그래밍 언어
Next.js 프로그래밍 언어
💚
Vue.js 프로그래밍 언어
🔥
Svelte 프로그래밍 언어
🎨
Tailwind CSS 프로그래밍 언어
💚
Node.js 프로그래밍 언어
🌐
HTML 프로그래밍 언어
🎨
CSS/SCSS 프로그래밍 언어
🐘
PHP 프로그래밍 언어
💎
Ruby 프로그래밍 언어
🔴
Scala 프로그래밍 언어
📊
R 프로그래밍 언어
🎯
Dart 프로그래밍 언어
💧
Elixir 프로그래밍 언어
🌙
Lua 프로그래밍 언어
🐪
Perl 프로그래밍 언어
🅰️
Angular 프로그래밍 언어
🚂
Express.js 프로그래밍 언어
🐱
NestJS 프로그래밍 언어
🛤️
Ruby on Rails 프로그래밍 언어
◼️
GraphQL 프로그래밍 언어
🟪
Haskell 프로그래밍 언어
💚
Nuxt.js 프로그래밍 언어
🔷
SolidJS 프로그래밍 언어
htmx 프로그래밍 언어
💻
VS Code 개발 도구
🧠
PyCharm 개발 도구
📓
Jupyter 개발 도구
🧠
IntelliJ IDEA 개발 도구
💚
Neovim 개발 도구
🔮
Emacs 개발 도구
🔀
Git DevOps & CLI
🐳
Docker DevOps & CLI
☸️
Kubernetes DevOps & CLI
☁️
AWS CLI DevOps & CLI
🔄
GitHub Actions DevOps & CLI
🐧
Linux 명령어 DevOps & CLI
💻
Bash 스크립팅 DevOps & CLI
🌐
Nginx DevOps & CLI
📝
Vim DevOps & CLI
🔨
Makefile DevOps & CLI
🧪
Pytest DevOps & CLI
🪟
Windows DevOps & CLI
📦
패키지 매니저 DevOps & CLI
🍎
macOS DevOps & CLI
🏗️
Terraform DevOps & CLI
🔧
Ansible DevOps & CLI
Helm DevOps & CLI
🔨
Jenkins DevOps & CLI
🔥
Prometheus DevOps & CLI
📊
Grafana DevOps & CLI
💻
Zsh DevOps & CLI
🐟
Fish Shell DevOps & CLI
💙
PowerShell DevOps & CLI
🔄
Argo CD DevOps & CLI
🔀
Traefik DevOps & CLI
☁️
Azure CLI DevOps & CLI
☁️
Google Cloud CLI DevOps & CLI
📟
tmux DevOps & CLI
🔧
jq DevOps & CLI
✂️
sed DevOps & CLI
📊
awk DevOps & CLI
🌊
Apache Airflow DevOps & CLI
🔢
NumPy 데이터베이스 & 데이터
🐼
Pandas 데이터베이스 & 데이터
🔥
PyTorch 데이터베이스 & 데이터
🧠
TensorFlow 데이터베이스 & 데이터
📈
Matplotlib 데이터베이스 & 데이터
🐘
PostgreSQL 데이터베이스 & 데이터
🐬
MySQL 데이터베이스 & 데이터
🍃
MongoDB 데이터베이스 & 데이터
🔴
Redis 데이터베이스 & 데이터
🔍
Elasticsearch 데이터베이스 & 데이터
🤖
Scikit-learn 데이터베이스 & 데이터
👁️
OpenCV 데이터베이스 & 데이터
Apache Spark 데이터베이스 & 데이터
🪶
SQLite 데이터베이스 & 데이터
Supabase 데이터베이스 & 데이터
🔵
Neo4j 데이터베이스 & 데이터
📨
Apache Kafka 데이터베이스 & 데이터
🐰
RabbitMQ 데이터베이스 & 데이터
🔤
Regex 유틸리티
📝
Markdown 유틸리티
📄
LaTeX 유틸리티
🔐
SSH & GPG 유틸리티
🌐
curl & HTTP 유틸리티
📜
reStructuredText 유틸리티
🚀
Postman 유틸리티
🎬
FFmpeg 유틸리티
🖼️
ImageMagick 유틸리티
🔍
ripgrep 유틸리티
🔍
fzf 유틸리티
📗
Microsoft Excel 오피스 애플리케이션
📘
Microsoft Word 오피스 애플리케이션
📙
Microsoft PowerPoint 오피스 애플리케이션
📝
한컴 한글 한컴오피스
📽️
한컴 한쇼 한컴오피스
📊
한컴 한셀 한컴오피스
📄
Google 문서 Google Workspace
📊
Google 스프레드시트 Google Workspace
📽️
Google 프레젠테이션 Google Workspace
🔌
Cadence Virtuoso EDA & 하드웨어
⚙️
Synopsys EDA EDA & 하드웨어
💎
Verilog & VHDL EDA & 하드웨어
LTSpice EDA & 하드웨어
🔧
KiCad EDA & 하드웨어
📝
Notion 생산성 도구
💎
Obsidian 생산성 도구
💬
Slack 생산성 도구
🎮
Discord 생산성 도구
🎨
Figma 디자인 도구
📘
Confluence Atlassian
📋
Jira Atlassian
🃏
Jest 테스팅
Vitest 테스팅
🎭
Playwright 테스팅
🌲
Cypress 테스팅
🌐
Selenium 테스팅
💙
Flutter 모바일 개발
📱
React Native 모바일 개발
🍎
SwiftUI 모바일 개발
📱
Expo 모바일 개발
🐍
Django 웹 프레임워크
FastAPI 웹 프레임워크
🌶️
Flask 웹 프레임워크
🍃
Spring Boot 웹 프레임워크
🍸
Gin 웹 프레임워크
Vite 빌드 도구
📦
Webpack 빌드 도구
esbuild 빌드 도구
🐘
Gradle 빌드 도구
🪶
Maven 빌드 도구
🔧
CMake 빌드 도구
🎮
Unity 게임 개발
🤖
Godot 게임 개발
🔌
Arduino 임베디드 & IoT
🔍
Nmap 보안
🐕
Datadog 모니터링
📖
Swagger/OpenAPI 문서화
검색 결과가 없습니다
EN KO

🏷️ 기본 타입

📦 원시 타입

let x: string = "hello" 문자열 타입
let x: number = 42 숫자 타입
let x: boolean = true 불리언 타입
let x: null = null Null 타입
let x: undefined = undefined Undefined 타입
let x: symbol = Symbol("id") 심볼 타입
let x: bigint = 100n BigInt 타입

특수 타입

let x: any Any 타입 (타입 검사 해제)
let x: unknown Unknown 타입 (타입 안전한 any)
function f(): void {} Void (반환값 없음)
function f(): never { throw new Error() } Never (절대 반환하지 않음)
let x: object = {} Object 타입 (비원시)

📋 배열 & 튜플

let arr: number[] = [1, 2, 3] 숫자 배열
let arr: Array<string> = ["a", "b"] 제네릭 배열 문법
let tuple: [string, number] = ["a", 1] 튜플 (고정 길이)
let tuple: [string, ...number[]] 튜플의 나머지 요소
let arr: readonly number[] 읽기 전용 배열
let arr: ReadonlyArray<number> ReadonlyArray 타입
let tuple: readonly [string, number] 읽기 전용 튜플

🔧 객체 & 인터페이스

📝 객체 타입

let obj: { name: string; age: number } 객체 타입 리터럴
let obj: { name: string; age?: number } 선택적 속성
let obj: { readonly id: number } 읽기 전용 속성
let obj: { [key: string]: number } 인덱스 시그니처
let obj: { [K in keyof T]: T[K] } 매핑된 타입

📋 인터페이스

interface User { name: string; age: number } 인터페이스 선언
interface User { age?: number } 선택적 속성
interface User { readonly id: number } 읽기 전용 속성
interface Child extends Parent {} 인터페이스 확장
interface A extends B, C {} 다중 상속
interface User { [key: string]: any } 인덱스 시그니처
interface Fn { (x: number): string } 함수 인터페이스

🏷️ 타입 별칭

type ID = string | number 타입 별칭
type Point = { x: number; y: number } 객체 타입 별칭
type Callback = (data: string) => void 함수 타입 별칭
type Tree<T> = { value: T; children?: Tree<T>[] } 재귀 타입

🔀 유니온 & 타입 좁히기

유니온 타입

type ID = string | number 유니온 타입
type Status = "pending" | "done" 리터럴 유니온
type Result = Success | Error 구별된 유니온
type A & B 교차 타입

🔍 타입 좁히기

if (typeof x === "string") {} typeof 가드
if (x instanceof Date) {} instanceof 가드
if ("prop" in obj) {} in 연산자 가드
if (x === null) {} 동등성 좁히기
if (Array.isArray(x)) {} 배열 확인
function isString(x: unknown): x is string 타입 술어
x as string 타입 단언
<string>x 꺾쇠 괄호 단언
x! 논-널 단언

📌 리터럴 타입

let x: "hello" = "hello" 문자열 리터럴 타입
let x: 42 = 42 숫자 리터럴 타입
let x: true = true 불리언 리터럴 타입
const x = "hello" const는 리터럴 추론
let x = "hello" as const as const 단언
const arr = [1, 2] as const as const로 읽기 전용 튜플

⚙️ 함수

📝 함수 타입

function f(x: string): number {} 함수 선언
const f = (x: string): number => {} 화살표 함수
const f: (x: string) => number = ... 함수 타입 주석
function f(x?: string) {} 선택적 매개변수
function f(x: string = "default") {} 기본 매개변수
function f(...args: number[]) {} 나머지 매개변수
function f(this: User, x: string) {} this 매개변수

🔄 함수 오버로드

function f(x: string): string; 오버로드 시그니처 1
function f(x: number): number; 오버로드 시그니처 2
function f(x: string | number) { ... } 구현 시그니처

🧬 함수의 제네릭

function f<T>(x: T): T {} 제네릭 함수
function f<T, U>(x: T, y: U): [T, U] {} 다중 타입 매개변수
function f<T extends object>(x: T) {} 제약된 제네릭
function f<T extends { id: number }>(x: T) {} 인터페이스 제약
function f<T = string>(x: T) {} 기본 타입 매개변수
const f = <T,>(x: T) => x 제네릭 화살표 함수

🧬 제네릭

📦 제네릭 타입

interface Box<T> { value: T } 제네릭 인터페이스
type Box<T> = { value: T } 제네릭 타입 별칭
class Box<T> { value: T } 제네릭 클래스
type Result<T, E = Error> = Success<T> | Failure<E> 기본 타입 매개변수

🔒 제네릭 제약

T extends string extends 제약
T extends { length: number } 형태 제약
T extends U ? X : Y 조건부 타입
K extends keyof T keyof 제약
T extends (...args: any) => infer R 조건부에서 infer

🛠️ 내장 제네릭

Array<T> T 배열
Promise<T> T로 해결되는 Promise
Map<K, V> 키 K, 값 V인 Map
Set<T> T의 Set
Record<K, V> 키 K, 값 V인 객체
WeakMap<K, V> / WeakSet<T> 약한 참조

🔧 유틸리티 타입

⚙️ 일반 유틸리티

Partial<T> 모든 속성 선택적
Required<T> 모든 속성 필수
Readonly<T> 모든 속성 읽기 전용
Pick<T, K> 특정 속성 선택
Omit<T, K> 특정 속성 제외
Record<K, V> 키 타입 K인 객체
Exclude<T, U> T에서 U 제거
Extract<T, U> T에서 U 추출
NonNullable<T> null과 undefined 제거

📋 함수 유틸리티

ReturnType<T> 함수 반환 타입
Parameters<T> 함수 매개변수 타입
ConstructorParameters<T> 생성자 매개변수 타입
InstanceType<T> 클래스 인스턴스 타입
ThisParameterType<T> this 매개변수 타입
OmitThisParameter<T> this 매개변수 제거

🔤 문자열 유틸리티

Uppercase<T> 대문자 문자열 리터럴
Lowercase<T> 소문자 문자열 리터럴
Capitalize<T> 첫 글자 대문자
Uncapitalize<T> 첫 글자 소문자

🏛️ 클래스

📝 클래스 선언

class User { name: string } 속성이 있는 클래스
class User { private name: string } private 속성
class User { protected name: string } protected 속성
class User { readonly id: number } 읽기 전용 속성
class User { #name: string } ES private 필드
class User { static count: number } static 속성
class User { constructor(public name: string) {} } 매개변수 속성

⚙️ 클래스 기능

class Child extends Parent {} 클래스 상속
class User implements IUser {} 인터페이스 구현
abstract class Base {} 추상 클래스
abstract method(): void 추상 메서드
get name(): string {} 게터
set name(value: string) {} 세터
override method() {} 오버라이드 (명시적)

🧬 클래스 제네릭

class Box<T> { value: T } 제네릭 클래스
class Container<T extends object> {} 제약된 제네릭
class Map<K, V> {} 다중 타입 매개변수
class Wrapper<T = string> {} 기본 타입 매개변수

🚀 고급 타입

🗺️ 매핑된 타입

type Readonly<T> = { readonly [K in keyof T]: T[K] } 매핑된 읽기 전용
{ [K in keyof T]?: T[K] } 선택적 매핑
{ [K in keyof T]-?: T[K] } 선택적 제거
{ -readonly [K in keyof T]: T[K] } 읽기 전용 제거
{ [K in keyof T as NewKey]: T[K] } 키 재매핑

조건부 타입

T extends U ? X : Y 조건부 타입
T extends (...args: any) => infer R ? R : never 반환 타입 추론
T extends Array<infer U> ? U : never 배열 요소 추론
T extends Promise<infer U> ? U : T Promise 언래핑
T extends [infer First, ...infer Rest] ? First : never 튜플 부분 추론

📝 템플릿 리터럴 타입

type Greeting = `Hello ${string}` 문자열 패턴 타입
type Color = `${R}-${G}-${B}` 조합 타입
type PropEvent<T> = `${T}Changed` 문자열 조작
`on${Capitalize<K>}` 템플릿에서 대문자화

🔑 Keyof & Typeof

keyof T 키의 유니온
typeof obj 값의 타입
T[K] 인덱스 접근 타입
T[keyof T] 모든 속성 타입
typeof arr[number] 배열 요소 타입
const obj = {...} as const; type T = typeof obj const에서 타입

📦 모듈 & 네임스페이스

📤 가져오기 / 내보내기

export const x = 1 명명된 내보내기
export default function() {} 기본 내보내기
export { x, y } 내보내기 목록
export { x as y } 이름 변경 내보내기
export type { User } 타입 전용 내보내기
import { x } from './mod' 명명된 가져오기
import x from './mod' 기본 가져오기
import * as mod from './mod' 네임스페이스 가져오기
import type { User } from './mod' 타입 전용 가져오기
export * from './mod' 전체 재내보내기

📄 선언 파일

declare module "name" {} 앰비언트 모듈
declare global {} 전역 확장
declare namespace NS {} 네임스페이스 선언
declare function fn(): void 앰비언트 함수
declare const x: string 앰비언트 변수
declare class MyClass {} 앰비언트 클래스
/// <reference types="node" /> 트리플 슬래시 지시문

⚙️ 설정

📋 tsconfig 옵션

"strict": true 모든 엄격한 검사 활성화
"target": "ES2022" JS 출력 버전
"module": "ESNext" 모듈 시스템
"moduleResolution": "bundler" 모듈 해석
"esModuleInterop": true CommonJS/ESM 상호 운용
"skipLibCheck": true .d.ts 검사 건너뛰기
"noEmit": true JS 출력 없음
"declaration": true .d.ts 파일 생성
"sourceMap": true 소스 맵 생성
"paths": {"@/*": ["./src/*"]} 경로 별칭

🔒 엄격 옵션

"strictNullChecks": true Null/undefined 검사
"noImplicitAny": true 암시적 any 오류
"strictFunctionTypes": true 엄격한 함수 타입
"strictPropertyInitialization": true 클래스 속성 검사
"noImplicitThis": true 암시적 this 오류
"noUnusedLocals": true 미사용 지역 변수 오류
"noUnusedParameters": true 미사용 매개변수 오류
"exactOptionalPropertyTypes": true 정확한 선택적 타입

💡

📝 자주 쓰는 패턴

// 객체 키에서 타입 추출
const obj = { a: 1, b: 2 } as const;
type Keys = keyof typeof obj; // "a" | "b"

// 구별된 유니온
type Result =
| { success: true; data: T }
| { success: false; error: Error };

// 타입 가드 함수
function isUser(x: unknown): x is User {
return typeof x === "object" && x !== null && "name" in x;
}

// 깊은 읽기 전용 타입
type DeepReadonly = {
readonly [K in keyof T]: T[K] extends object
? DeepReadonly
: T[K];
};

// 함수 반환 타입 추출
type AsyncReturn Promise> =
Awaited>;

🚀 모범 사례

  • 타입 안전한 unknown 값에는 any 대신 unknown 사용
  • 확장될 수 있는 객체 타입에는 interface 선호
  • 유니온, 교차, 매핑된 타입에는 type 사용
  • 최상의 타입 안전성을 위해 tsconfig에서 strict 모드 활성화
  • 읽기 전용 리터럴 타입에 as const 사용
  • 타입 단언보다 타입 좁히기 선호
  • 복잡한 상태 관리에 구별된 유니온 사용
  • 복잡한 타입은 JSDoc 주석으로 문서화