TIL - 2020.08.23

오늘도 새벽에 작성하는 TIL! 언제나 새벽에 작성한다 ㅠㅠ😅(물론 아직 더 해야하지만,,,)

👉 오늘 한 일

• 프로젝트 개발
• 멘토링, 피드백

👉 공부한 내용

• 프로젝트 개발을 하는데 PropTypes를 해결하는데 오래 걸렸다.

const ItemList = [
  {
    id: 1,
    name: '1번입니다.',
    url: require('imgUrl'),
  },
  {
    id: 2,
    name: '2번입니다.',
    url: require('imgUrl'),
  },
  {/* 추가 리스트들 */}
];

위와 같은 구조의 List의 PropTypes를 검사해야하는데 object도 쓰고, array도 써봤는데 잘 안되다가 아래와 같은 구조임을 알아냈다.

ComponentName.propTypes = {
  ItemList: PropTypes.arrayOf(
    PropTypes.shape({
      id: PropTypes.number,
      name: PropTypes.string,
      url: PropTypes.node,
    }),
  ).isRequired,
};

답이 맞는지는 확실하진 않지만 warning이 사라져서 맞는거 같다. 저렇게 작성하고 보니 먼가 당연한 거 같은데 처음에는 잘 안 떠올랐다.
ItemList는 array이고 안에 구조는 shape를 사용해서 number, string, node를 검사하게 작성한 것이다.(혹시 틀린 부분있으면 알려주세요🙇‍♂️)

• 계속 프로젝트를 개발하며 Css를 수정하는데 알듯말듯하다 ㅠㅠ 기본적인 개념을 아는 것이랑 활용하는 건 너무 다른 것 같다...!

☕️ 잡담

프로젝트 개발하며 내가 알게된 내용을 정리해서 공부하고 공유하고 싶은데 개발 일정이랑 발표 일정때문에 끝나면 얼른 한번 정리해봐야겠다,,,!
그리고 코로나가 심해지는데 다들 조심하세요⚠️

---

📑 읽기 좋은 글

• PropTypes와 함께 하는 타입 확인 - React 한국 블로그