구현 과제 - 1만 시간의 법칙 - 병민

[merrybmc]

💡 프로젝트 실행 방법

git clone https://github.com/FRONTENDSCHOOL7/CodeReviewStudy
git switch 39-choByeongMin
npm install
npm start

⛏ 기술 스택

📌 배포 링크

https://10times-five.vercel.app/

📜 폴더 구조

📄 src
├── App.js
├── index.js
├── components
│   ├── header
│   │   ├── Header.jsx
│   │   └── header.styled.js
│   ├── input
│   │   ├── Input.tsx
│   │   └── input.styled.js
│   ├── output
│   │   ├── Output.tsx
│   │   └── output.styeld.js
│   ├── footer
│   │   ├── Footer.tsx
│   │   └── footer.styeld.js
├── pages
│   └── Mainpage.jsx
├── router
│   └── Router.jsx
└── images

🚀 기능 구현 내용

• 요구사항 기능 전체 구현 완료
• 모달 기능 구현
• 모바일 반응형 페이지 구현

[YennieJ]

병민님
favicon과 title을 적용하시고
폴더 구조를 보여주셔서 코드리뷰하기에 너무 좋았습니다!:)
배웠던 router를 활용하신것도 대단하신거같아요 ㅎㅎ

1. mobile 반응형에서 왼쪽으로 쏠림 현상이 있었습니다.

2. font 관련해서 한 파일에 모아주는것이 가독성에 도움이 될거 같습니다.

3. loading 화면이 추가되면 좋을꺼같아요.

4. styled-components import 하실 때 더 가독성이 좋은 방법을 공유합니다!
   https://velog.io/@jiseong/Styled-components%EC%9D%98-%EB%B6%88%ED%8E%B8%ED%96%88%EB%8D%98%EC%A0%90%EA%B3%BC-%EA%B0%9C%EC%84%A0%EB%B0%A9%EC%8B%9D

5. Modal.jsx
   props는 읽기 전용(https://reactjs-kr.firebaseapp.com/docs/components-and-props.html) 이기 때문에 직접적으로 setModalState를 받기 보다는 onCloseModal 을 상위 컴포넌트인 Output.jsx 로 올려서 onCloseModal 를 props로 받는게 더 적절할 것 같습니다:)

빠른 시간내에 구현하신 병민님께 박수를..!!
고생하셨습니다 :) 👍