2022년 2월 7일 https://youtu.be/g-kauNOTVRY

npm install typescript @types/node @types/react @types/react-dom
@types/react-router-dom

1. 확장자 변경

Untitled

2. 에러가 난 부분 수정하기

type, interface, generic 사용

Untitled

//before
function onSubmit(e) {} 

//after
funciton onSubmit(e: React.FormEvent) {}

이런경우는 외우는 수 밖에 없다..

// Ref의 current는 rendering된 이후로도 없을 수 있다.
// 이유: 조건에 따라 input, button 등이 보였다 안보였다 하기 때문
// 결론: ref의 current를 사용할때는 null인지 아닌지 체크하는게 좋다 ✅

const engRef = useRef<HTMLInputElement>(null);
const korRef = useRef<HTMLInputElement>(null);
const dayRef = useRef<HTMLSelectElement>(null);

Untitled

if 절 안의 조건문으로 null check를 먼저한다 ⇒ if 내부 오류 해결 ✨