타입스크립트 적용

코딩애플강의를 보고 정리했습니다.

자바스크립트는 타 언어에 비해 타입에 관대하다.
자바스크립트에서는 값을 할당하는 시점에 변수의 타입이 동적으로 결정되고, 변수의 타입을 언제든지 자유롭게 결정할 수 있다.
이렇게 타입에 관대한 자바스크립트는 좋을수도 나쁠수도있다.

1. 코드 천줄 만줄 백만줄을 짜다보면,
   
2. 남이짜던 자바스크립트 수정할 일이 생기게되면
   

아무리 유능한 사람이라도 실수를하기 마련인데 이를 방지해주고자 나온게 타입스크립트다.

HTML CSS JS 웹개발시 타입스크립트 적용

• 터미널에서 다음 입력(컴퓨터마다 한 번만 하면 됨)

npm install -g typescript

• .ts로 끝나는 파일 만들고 코드 작성
  (웹브라우저는 ts파일을 못읽기때문에,js파일로 변환 작업해줘야됨)

• js파일로 변환하려면 에디터에서 터미널 새로 열고 tsc -w 입력해두면 얘가 자동으로 ts파일을 js 파일로 근처에 변환해줌.
  (윈도우 Vscode에서 안된다면 cmd 터미널열고 해당 폴더 루트로 이동후 입력해보자)

• HTML파일 등에서 타입스크립트로 작성한 코드를 사용하려면 .ts가 아니라 변환된 .js 파일 사용
  

EX)

<script src='변환된파일.js'></script>

React 프로젝트에서 Typescript 사용할 경우

1. 기존 React 프로젝트에 타입스크립트 적용할 경우
   

• 작업폴더 경로에서 터미널 열고, 다음 입력
  (불안정하고 에러 많이남 되도록이면 처음부터 타입스크립트 적용된 리액트 프로젝트 생성 추천, yarn1버전 설치되어있으면 yarn add 명령어 써주는것도 추천)

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

1. 타입스크립트 적용된 리액트 프로젝트 새로 생성

• 새로 작업폴더 하나 만들고 에디터와 터미널 오픈후 다음 입력

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