나는 자바를 배웠었다..머디먼 옛날에..
그리고 지금은 자바스크립트를 한다.
이 뭔 뚱딴지같은 소리일까 싶지만 타입스크립트는 저 두놈을 합친거같은 녀석이란 생각이 들어 말을 꺼내봤다
자바에는 class나 inheritance, interface등의 개념이 존재한다. 그 녀석들을 자바스크립트에 쓰까 녹인 것이 타입스크립트라고 할 수 있겠다. 타입스크립트도 객체지향언어이기 때문이다.
그 외에도 자바와 꽤나 비슷한 부분을 찾았는데, 바로 '컴파일언어'인 부분이다. 코드 작성단계에서 오류감지가 가능한 부분이 있다는 것은 개발할 때 굉장한 이점이다. 일일히 command+S 눌러가면서 컴파일하고 빨갛고 까만 화면이 뜨고 콘솔을 켜고...그 과정을 생략해도 된다는 데서 타입스크립트를 배우고자 결심했다. 참고로 자바스크립트는 인터프리터언어이며, 런타임에서 오류를 발견할 수 있다. 그래서 저런 번거로운 과정이 있는것...ㅠㅠ
그럼에도 불구하고 자바스크립트와 100%호환된다. 프론트건 백엔드건 할 것 없이 자바스크립트를 사용할 수 있는 곳이라면 몇가지 패키지설치를 통해 타입스크립트 사용이 바로 가능하다. 특히 내가 배우고있는 리액트와 타입스크립트 조합은 매우 좋은편이다. 뷰, 앵귤러 또한 공식지원..
설치는 npm으로 한다. 혹은 vscode 플러그인으로 할 수도 있다.
(nodeJS가 깔려있는 내 기준으로 설명)
npm install -g typescript그리고 나는 리액트를 공부하고있으니 리액트에 ts얹는법에 대해 알아보겠다
먼저 CRA할때 -template typescript를 추가로 뒤에 붙여주면 된다. 그러면 그 이름의 폴더 안에 ts버전의 CRA가 생성됨.
추가적으로 필요한 라이브러리들(react-dom등 필요한것)을 설치해주면 된다.
참고로 TS를 기존 프로젝트에 얹는것은..오류 확률이 매우 높다고 한다..
(현재 프로젝트를 파놓고, 폴더에 파일에 초기세팅 다 해놓은 상태라 매우 멘붕임)
좌우지간에 다음으로
npm typescript --init을 입력해주면 tscongfig.json파일이 자동으로 생성되는데 이 파일을
{
"compilerOptions": {
"target": "es6",
"lib": [
"dom",
"dom.iterable",
"esnext"
],
"baseUrl": "./src",
"allowJs": true,
"skipLibCheck": true,
"esModuleInterop": true,
"allowSyntheticDefaultImports": true,
"strict": true,
"forceConsistentCasingInFileNames": true,
"noFallthroughCasesInSwitch": true,
"module": "esnext",
"moduleResolution": "node",
"resolveJsonModule": true,
"isolatedModules": true,
"noEmit": true,
"jsx": "react-jsx"
},
"include": [
"src"
],
}요로케 수정해주면 된다.
그러면 초기설정 끝이고 ts문법 맞춰서 개발하면됨
