[지현] 과제

[doreming16]

📍 과제

리팩토링 사항 정리 & 리팩토링 진행

---

내용들을 공부 ... 는 했으나 적용해보기에 엄두가 안났습니다 ㅠ.ㅠㅠ벌금 달게 받겠습니다

---

## ✏ 리팩토링 사항 정리 - 스장님께 검토 받았습니다

추가 공부해볼 것

1. dependencies 공부
2. .env 사용(.env.development.local ... 대신에)
3. <index.html> : <meta name="--", content="--" />
4. context API의 사용
   -- in BaseHeader.tsx
   -- 상태관리를 썼으면 좋았을 것 같다 -> 무슨 말일까.. ?! 공부해보기
5. 현명오빠가 hook을 썼지만 내가 쓴 건 아니니까 다시 한 번 보고 공부하기
6. 시작부터 TS 환경 구축하는 방법 ..? -> 위의 사항들과 관련이 있을까 ???

고쳐볼 것

1. <Home.tsx> : 모달이 실행되는 페이지의 컴포넌트에서 모달을 form으로 전달하지 말고, Modal.tsx(모달 컴포넌트) 자체에서 모달의 type을 전달해서 타입에 맞게 특정 모달을 전달하는 방식을 사용해보기
   -- 세은민혁 팀처럼 아예 각각 특정한 모달을 설정해두고
   -- 그 모달 컴포넌트 자체를 불러온다는 의미일까???
2. dummy data : src 하위에 폴더 따로 두고 저장해보기
3. <SurveyForm.tsx> : [body, setBody] -- 대신 bodyInput, bodyText 등으로 변수명 변경하기
4. <useInput.tsx> line 7-10 : 배열 대신 객체로
5. <card.tsx> : key 값에 Idx 쓰지 않습니다 !! -> uuid 적용해보기?!
6. 폴더명 소문자로!!!! .. 함수형 컴포넌트 아닌 이상 다 소문자로 쓰자

📖 Modal 중심 레퍼런스

• React DOM - createPortal
• Context API - createContext
• Modal 내부 {children}

📚 참고했던 레퍼런스들

https://www.freecodecamp.org/korean/news/cobojareul-wihan-riaegteu-context-wanbyeog-gaideu-2021/
https://velog.io/@velopert/react-portals
https://leetrue.hashnode.dev/component-lab-modal