react nodeBird 1-7(PostCard 만들기)

pages/index.js

components/PostCard.js

  PostCard 역시 큼직큼직하게 컴포넌트를 생각하고 기획하고, 기획을 하면 됩니다. 그리고 살을 붙이듯 구현을 해나가면 됩니다. 

PostCard는 post를 prop으로 받아옵니다.

  post를 props로 데이터를 index.js에서 받아오기때문에 propTypes를 설정해주어야합니다. proptypes설정시 object 항목을 더 자세하게 적어주고 싶다면, shape({ }) 안에 넣어주면 됩니다.

  또한, 옵셔널체이닝 연산자로

  const id = me && me.id; 에서 const id = me?.id;로 변경할 수 있으며, 이또한 const id = useSelector((state) => state.user.me?.id) 처럼 사용할 수도 있습니다. 

  state 값이 false일 때, 값을 true로 변경하거나 true값을 false로 변경하려면 

  const onToggleLike = useCallback(() => {

    setLiked((prev) => !prev)

   }, [ ]); 로 해주면 됩니다. 이전값(false)에 !를 붙이면 반대값(true)이 나오는 것을 이용합니다. 토글할 때 자주 쓰는 코드이므로 알아두는 것이 좋습니다.