[타임어택9기][리뉴얼] 타입스크립트 올인원 : Part0. 기본 세팅하기- (0) : 기본 세팅하기

 

 

섹션 0 기본 세팅하기

 

 

 

 

(1) 타입스크립트 강좌를 리뉴얼한 이유 

- 실습을 하면서 배우는 것도 (문법) 중요하지만, 남이 짠 타입에 대해서 분석하는 법을 아는 것도 중요하다는 것을 알게 됨
- 기본 문법 + 6개 라이브러의 타입을 공부 플랜

타입스크립트를 배워야하는 이유
- 안전성이 자바스크립트에 비해 높다고 생각
안정적 = 에러가 덜 난다 = 책임질 게 줄어든다

 

- 러닝커브가 높지 않다

타입스크립트 공식문서 ★ ★ ★)
- 핸드북 필독!!
- 버전 1.1부터 최신까지 읽어보기
- 강의 수강
=> 시너지!!

 

 

 

 

(2) 타입스크립트를 할 때 알아야 할 단 한가지 

[기본지식]
메인 룰 (from https://github.com/ZeroCho/ts-all-in-one)

- typescript는 최종적으로 javascript로 변환된다. (매우 중요) 순전한 typescript 코드를 돌릴 수 있는 것은 deno이나 대중화되지가 않았음. 브라우저, 노드는 모두 js 파일을 실행한다.
- typescript는 언어이자 컴파일러(tsc)이다. 컴파일러는 ts 코드를 js로 바꿔준다.
- tsc는 tsconfig.json(tsc --init 시 생성)에 따라 ts 코드를 js(tsc 시 생성)로 바꿔준다. 인풋인 ts와 아웃풋인 js 모두에 영향을 끼치므로 tsconfig.json 설정을 반드시 봐야한다.
- 단순히 타입 검사만 하고싶다면 tsc --noEmit 하면 된다.
- ts 파일을 실행하는 게 아니라 결과물인 js를 실행해야 한다.

※ 브라우저는 타입스크립트를 알지 못한다. 자바스크립트만 실행시킨다. 
※ 대중적인 런타입(브라우저 + 노드js)은 존재하지 않는다.

 

프로젝트 파일에서 가장 중요한 메인 파일 2가지
ts.config.json
- 타입스크립트 메인
package.json
- 노드 개발 메인

 

 

 

 

(3) 노드와 VS Code, 타입스크립트 설치하기 

에디터가 필수가 됨. VS Code나 웹스톰 반드시 필요. 메모장으로 코딩 불가능한 지경에 이름.

터미널 오픈 
: tsc --noEmit 입력 > 터미널 에러 > node 필요 > npm init -y (tsc 폴더가 노드 프로젝트가 됨, 노드 프로젝트 설정 모아놓은 곳 - package.json) > 타입스크립트 설치 (npm i typescript) > 
> tsc(ts compiler) 명령어 사용 가능 but, error > npx tsc 

 

 

(4) tsconfig.json과 tsc 사용해보기

- 타입스크립트 프로젝트 시작 시, 반드시 ts.config.json, package.json 두 파일 만들고 시작해야 함
- 개인(제로초) 의견: tsconfig.json에서 그냥 esModuleInterop: true, strict: true 두 개만 주로 켜놓는 편. strict: true가 핵심임.