본문 바로가기

실무9

AG Grid 초기값 이후 업데이트가 안되는 이슈 트러블 슈팅 (with 라이브러리 코드 분석) 문제 상황// 생략 이러한 코드의 예상 동작은 무엇일까요?showHeader의 변경에 따라 headerHeight값이 변경되는것을 기대했습니다.하지만 처음 showHeader이 변한 이후에는 값 변경이 일어나지 않았습니다. 분석 동기1. AgGrid는 내부적으로 어떻게 되어있길래 처음에 한대로 props에 조건에 따라 headerHeight 업데이트가 안되는지 알기 위함2. 직접 ref로 접근하는게 AgGrid철학에 맞는것인지 파악하기 위함공식 문서 참고왜 그런지 공식 문서를 살펴보겠습니다. https://www.ag-grid.com/react-data-grid/grid-options/https://www.ag-grid.com/react-data-grid/grid-interface/#updating-gr.. 2025. 5. 9.
TanStack Query 내부구조 (with 코드) + 가이드 React Query 가이드 문서에서 제공하는 내용을 통해 사용법만 익혀서 프로젝트에 적용할 수도 있습니다. 그런데 내부의 동작을 파악하면 라이브러리를 올바르게 사용하는 데에 도움이 되고 디버깅 시간도 줄일 수 있을것 같아서 파악해보았습니다. 최대한 올바르게 파악하기 위하여 React Query 블로그에서 제공하는 자료와 github코드를 참고하였습니다.이러한 원리를 학습하고 이를 사내 프로젝트에 적용한것을 아래에서 예시를 들어 설명하겠습니다. 1. 주요 구성 요소React Query는 크게 Query Core와 Framework Specific로 나뉩니다.Query Core (프레임워크 독립적인 핵심 로직)QueryClient: React Query의 중심 객체로, 기본 설정(defaultOption.. 2025. 5. 6.
react-fast-marquee v1.6.5: Duration 계산 불안정으로 인한 속도 불일치 이슈 제기 해당 내용은 사내 프로젝트에서 라이브러리 이슈가 있어서 분석후 라이브러리 repo의 이슈에도 등록해놓았습니다.- 버전 : 1.6.5- 이슈 내용- 원인 분석(with 소스코드 분석)- 재현 방법- 이전 관련 PR 이력 파악https://github.com/justin-chu/react-fast-marquee/issues/130 티커 라이브러리를 사용하는데 다른 컴포넌트를 생성시 티커 컴포넌트의 속도가 달라지는 현상이 발생하였습니다.소스코드에서 speed로 계산하는 부분이 있나 살펴보겠습니다.https://github.com/justin-chu/react-fast-marquee/blob/master/src/components/Marquee.tsxmarqueeWidth, containerWidth, spee.. 2025. 3. 28.
디자이너, 다른 개발자와 소통하기 다른 개발자와 소통 - 코드리뷰테스트한 사항 정리전체적인 코드 흐름 파악버그 점검 다른 개발자와 소통 - 기존 코드를 이해하고 그림으로 남겨서 다른 팀원의 온보딩 단축하기사내 프로젝트에 투입된 초기에, 그리고 함께 개발해나가면서 다른 팀원의 코드를 이해하는것은 중요합니다.이 글은 다른 팀원의 코드를 이해하는 방식에 대하여 소개합니다.서버와 클라이언트 관계가 어떻게 되는지 큰 흐름에서 파악할 수 있습니다.이렇게 큰 흐름을 파악한 그림은 나중에 처음 프로젝트에 투입된 팀원에게도 빠르게 프로젝트를 파악하는데에 도움이 되기 때문에 그림으로 남겨둡니다.   디자이너와 소통 - Figma 디자인 이슈 템플릿사내 프로젝트를 진행하면서 기획이나 디자인이 나오더라도 개발하다보면 논의할 사항이 있을 수 밖에 없습니다.그런.. 2025. 3. 23.