Effective-Typescript

이펙티브 타입스크립트 스터디 🦆

---

📁 Project Structure

│
├─ Effective-Typescript
│     │
│     ├─ eugene028 (dir)
│     │     │
│     │     ├─  1장_타입스크립트_알아보기 (dir)
│     │     │    ├─ item1.md
│     │     │    ├─ item2.md
│     │     │    ├─ item3.md
│     │     │    ├─ ...
│     │     ├─  2장_타입스크립트의_타입_시스템 (dir)
│     │     │    ├─ item6.md
│     │     │    ├─ item7.md
│     │     │    ├─ ...
│     │     ├─ .. 이하동일
│     │
│     ├─ 9yujin (dir)
│     │     │
│     │     ├─  .. 이하동일
│     │
│     ├─ .. 이하 동일
│
│

---

🔏 Rule

1. 주차별 학습 범위

주차	학습	학습 범위
1주차	1장~2장 1/2	타입스크립트 알아보기 / 타입스크립트의 타입 시스템(item1 ~ 8) (p.1 ~ 52)
2주차	2장 1/2	타입스크립트의 타입 시스템(item9 ~ 18) (p.53 ~ 106)
3주차	3장	타입 추론 (p.107 ~ 154)
4주차	4장	타입 설계 (p.155 ~ 202)
5주차	5,6장	any 다루기 / 타입 선언과 @types (p.203 ~ 260)
6주차	7,8장	코드를 작성하고 실행하기 / 타입스크립트로 마이그레이션하기 (p.261 ~ 306)

2. 일정
   • 매주 수요일 오프라인 18 : 00 ~ 19 : 00
3. 커뮤니케이션 툴
   • 디스코드 이펙티브 타입스크립트 채널 활용
4. 스터디 방식
   • 각자 모든 item 공부 및 간단히 정리(요약+느낀점)
   • 요약 자료에 대한 발표 진행

---

👨🏻‍💻Process

1. 서적과 강의보고 자유롭게 정리
2. 본인 깃허브이름의 branch 생성 후 커밋
3. 발표 전까지 정리한 내용 Pull Request 생성
4. 수요일 오후 6시 발표
5. 발표&질문 끝나면 Approve 체크

---

📚 Items

1장 타입스크립트 알아보기

• 아이템 1 타입스크립트와 자바스크립트의 관계 이해하기
• 아이템 2 타입스크립트 설정 이해하기
• 아이템 3 코드 생성과 타입이 관계없음을 이해하기
• 아이템 4 구조적 타이핑에 익숙해지기
• 아이템 5 any 타입 지양하기

2장 타입스크립트의 타입 시스템

• 아이템 6 편집기를 사용하여 타입 시스템 탐색하기
• 아이템 7 타입이 값들의 집합이라고 생각하기
• 아이템 8 타입 공간과 값 공간의 심벌 구분하기
• 아이템 9 타입 단언보다는 타입 선언을 사용하기
• 아이템 10 객체 래퍼 타입 피하기
• 아이템 11 잉여 속성 체크의 한계 인지하기
• 아이템 12 함수 표현식에 타입 적용하기
• 아이템 13 타입과 인터페이스의 차이점 알기
• 아이템 14 타입 연산과 제너릭 사용으로 반복 줄이기
• 아이템 15 동적 데이터에 인덱스 시그니처 사용하기
• 아이템 16 number 인덱스 시그니처보다는 Array, 튜플, ArrayLike를 사용하기
• 아이템 17 변경 관련된 오류 방지를 위해 readonly 사용하기
• 아이템 18 매핑된 타입을 사용하여 값을 동기화하기

3장 타입 추론

• 아이템 19 추론 가능한 타입을 사용해 장황한 코드 방지하기
• 아이템 20 다른 타입에는 다른 변수 사용하기
• 아이템 21 타입 넓히기
• 아이템 22 타입 좁히기
• 아이템 23 한꺼번에 객체 생성하기
• 아이템 24 일관성 있는 별칭 사용하기
• 아이템 25 비동기 코드에는 콜백 대신 async 함수 사용하기
• 아이템 26 타입 추론에 문맥이 어떻게 사용되는지 이해하기
• 아이템 27 함수형 기법과 라이브러리로 타입 흐름 유지하기

4장 타입 설계

• 아이템 28 유효한 상태만 표현하는 타입을 지향하기
• 아이템 29 사용할 때는 너그럽게, 생성할 때는 엄격하게
• 아이템 30 문서에 타입 정보를 쓰지 않기
• 아이템 31 타입 주변에 null 값 배치하기
• 아이템 32 유니온의 인터페이스보다는 인터페이스의 유니온을 사용하기
• 아이템 33 string 타입보다 더 구체적인 타입 사용하기
• 아이템 34 부정확한 타입보다는 미완성 타입을 사용하기
• 아이템 35 데이터가 아닌, API와 명세를 보고 타입 만들기
• 아이템 36 해당 분야의 용어로 타입 이름 짓기
• 아이템 37 공식 명칭에는 상표를 붙이기

5장 any 다루기

