타입스크립트를 시작하기 전에
타입스크립트 사용에 대해 고민해보기
- 마이크로소프트가 개발한 타입스크립트는 자바스크립트에 타입이 추가된 언어입니다. (자바스크립트 기본 문법에 타입스크립트의 문법을 추가한 언어)
- 타입을 지정할 필요가 없던 자바스크립트는 유연해서 배우기 쉽고 개발이 빠른 반면에 이 장점이 곧 단점이 되곤 했습니다. 자바스크립트만 오래 사용하던 개발자 중에서는 타입스크립트를 처음에 도입할 때 타입을 선언하고 엄격하게 개발하는 것이 오히려 생산성을 떨어트린다고 말하는 사람도 있었습니다.
- 하지만, 한번이라도 사용경험이 있다면 다시는 자바스크립트로 돌아가지 않을 정도로 사용성이 좋으며, 개발 단계에서 런타임 전에 에러를 잡고 문법 오류를 찾아낼 수 있어서 개발 속도가 빨라지고, 협업과 유지보수에서도 코드만 보고도 오해 없이 정확한 개발을 할 수 있어졌습니다. 이러한 장점들로 아직 시도를 해보지 않은 분들이 있다면 새로운 프로젝트를 하는 경우 타입스크립트 사용하는 것을 적극 권장합니다.
런타임과 컴파일 타임
- 타입스크립트는 정적타입언어이기 때문에 자바스크립트로 변환하는 컴파일을 거쳐야 하고, 이 컴파일타임에 오류를 알 수 있는 것입니다. 사용자가 직접 맞닿드리는 자바스크립트가 동작하는 브라우저에서의 런타임 전에 에러를 잡아낼 수 있으니 비용적으로, 시간적으로 상당히 생산성이 높아집니다.
리액트와 웹팩(Webpack), 바벨(Babel)
- 웹팩과 바벨이 무엇인지 간단히 설명해보겠습니다.
- 웹팩은 모듈 번들러 입니다.
- 모듈은 하나의 파일이고, 번들이란 여러 파일을 합쳐서 하나의 파일을 만들어준 결과 파일이라고 생각하면 됩니다.
- 번들러는 번들을 해주는 것입니다.
- 리액트 개발을 할 때 수 많은 파일을 만들고, 어떤 파일부터 시작되는지 신경쓰지 않고 서로 import를 하며 개발을 합니다. 이것을 가능하게 해주는 것이 바로 웹팩입니다.
- 바벨은 컴파일러 입니다.
- 컴파일러는 보통 사람이 이해하기 쉬운 고수준의 언어를 기계가 이해하기 쉬운 저수준의 언어로 바꿔주는 것을 컴파일러라고 합니다.
- 바벨은 자바스크립트를 입력받아 자바스크립트를 출력하는 것인데, 다만 es6코드를 받아서 브라우저에서 인식할 수 있는 es5코드로 바꿔주는 역할을 합니다. 그래서 개발자들은 브라우저에서 아직 지원하지 않는 자바스크립트 버전에 신경쓰지 않고 최신의 버전을 사용할 수 있습니다.
- Create React App이나 Next.js으로 타입스크립트를 사용하면 기본으로 컴파일러가 세팅되어있기 때문에 개발자가 특별히 설정할 것은 없습니다.
🐔참고문헌
위코드
위키백과
https://ko.wikipedia.org/wiki/%ED%83%80%EC%9E%85%EC%8A%A4%ED%81%AC%EB%A6%BD%ED%8A%B8