리액트 + 타입스크립트 무료 공부 자료 모음

 

기존에 타입스크립트를 깊게 공부하지 않고 프로젝트에 조금씩만 사용해보다가,

이번에 동아리 팀원들이 타입스크립트 스터디와 작은 토이프로젝트를 해보자고 했다.

그래서 이번 기회에 공부했던, 그리고 공부할 예정인 무료로 제공되는 타입스크립트 공부 자료들을 모두 작성하려고 한다.

물론 돈을 들여 책을 구입하거나 강의를 구입해서 공부하는 것도 좋지만,

나처럼 돈을 아껴야하는 취업준비생들을 위하여 무료인 리액트 + 타입스크립트 공부 자료들을 공유한다⭐️

 

타입스크립트 공부 자료 모음 글을 작성하기에 앞서,

최대한 최신 업데이트된 것과 내 기준에서 좋다고 생각하는 자료들로 선별하려고 했으며, 꾸준히 추가해나갈 예정이다.

(혹시 더 좋은 타입스크립트 관련 무료 자료들이 있다면 댓글로 알려주시면 감사하겠습니다.)

 

 

📄  공식 문서 및 핸드북 모음

• 타입스크립트 공식 문서 한글 번역본
  공식 문서를 한글로 번역해놔서 영어 문서보다 이해하기가 쉬운 편이다. 가끔 번역투로 기술된 부분은 한글이 더 어려울 때가 있기는 한데, 그럴 때만 해당 부분을 영어 문서에서 찾아보면 좋을 것 같다.
  
  
• 한눈에 보는 타입스크립트 by Heropy님
  이 자료는 공식 문서 버금갈 정도로 정리가 잘 되어있다고 개인적으로 생각한다.
  
  
• 타입스크립트 핸드북 by 캡틴판교님
  타입스크립트를 처음 접하는 사람이 쉽게 읽을 수 있도록 정리가 되어 있어서 좋지만, 심화적인 부분은 공식문서를 더 참고해야 한다.
  
  
• React TypeScript Cheatsheeats
  리액트 프로젝트에서 타입스크립트를 도입할 때 참고하면 좋은 문서이다.

 

📄  깃허브 저장소

• awesome-typescript-korean
  타입스크립트 한국어 자료들만 모아둔 깃허브 저장소이다. 강의 영상, 블로그, 책 등 다양한 자료들을 모아놨다. 다만 1년 전부터 업데이트를 하지 않아서 아쉬울 따름이다.
  
  
• react-redux-typescript-guide
  리액트와 리덕스를 사용한 프로젝트에서 타입스크립트를 어떻게 사용하는게 좋은지에 대한 가이드를 제공하고 있다.

 

📄  아티클

• 리액트 프로젝트에서 타입스크립트 사용하기 by Velopert님
  리액트와 리덕스 미들웨어까지 모두 다루고 있는 한국어 자료 중에 제일 잘 되어있다고 생각하는 자료이다. 자료를 읽으면서 따라 해 보기도 쉽고 이해하기 쉽게 되어 있는 것 같다.
  
  
• 리액트 컴포넌트를 타입스크립트 제네릭 함수처럼 쓰기 by TOAST UI 기술 블로그
  원문을 번역한 글인데, 재사용성이 높은 컴포넌트를 만들 때 제네릭(generic)을 어떻게 사용하는 게 좋은지 상세하게 기술되어 있는 좋은 자료다.
  
  
• 올해 버려야 할 타입스크립트 나쁜 버릇 10가지 by TOAST UI 기술 블로그
  타입스크립트를 사용할 때 하지 말아야하는 10가지를 기술해놨다. 작성한 코드가 장기적으로는 좋지 않은 코드가 되지 않도록 읽어보면 좋을 것 같다.
• Typescript React 응용편 by 클랩
  노마드코더를 통해 알게된 마커스님이 참여하신 프로젝트에 타입스크립트 관련 자료들이 모두 올라왔다. 이 프로젝트는 블로그 글들을 모아서 강의처럼 제공해주는 플랫폼인데, 입문자들에게 정말 도움이 되는 것 같다.

 

📄  강의 영상

• TypeScript Course for Beginners 2021
  타입스크립트 튜토리얼을 3시간동안 진행하는 영상인데 무료임에도 불구하고 퀄리티가 상당하다고 생각한다.
  
  
• 우아한 타입스크립트
  타입스크립트 기초와 실전에서 어떻게 사용하고 있는지 예제를 가지고 이웅재 님께서 우아한테크세미나를 진행하는 영상이다.
  
  
• 리액트에 타입스크립트를 적용해보자
  기존 리액트 프로젝트에 타입스크립트를 어떻게 적용해나가는지 쉽게 설명해주고 있는 영상이다.
  
  
• TypeScript 강좌
  짧은 영상들로 이뤄진 타입스크립트 강의 리스트이며, 기초용으로 듣기 괜찮은 것 같다.

 

 

---

 

# 유어링크 (urLink)

포스팅 마지막은 틈새 홍보 조금만,,ㅎ

 

🤔 도움이 되는 사이트를 어딘가에 저장은 했는데, 어디에 저장했는지 기억이 나지 않으신 적 있으신가요? 

🤔 사이트를 저장해두고 나중에 읽어야지 하다가, 잊어버리고 읽지 않게 된 적 있으신가요?

 

유어링크 크롬 확장 프로그램을 사용하면 사이트를 쉽게 저장하고 정리할 수 있고, 읽고 싶은 시간에 알림을 설정할 수 있어요!

시간 되실 때 한 번 사용해보시고 피드백 주시면 감사하겠습니다 🙇‍♀️

 

👉🏻  유어링크 홈페이지 구경해보기

👉🏻  유어링크 크롬 확장 프로그램 다운로드해보기

 

유어링크 (urLink) 실 사용 화면