TypeScript

TypeScript?
자바스크립트의 슈퍼셋인 오픈소스 프로그래밍 언어이다. 마이크로소프트에서 개발, 유지하고 있으며 엄격한 문법을 지원한다.

TypeScript 사용 이유?

1. 에러의 사전 방지
2. 코드 가이드 및 자동 완성(개발 생산성 향상)

설치

TypeScript는 사용 방법에 따라 세 가지 설치 경로(npm 모듈, NuGet 패키지 또는 Visual Studio 확장)를 통해 설치할 수 있다.

내 컴퓨터에는 Node.js를 사용하므로 npm 으로 설치 진행한다.

아래의 명령어를 터미널에 입력하면 최신 버전으로 설치가 된다.

npm install -g typescript

TypeScript의 문법 확인 및 js파일로 연결 원한다면 tsc -w 를 터미널에 입력한다.

1. 이미 있는 React 프로젝트에 설치한다면?

npm install --save typescript @types/node @types/react @types/react-dom @types/jest

2. React 프로젝트를 새로 만든다면?

npx create-react-app my-app --template typescript

초기세팅

처음 파일을 만들고 설치가 완료되면 index.html 파일을 만들고 자바스크립트처럼 script src 에 js 파일을 연결한다.

<script src="index.js"></script>

실제 입력은 index.ts 에서 코딩하면 자동으로 index.js에 변환된 코드가 입력된다.

tsconfig.json에는 타입스크립트 ts 파일들을 .js 파일로 변환할 때 어떻게 변환할 것인지 세부설정이 가능하다.

tsconfig에 대해 알고 싶다면?(클릭)
코딩애플 추천 항목

TypeScript 기본 타입

• Boolean
• Number
• String
• Object
• Array
• Tuple
• Enum
• Any
• Void
• Null
• Undefined
• Never

String

let str: string = 'hi';

:를 이용하여 자바스크립트 코드에 타입을 정의하는 방식을 타입 표기(Type Annotation)라고 한다.

Number

let num: number = 10;

Boolean

let isLoggedIn: boolean = false;

참고 및 출처
https://www.typescriptlang.org/
https://joshua1988.github.io/ts/
코딩애플 강의
https://www.typescriptlang.org/tsconfig