• 아이템 38 any 타입은 가능한 한 좁은 범위에서만 사용하기
• 아이템 39 any를 구체적으로 변형해서 사용하기
• 아이템 40 함수 안으로 타입 단언문 감추기
• 아이템 41 any의 진화를 이해하기
• 아이템 42 모르는 타입의 값에는 any 대신 unknown을 사용하기
• 아이템 43 몽키 패치보다는 안전한 타입을 사용하기
• 아이템 44 타입 커버리지를 추적하여 타입 안전성 유지하기

6장 타입 선언과 @types

• 아이템 45 devDependencies에 typescript와 @types 추가하기
• 아이템 46 타입 선언과 관련된 세 가지 버전 이해하기
• 아이템 47 공개 API에 등장하는 모든 타입을 익스포트하기
• 아이템 48 API 주석에 TSDoc 사용하기
• 아이템 49 콜백에서 this에 대한 타입 제공하기
• 아이템 50 오버로딩 타입보다는 조건부 타입을 사용하기
• 아이템 51 의존성 분리를 위해 미러 타입을 사용하기
• 아이템 52 테스팅 타입의 함정에 주의하기

7장 코드를 작성하고 실행하기

• 아이템 53 타입스크립트 기능보다는 ECMAScript 기능을 사용하기
• 아이템 54 객체를 순회하는 노하우
• 아이템 55 DOM 계층 구조 이해하기
• 아이템 56 정보를 감추는 목적으로 private 사용하지 않기
• 아이템 57 소스맵을 사용하여 타입스크립트 디버깅하기

8장 타입스크립트로 마이그레이션하기

• 아이템 58 모던 자바스크립트로 작성하기
• 아이템 59 타입스크립트 도입 전에 @ts-check와 JSDoc으로 시험해 보기
• 아이템 60 allowJs로 타입스크립트와 자바스크립트 같이 사용하기
• 아이템 61 의존성 관계에 따라 모듈 단위로 전환하기
• 아이템 62 마이그레이션의 완성을 위해 noImplicitAny 설정하기

---

📝 해당 주차 과제 가이드

📤 프로젝트 열기

• 프로젝트를 하나 생성하고 VScode에서 원격 저장소를 연결해줍니다
• git init // 원격 저장소 init
• git remote -v https://github.com/GDSC-Hongik/Effective-Typescript.git // 원격 저장소 연결
• git pull origin main
• VScode의 terminal에서 자신의 branch로 checkout을 해주세요
  • git checkout origin [본인 github 아이디]
• 작업은 해당 본인 branch에서만 진행해주세요 (❌master branch❌)
  • git branch : 현재 branch 확인

🏡 작업공간 생성

• Effective-Typescript (프로젝트 루트 디렉토리)
  • 본인 github 아이디명의 디렉토리 (본인 github 아이디로 설정해주세요!)
    • 해당 단원
      • 해당 아이템

| 본인 github 아이디명의 디렉토리부터 만들고 시작하시면 됩니다! 😊

---

💾 중간 중간 commit 하기

• 파트 별로 작업을 끝냈거나 더 작은 단위로 작업을 끝낼 때 마다 commit을 해 주는 게 좋아요

• ❗commit convention ❗️

  • Feat: 새로운 기능 추가
  • Fix: 버그 수정
  • Docs: 문서 수정
  • Style: 코드 포맷팅, 세미콜론 누락, 코드 변경이 없는 경우
  • Refactor: 코드 리펙토링
  • Test: 테스트 코드, 리펙토링 테스트 코드 추가
  • Chore: 빌드 업무 수정, 패키지 매니저 수정

• 예시: git commit -m "[Feat(해당 파일): OO 기능 추가]"

✍🏻 README.md 파일 작성하기

• 해당 주차 책을 공부하면서 알게 된 부분, 중요하다고 생각한 부분이 있다면 정리해 주세요!

  • 개념 정립도, 요약도 모두 좋습니다! 😊

• 해당 주차 강의를 들으면서 새롭게 알게 된 사실이나 추가적으로 더 공부한 부분이 있다면 정리해 주세요!

  • 요약도, 복습도 모두 좋습니다! 😊😊

• .md 파일은 mark down 언어로 작성된 파일을 뜻해요

  • [참고] https://gist.github.com/ihoneymon/652be052a0727ad59601#24-코드

---

🙌🏻 Github 레포지토리에 push하기

• 해당 주차의 강의를 모두 듣고 작업을 모두 끝냈다면, 프로젝트 변경 사항을 remote repository(github repository)에 push 합니다
  • git push origin [본인 github 아이디 브랜치 명] : git에 등록되어 있는 origin(github repository)에 있는 자신의 branch로 프로젝트의 변경 사항을 반영합니다
• push를 완료했다면 스터디 repository에서 pull request를 진행합니다
• PR(Pull Request)시 메세지 제목은 다음과 같이 [OOO] 1주차 미션 라고 적은 후 create pull request 버튼을 눌러주세요
• PR : base: [main] <- compare: [본인 github 아이디]

---

⏰ 과제 제출 마감 기한

• 이펙티브 타입스크립트 스터디는 매주 수요일 오후 6시입니다! 스터디 시작 10분전까지 제출해주세용~!