“자바스크립트(JavaScript)만으로도 동작하는데 굳이 왜 코드를 더 길게 써야 하죠?” “타입 에러(Type Error) 맞추다가 개발 시간이 다 가는 것 같아요!”

많은 개발자가 처음 타입스크립트(TypeScript)를 접할 때 던지는 불만입니다. 변수 옆에 : string 한 줄 붙이는 건 쉽지만, 복잡한 객체와 API 응답 데이터를 마주하면 화면은 온통 빨간 줄로 뒤덮이기 일쑤입니다.結局 스트레스를 이기지 못하고 마법의 단어인 any를 도배해버리기도 하죠.

하지만 꾹 참고 단 2주만 타입스크립트의 세계에 적응하고 나면, 다시는 과거의 순수 자바스크립트 시절로 돌아가기 싫어질 것입니다. 오늘은 타입스크립트 도입을 주저하고 있거나 초기 러닝 커브에 부딪힌 프론트엔드/백엔드 비기너들을 위한 현실적인 조언을 준비했습니다.

---

🛑 왜 우리는 타입스크립트를 써야만 할까?

가장 큰 이유는 **“실행하기 전에(Run-time 이전) 에러를 귀신같이 잡아내기 때문”**입니다.

자바스크립트에서는 오타가 난 객체의 프로퍼티(user.emial)를 호출해도 코드를 실행해서 브라우저가 터지기 전까지는 아무도 모릅니다. 반면, 타입스크립트는 여러분이 코드를 타이핑하는 그 순간 VS Code 에디터 창에서 **“user 객체에는 emial 이라는 속성이 없습니다. 혹시 email을 의미하셨나요?”**라고 친절하고 똑똑하게 알려줍니다.

이것은 단순한 문법 검사기가 아닙니다. **“스스로 작성되는 완벽한 문서(Self-Documenting)“이자 “미래의 나와 동료를 위한 가장 강력한 방어막”**입니다.

---

💡 우아하게 타입스크립트에 적응하는 3가지 실전 팁

처음부터 완벽한 제네릭(Generic)이나 유틸리티 타입을 쓸 필요는 없습니다. 아래의 세 가지 원칙만 기억하고 시작해 보세요.

1. 절대악 any 대신 unknown 친해지기

가장 많이 하는 실수가 외부 API에서 데이터를 받아올 때, 형태를 도무지 모르겠어서 일단 any를 주고 시작하는 것입니다. 하지만 any는 타입스크립트의 보호막을 스스로 꺼버리는 행위입니다. 만약 받아올 데이터의 타입을 당장 정하기 힘들다면, **any 대신 unknown**을 사용하세요.

• any: “이 변수는 뭐든지 다 될 수 있으니까 묻지도 따지지도 말고 그냥 넘어가라.” (위험)
• unknown: “이 변수에 뭐가 들어올지 아직 모르겠어. 네가 나중에 이게 문자열인지 숫자인지 조건문으로 확인(Type Narrowing)한 다음에만 쓰게 해 줄게.” (안전)

2. type 보다는 interface로 객체 설계하기

객체의 타입을 정의할 때 type 예약어와 interface 예약어 두 가지를 쓸 수 있어 혼란스럽습니다. 초보자 단계에서는 **“객체의 구조를 짤 때는 무조건 interface를 쓴다”**라고 규칙을 하나로 통일하는 것이 정신 건강에 좋습니다. interface는 마치 레고 블록처럼 다른 인터페이스를 상속(extends)받아 조립하고 확장하기가 직관적이어서, 객체 지향적인 코드 구조를 잡는 데 큰 도움이 됩니다.

// 부품 1
interface UserBase {
    id: number;
    name: string;
}

// 부품 1을 가져다 조립하고 확장함
interface AdminUser extends UserBase {
    role: "admin";
    manageUsers: () => void;
}

3. JSDoc을 대체하는 타입 추론(Type Inference) 믿기

타입스크립트는 생각보다 훨씬 똑똑합니다. 모든 변수에 일일이 타입을 적어줄 필요가 없습니다.

// ❌ 굳이 이렇게 피곤하게 안 써도 됩니다.
let count: number = 0; 
let message: string = "Hello TS";

// ✅ 타입스크립트가 알아서 유추하게 둡니다. (Type Inference)
let count = 0; 
let message = "Hello TS";

초기 값을 할당해 주면, 타입스크립트는 알아서 그 변수의 타입을 고정해버립니다. 우리는 API 통신으로 주고받는 입력값(매개변수)과 반환값(Return) 정도의 굵직한 통로에만 타입을 명시해 주면 됩니다.

---

🚀 도입을 망설이는 분들께 드리는 한마디

프로젝트 마감 기한이 코 앞인데 새로운 문법(타입)을 배우며 코드를 짜는 건 당연히 비효율적입니다. 하지만 여유가 있는 사이드 프로젝트이거나, 유지보수를 6개월 이상 해야 하는 실무 프로젝트라면 하루라도 빨리 .js 파일들을 .ts 파일로 바꾸어 보시길 강력히 권장합니다.

처음에는 빨간 줄을 지우느라 속도가 처지는 것 같아도, 프로젝트의 덩치가 커졌을 때 **“리팩토링의 공포”**를 완벽하게 지워주는 마법을 경험하시게 될 겁니다. 타입의 세계에 오신 것을 환영합니다!