항해 2주차! - react 작동원리 살펴보기!

1. 문제 (과제, 프로젝트를 진행하면서 부딪혔던 기술적인 문제)

리액트라는 프레임워크를 어떻게 사용하는줄만 알았지 어떻게 동작되는지는 몰랐습니다. 그저 면접 질문을 답하기 위해서 얕게 알았을뿐이어서 구현하는데 큰 어려움들이 있었습니다. 그리고 다른 부분에서는 통과했지만, 한요소에서 이벤트를 구현해주는 함수를 구현하는데, 계속 같은 이벤트를 붙이는 바람에 제대로 최적화가 안되는 문제가 있었습니다.

2. 시도

계속 같은 이벤트를 붙이는 문제가 발생한 것을 인식해서 ai나, 다른 pr들을 참고했는데요.

3. 해결

항해 디스코드에서 과제 트러블 슈팅 공유한 글을 봤습니다.
이벤트가 중복 호출되는 것에서
1. 이벤트 핸들러를 순회하며 등록하는 경우 핸들러를 등록하기전 해제하기.
2. 이벤트명으로 순회하며 등록해주는 경우 한 번만 등록하기

제 코드의 경우는 1번 경우였습니다. 등록을 했지만, 해제하는 로직이 없었기 때문에
계속 중복적으로 이벤트 핸들러가 붙었던 것이죠.

4. 알게된 것

리액트 동작원리를 정말 완벽하게 파악하고 이해한 것은 아닙니다만, 버츄얼돔이 생성되면서 어떤부분을 고려했고, 그부분이 최적화 하는데 어떻게 도움이 되는지에 대해서 조금이나마 알게되는 시간이었습니다.

Keep : 현재 만족하고 계속 유지할 부분

또다시.. 포기하지 않는것...!! 다음주도 시간이 얼마없지만 화이팅

Problem : 개선이 필요하다고 생각하는 문제점

P1. 팀원들과 어떤 문제에 대해서 좀 더 대화해볼 것

Try : 문제점을 해결하기 위해 시도해야 할 것

내가 마음을 열고 대화해볼것!