TypeScript 배우기 - 코딩 강좌
TypeScript 배우기 - 코딩 강좌 — 주머니 속 타입 검사기로 TypeScript를 배우세요
TypeScript 배우기 - 코딩 강좌은 코드를 직접 작성하며 TypeScript를 배우는 무료 iOS 및 Android 앱이에요. 컴파일러가 기기에서 실행되므로 입력하는 즉시 타입 오류에 밑줄이 표시되고, 101개 과정을 통해 첫 번째 타입 주석부터 유니온, 제네릭, 조건부 타입을 거쳐 React, Node.js, tRPC까지 배울 수 있어요. AI Mentor가 컴파일러의 오류 메시지를 쉬운 말로 설명해 줘요.
- 가격
- 무료, Pro 업그레이드
- 플랫폼
- iOS 및 Android
- 언어
- 22
- 연령 등급
- 4+
- 필요 사항
- iOS 15.1 이상
- App Store
- 3.0 ★ (1)
빨간 밑줄이 나타나는 모습을 직접 보면서 타입을 가장 빠르게 배울 수 있어요.
TypeScript의 핵심은 피드백 루프예요. 잘못 작성하고, 어디가 왜 잘못됐는지 정확히 확인한 다음, 수정하는 과정이죠. 에디터는 입력하는 동안 타입을 검사하고, Type Explorer는 컴파일러가 값의 타입을 어떻게 판단하는지 보여 줘요. 그래서 개념을 그 개념이 설명하는 오류와 함께 익힐 수 있어요.
어떤 앱인가요
TypeScript 배우기 - 코딩 강좌은 실제 컴파일러가 휴대폰에서 실행되는 무료 iOS 및 Android TypeScript 학습 앱이에요. A1부터 C2까지 단계별로 구성된 101개 과정과 352개 레슨에서 기본 타입, 인터페이스, 유니온, narrowing, 제네릭, 조건부 타입과 mapped types, infer 키워드, strict mode와 tsconfig, 그리고 React, Node.js, Zod, Jest, tRPC를 활용한 실제 프로젝트까지 다뤄요. 입력하는 동안 에디터에 타입 오류가 밑줄로 표시되고, 퍼즐, 가이드 프로젝트, 코딩 미션, 인터뷰 시뮬레이터와 AI Mentor를 통해 연습할 수 있어요.
앱 내부 살펴보기
화면은 어떻게 보이나요
강좌
TypeScript 코스에서 다루는 내용
앱 자체 코스 목록에 A1부터 C2까지 단계별로 분류된 101개 코스가 있어요. 주요 학습 단계는 실제 코스 이름을 사용해요.
먼저 배우는 타입과 변수
Introduction to TypeScript, TypeScript vs JavaScript: Why Types Matter, Basic Types (string, number, boolean, any, unknown), Types and Variables Essentials를 다뤄요.
함수, 객체, 일상적으로 사용하는 타입
Functions and Type Annotations, Arrays, Tuples and Enums, Interfaces and Type Aliases, Union and Intersection Types, Literal Types and const Assertions, Optional Chaining and Nullish Coalescing을 다뤄요.
타입 좁히기, 클래스, 제네릭
Type Narrowing and Type Guards, Classes and Access Modifiers, Generics Basics, Index Signatures, typeof 및 keyof 연산자를 다뤄요.
유틸리티 타입과 안전한 코드
Utility Types (Partial, Required, Pick, Omit, Record), Error Handling Patterns, Strict Mode and tsconfig Best Practices, Runtime Validation with Zod를 다뤄요.
고급 타입
Advanced Generics with Constraints and Conditional Types, Mapped Types and Template Literal Types, Discriminated Unions and Exhaustiveness, satisfies Operator를 다뤄요.
실제 프로젝트에서 사용하는 TypeScript
TypeScript with React: Props and Hooks, TypeScript with Node.js and Express, Testing TypeScript with Jest, Type-Safe API Clients, tRPC, GraphQL, Next.js를 다뤄요.
마이그레이션과 도구
Migration: JavaScript to TypeScript, Build and Bundlers, Monorepo Setup with TypeScript, Authoring Declaration Files를 다뤄요.
타입 수준 프로그래밍
The infer Keyword and Complex Conditional Types, Writing Custom Utility Types, Recursive and Self-Referential Types, TypeScript Compiler API를 다뤄요.
어떻게 작동하나요
TypeScript 레슨은 이렇게 진행돼요
레슨은 짧고, 모든 레슨에 컴파일러가 함께해요.
짧은 설명 읽기
각 레슨은 5~10분이면 끝나며, interface와 type alias의 차이처럼 이해하기 쉬운 설명과 작은 예제를 함께 제공해요.
코드를 작성하며 타입 확인하기
에디터에 입력하면 오류가 실시간으로 밑줄 표시돼요. Type Explorer는 커서가 있는 위치의 타입을 보여 주고, 유니온의 멤버까지 확인할 수 있어요. 프로그램을 실행해 결과도 볼 수 있어요.
연습한 뒤 이해되지 않으면 질문하기
각 주제의 마지막에는 질문과 짧은 코드 과제가 나오고, Type Gym에서는 퍼즐을, Debug Arena에서는 고쳐야 할 망가진 코드를 제공해요. 제네릭 제약 조건이나 컴파일러 메시지가 헷갈리면 AI Mentor가 설명해 줘요.
무엇이 들어 있나요
앱에 포함된 기능
101
첫 타입부터 C2까지 이어지는 과정
A1부터 C2까지 단계별로 구성된 352개 레슨에서 타입이 중요한 이유와 기본 타입부터 TypeScript 컴파일러 API, 타입 안전 파서 만들기까지 배울 수 있어요.
실시간
에디터에서 타입 검사
입력하는 동안 타입 오류에 밑줄이 표시되고, Type Explorer는 커서 아래의 타입을 보여 줘요. AI Tools는 프로그램을 검토하고 적용할 수 있는 수정 방법을 제안해 줘요.
24
Type Gym 퍼즐
24개의 타입 퍼즐과 오늘의 퍼즐, 그리고 제한 시간이 끝나기 전에 망가진 코드를 수정하는 Debug Arena가 제공돼요.
20
가이드 프로젝트와 60개 미션
한 단계씩 완성해 가는 작은 프로그램을 실행할 때마다 각 단계를 검사하고, Hello World부터 알고리즘까지 3개 레벨로 구성된 60개의 코딩 미션도 제공해요.
30
인터뷰 시뮬레이터
30개 질문으로 구성된 시간 제한 세트와 채점 리포트를 제공하며, 답변이 포함된 인터뷰 질문 50개와 아직 자주 틀리는 주제를 보여 주는 Weakness 레이더도 함께 제공해요.
AI
AI Mentor
컴파일러 오류나 제네릭 제약 조건에 대해 질문하면 쉬운 말로 설명해 줘요.
배경
이미 JavaScript를 알고 있다면 왜 TypeScript를 배워야 할까요?
TypeScript는 정적 타입 시스템을 추가한 JavaScript예요. 데이터의 형태를 설명하면 컴파일러가 코드가 실행되기 전에 데이터를 사용하는 모든 부분을 검사하고, 일반 JavaScript로 컴파일될 때 타입은 제거돼요. 그래서 React, Angular, Node 코드베이스에서 TypeScript를 자주 사용해요. 같은 언어를 사용하면서도 에디터 자동 완성 기능이 코드의 내용을 파악하고, undefined-is-not-a-function 유형의 버그를 빌드 시점에 잡아낼 수 있기 때문이에요. JavaScript를 읽을 수 있다면 시작하는 데 필요한 대부분의 지식을 이미 갖추고 있어요.
타입 주석과 추론여기서 시작하세요
변수나 함수 매개변수에 타입을 지정할 수 있고, TypeScript는 할당한 값을 바탕으로 많은 타입을 자동으로 추론해요. 언제 타입을 직접 작성하고 언제 추론에 맡길지 배우는 것이 첫 번째 실전 기술이에요.
유니온과 narrowing매일 사용하는 핵심 도구
유니온 타입은 하나의 값이 여러 타입 중 하나일 수 있다는 뜻이에요. typeof 검사, 동등성 검사, 사용자 지정 타입 가드를 통한 narrowing은 분기 안에서 어떤 타입인지 컴파일러에 알려 주고, 판별된 유니온을 사용하면 모든 경우를 빠짐없이 검사할 수 있어요.
제네릭유연하면서도 안전하게
제네릭을 사용하면 any로 되돌아가지 않고도 함수나 타입이 여러 타입과 함께 작동하게 만들 수 있어요. extends 키워드를 사용하는 제약 조건으로 타입 매개변수가 어떤 작업을 수행할 수 있어야 하는지도 지정할 수 있어요.
Utility, mapped 및 conditional types타입 시스템의 표현력이 발휘되는 곳
Partial, Pick, Omit, Record는 mapped types와 conditional types로 만들어져요. 여기에 infer 키워드까지 이해하면 다른 사람이 만든 utility types를 복사하는 대신 직접 작성할 수 있어요.
tsconfig와 strict mode컴파일러를 얼마나 엄격하게 사용할지
컴파일러 옵션에 따라 TypeScript가 얼마나 많은 오류를 보고할지가 결정돼요. strict mode를 켜야 타입을 신뢰할 수 있고, 기존 JavaScript 프로젝트를 파일 단위로 조금씩 마이그레이션할 수도 있어요.
나에게 잘 맞는지
누구에게 적합하고, 누구에게는 적합하지 않은지
다음과 같은 분께 잘 맞아요
- JavaScript를 작성하면서 채용 공고와 코드베이스에서 TypeScript를 계속 접하고 있어요
- React 또는 Node를 사용하며 처음부터 끝까지 타입이 적용된 코드를 작성하고 싶어요
- 처음부터 타입이 적용된 표준을 배우고 싶은 초보자예요
- 읽기만 하기보다 컴파일러 피드백과 간단한 퍼즐을 통해 더 잘 배워요
- JavaScript 프로젝트가 있고 파일별로 하나씩 마이그레이션하고 싶어요
다음과 같은 경우에는 적합하지 않아요
- 코드를 읽을 수 있다는 전제 없이 첫 언어를 기초부터 설명받고 싶은 완전한 코딩 초보자예요
- 노트북이 필요한 대규모 프로젝트를 본격적인 IDE에서 구축해야 해요
- 첫 코스가 무료이고 Pro가 나머지를 잠금 해제하므로 모든 기능이 무료이기를 기대해요
- 앱이 독립적으로 운영되므로 공식 Microsoft 코스를 원해요
질문
자주 묻는 질문
휴대폰으로 TypeScript를 배우는 가장 좋은 방법은 무엇인가요?
읽을 텍스트만 제공하는 앱이 아니라 실제로 타입을 검사하는 앱을 사용해 보세요. TypeScript 배우기 - 코딩 강좌은 기기에서 컴파일러를 실행하고, 입력하는 동안 타입 오류에 밑줄을 표시하며, 101개 코스에 타입 퍼즐, 가이드 프로젝트, AI 멘토를 함께 제공해요. iOS와 Android에서 22개 언어로 무료로 시작할 수 있어요.
JavaScript를 몰라도 TypeScript를 배울 수 있나요?
배울 수 있지만, TypeScript는 타입이 추가된 JavaScript이므로 먼저 JavaScript를 조금 읽을 수 있으면 도움이 돼요. TypeScript 배우기 - 코딩 강좌은 타입이 중요한 이유와 기본 타입부터 시작하고, 초반 코스에서 TypeScript와 JavaScript를 비교해요. 첫날부터 타입이 적용된 언어를 배우고 싶은 초보자도 이 앱이 대상으로 하는 학습자예요.
TypeScript와 JavaScript의 차이점은 무엇인가요?
TypeScript는 JavaScript에 정적 타입 시스템을 추가해요. 컴파일러는 직접 선언했거나 추론된 타입을 기준으로 코드를 검사한 다음 타입을 제거하므로, 실제로 실행되는 것은 일반 JavaScript예요. 더 이른 오류 감지와 향상된 에디터 자동 완성이 장점이고, 빌드 단계가 필요하며 추가 문법을 배워야 한다는 점이 비용이에요.
앱에서 실제 컴파일러로 제 TypeScript를 검사하나요?
네. TypeScript 컴파일러가 기기에서 실행되므로 입력하는 동안 에디터에 타입 오류가 밑줄로 표시되고, Type Explorer에는 커서 위치의 타입이 표시돼요. 코드를 실행하고 출력 결과를 확인할 수도 있어요. 또한 이 앱은 TypeScript가 Microsoft Corporation의 상표이며 Microsoft와 제휴 관계가 없다고 안내해요.
TypeScript의 제네릭은 무엇이며 앱에서는 어떻게 가르치나요?
제네릭을 사용하면 any로 대체하지 않고도 타입 안전성을 유지하면서 함수나 타입이 여러 타입과 함께 작동하도록 만들 수 있어요. 앱에서는 제네릭 함수와 타입부터 시작해 제약 조건, 조건부 타입, 매핑 타입과 템플릿 리터럴 타입, infer 키워드 순서로 단계적으로 가르치며, Type Gym의 퍼즐로 연습할 수 있어요.
TypeScript와 React, Node.js도 다루나요?
네. 실제 프로젝트 코스에서는 React props와 hooks를 사용하는 TypeScript, Node.js와 Express를 사용하는 TypeScript, 타입 안전 API 클라이언트, Zod를 사용한 런타임 검증, Jest를 사용한 테스트, GraphQL, tRPC, Next.js를 다뤄요. 마이그레이션 코스에서는 기존 JavaScript 프로젝트에 TypeScript를 점진적으로 도입하는 방법을 보여 줘요.
TypeScript 배우기 - 코딩 강좌은 무료인가요?
무료로 다운로드할 수 있어요. 무료 버전에는 첫 번째 코스, 첫 번째 가이드 프로젝트와 프로젝트 트랙, 코딩 미션 2개, 매일 진행하는 Lab 연습, 매일 제공되는 AI 멘토 이용량이 포함되며 광고가 표시돼요. Pro를 사용하면 모든 코스, 프로젝트, 트랙, 미션, 무제한 AI 멘토 및 Lab 연습, 에디터의 전체 오류 목록, 인증서 시험이 잠금 해제되고 광고가 제거돼요.
앱이 TypeScript 면접 준비에도 도움이 되나요?
네. 면접 시뮬레이터는 30개의 질문으로 구성된 시간 제한 세트이며 채점 보고서로 마무리돼요. 답변이 포함된 면접 질문 50개도 제공돼요. Weakness 레이더에서 아직 틀리는 주제를 보여 주므로 알맞은 코스로 돌아가 학습할 수 있어요.
TypeScript를 배우는 데 얼마나 걸리나요?
이미 JavaScript를 알고 있다면 타입, 인터페이스, 유니언의 기초는 매일 짧은 레슨을 진행해 몇 주 안에 배울 수 있고, 제네릭과 고급 타입 시스템을 익히는 데는 더 오래 걸려요. 앱에서는 연속 학습 기록, XP, 진행률 추적, 원하는 시간에 설정할 수 있는 일일 알림으로 꾸준한 학습 속도를 유지할 수 있어요.
수료증이 있나요?
네. Pro에는 수료증 시험이 포함되어 있으며, 시험에 합격하면 공유할 수 있는 수료증을 받을 수 있어요. 수료증에는 완료한 강의 학습 내용이 기록되며, Microsoft 자격증은 아니에요.
시작하기
오늘 처음으로 직접 입력하는 프로그램을 작성해 보세요
iOS와 Android에서 무료로 시작할 수 있으며, 22개 언어를 지원해요.
CoddyKit의 다른 앱
iOS 및 Android에서 이용할 수 있어요.