원티드 프리온보딩 프론트엔드 4차 1일차 이론

1. event function -> handler로 무조건 뺴놓기

2. css :focus-within
   CSS :focus-within 의사 클래스는 포커스를 받았거나, 포커스를 받은 요소를 포함하는 요소를 나타냅니다. 즉 스스로 :focus 의사 클래스와 일치하거나, 그 자손 중 하나가 :focus와 일치하는 요소를 나타냅니다. (섀도 트리 내부도 포함)

3. key 값 index 쓰지 말자.
   다른 map item key 값과 겹칠 수 있다.

	<div key={index}></div> // X
	<div key={`data-${index}`}></div> // O

4. classname 라이브러리 cx 추천 (연습해볼것!!!)
   style -> cx

5. useRef -> data 바꿀때 쓰지 말자

6. regex101.com -> 정규식 제대로 쓰자 email -> email regex w3c

7. event target -> x
   event current target -> O ----- event handler 부착 된것을 사용한다.

8. email != "" -> !! email

	if(email != "" ) {
    } // X
	if(!!email) {
    } // O

9. css 선택자는 className을 쓰자 Id는 쓰지 말자

10. 앱에서 필수로 쓰는 image들은 src 안으로 넣어놔라
    image 절대 경로는 import CheckActive from "images/check_active.png"
    svg 파일 가져오는 법 -> import {ReactCompoent as svgName} from "src/sheack.svg" -> 이러면 className 넣을 수 있음
    svg 파일 우리가 control 할 수 있어야 한다.
    ------> 개꿀팁

11. input -> autoCorrect, autoCapitalize ..... off

12. useOnClickOutside, useClickAway -> 밖 클릭
    react use -> 개꿀 라이브러리
    ex) useMount -> useEffect 빈 값일때

13. css -> checked

14. scroll monitor

중요) 멘토님이 주신 react setting 익숙해질 때까지 연습하기!!!!
https://github.com/miriyas/foundation