📝 오늘 학습한 내용
22/06/08
오늘 페어 분과 함께 2일간 리액트로 트위터 댓글 기능 구현을 만들었다. 데이터베이스나 서버는 없지만, 댓글 기능을 구현하며 리액트와 좀 더 친숙해지려 했지만 아직은 어렵다.. 중요한 props, state를 배웠는데 잘 활용하고 싶다.
🤔 어려웠던 내용
아무래도 댓글을 입력하고 버튼 클릭시 새로 화면에 렌더링 되도록 하는 부분이 어려웠다.. 이분을 잘 이해못해서 삽질을 많이한것같다.
dummyTweets 은 회원정보 객체를 담고있는 배열
댓글 기능 구현 일부분인데, 버튼 클릭 시 새로운 tweet을 dummyTweets 파일에 할당하여 state로 재렌더링 해야 되는 문제였다. 처음에는 구조 분해 할당 사용하지 않고 바로 unshift 메서드 사용해서
원본 데이터를 바꾸려 시도했으나 계속 실패했고.. 구글링과 삽질을 통해 저 코드가 나왔다.
리액트는 상태 불변성 때문에 리렌더링 하려면 얕은 복사를 해야 됨을 알게 되었다.
리렌더링시 참조 값을 비교하여 변경을 감지하는데, 얕은 복사를 통해 참조 값을 바꿔야 함을 배웠다.
그리고 probs 필요성을 더 공부하고 싶다.. 아직도 언제 사용하면 적절한지 판단이 잘 안 선다.
코드 스테이츠에서 제공하는 예제만으로는 아직 부족한 것 같다.
🌼 결론
리액트를 짧게 사용했는데, HTML은 이제 못 쓸 것 같다 아주 편리하고 코드도 간결하여 유용하다.
컴포넌트를 만들 때 hook만 배우다 보니 클래스 형은 어떤지 잘 모르겠다. 공식 사이트에서도 함수형 컴포넌트를 권장하니 나중에 필요하면 클래스 형도 학습해야겠다.
페어와 함께 2일간 댓글 기능 구현하며 재밌었고 잘 배웠다. 서로 모르는 부분을 먼저 해결한 사람이 공유하며 같이 문제 해결을 하니 시간도 절약하고 즐거웠다.
