Age of Discovery

회사에서 타입스크립트를 사용하고 있는데 문법적으로 배워야 할게 많았고 기능 구현을 할 때도 타입 에러만 겨우 제거하는 급급한 내 모습이 마음에 들지 않았다. 타입스크립트를 효율적으로 사용하고 싶었는데 제목부터 'Effective'인 이 책을 망설임 없이 구매했다. 이 책은 타입스크립트를 좋은 방향으로 사용할 수 있게 도와준다. '타입스크립트는 이렇게 쓰면 좋고 이렇게 쓰면 안 좋다'라는 것을 명확하게 알려주는데 초보자 입장에서 모호했던 부분들을 정확히 짚어주는 역할뿐만 아니라 자바스크립트가 어떻게 모델링 됐는지 까지 다시 한번 생각하게 되는 좋은 기회였다. 타입스크립트를 '잘' 사용하고 싶다면 꼭 접해야 할 필독서로 추천한다.

https://jurgen-94.tistory.com/123 [TypeScript] - 타입 추론 as keyof typeof 디벨킷 프로젝트를 타입스크립트로 마이그레이션하는 작업 중에 타입 추론에 대해 더 찾아볼만한 기회가 생겼다. const contents = { first: , second: , third: , fourth: , }; {isOpen && ( { contents[key] } )} FAQ를 보 jurgen-94.tistory.com 며칠전에 올렸던 keyof typeof 글에 이어서 좀 더 자세히 알아봐야겠다는 생각에 타 블로그 글이랑 강의를 참고하여 연습했는데 그 과정을 공유하고자 한다. enum이란? enum은 열거형 변수로 정수를 하나로 합칠 때 편리한 기능이라고 한다. const..

디벨킷 프로젝트를 타입스크립트로 마이그레이션하는 작업 중에 타입 추론에 대해 더 찾아볼만한 기회가 생겼다. const contents = { first: , second: , third: , fourth: , }; {isOpen && ( { contents[key] } )} FAQ를 보여주는 코드이며 Wrapper로 contents[key]를 감싸 contents의 key와 props로 받은 key가 일치할경우 해당 컴포넌트를 렌더링한다. 해당 파일을 tsx로 변환했을 때 아래의 오류가 나오는데 Contents 객체에 있는 key 값이 Contents객체의 key 중 하나가 아닌 다른 문자열인 경우 오류를 발생시키는 것을 의미한다. typescript는 객체의 key와 value의 타입을 명확하게 추론하..

타입스크립트는 설치나 컴파일 등의 부분에서 까다로운 녀석이다. (eslint, prettier할 때도 마찬가지..) 그럼에도 사용하는 이유는 동적인 언어를 정적으로 바꿔주어 프로젝트 규모가커질수록 안정적인 유지보수가 가능하게 한다. 디버깅 또한 쉬워진다. (추상적인 오류메시지 해결) 그리고 타입을 미리 지정함으로서 누리는 혜택인 자동완성 기능은 타의 추종을 불허한다. 처음 세팅만 잘한다음 타입스크립트를 어느정도 공부해놓으면 안정적으로 개발할 수 있다. CRA로 세팅된 초기프로젝트를 만질일이 있었는데 clone후 typescript를 설치한다음 react에서 사용하는 router-dom이나 styled-components 등을 설치하려고 할 때 이런 오류가 났다. npm패키지로 리액트프로젝트를 하다보면 누..