카
카카오엔터테인먼트FE
November 4, 20212회
React Children 과 친해지기
간단 소개
React Children을 효과적으로 다루기 위한 React.Children 유틸리티 분석 및 활용법, 그리고 한계점과 대안을 제시합니다.
AI Summary
- React Children의 이해
- React 컴포넌트에서 children prop은 강력한 합성 모델을 구현하는 데 필수적입니다.
React.Children유틸리티는 children을 조작할 때 유용하며, 특히 요소들을 다르게 노출하거나 정렬, 필터링, 슬라이싱 등의 작업이 필요할 때 활용됩니다.
- React.Children.toArray() 메서드 분석
React.Children.toArray()는 children을 1차원 배열로 변환하고 각 child에 고유한 key를 할당하여 재조정 및 렌더링 최적화를 수행합니다.- 이 메서드는 children이 배열이 아닌 opaque data structure이거나 undefined일 때도 동작합니다.
- React.Children의 한계 및 대안
React.Children.toArray()는<React.Fragment>내부를 flatten하지 않는 문제가 있으며,react-keyed-flatten-children라이브러리를 통해 해결할 수 있습니다.- React.Children 유틸리티는 현재 유지보수 모드이며, 추후 다른 유틸리티로 대체될 수 있습니다.
Next Feeds
버즈빌 백엔드 기술 스택을 소개합니다
버즈빌의 백엔드 기술 스택은 Python, Go, gRPC, Kubernetes, Datadog 등을 활용하여 효율적인 광고 시스템을 구축하고 운영한다.
백엔드마이크로서비스gRPCKubernetesDatadog
2021. 10. 30.
버즈빌
타입스크립트 꿀팁
타입스크립트 사용 시 Enum 대신 Union Type, Index Signature 대신 Mapped Type을 사용하고, 외부 패키지 타입 치환 및 타입 가드를 활용하여 효율성을 높이는 팁을 제공합니다.
타입스크립트enumunion typemapped type타입 가드
2021. 10. 28.
카카오엔터테인먼트FE
타입스크립트 꿀팁
타입스크립트 사용 시 enum 대신 union type, index signature 대신 mapped type을 사용하고, 외부 패키지 타입 치환 및 타입 가드를 활용하여 효율성을 높이는 팁을 제공합니다.
typescriptenumunion typemapped typetype guard
2021. 10. 28.
카카오엔터테인먼트FE
글머리 기호(Bullet point) 중독 현상
글머리 기호의 과도한 사용을 지양하고, 효과적인 정보 전달을 위한 대안적 글쓰기 방식을 제시합니다.
글머리 기호Bullet point가독성정보 전달글쓰기
2021. 10. 27.
버즈빌
팀과 함께 성장하는 Engineering Manager의 역할
Engineering Manager의 역할과 성장, 번아웃 방지 전략을 제시하며, 팀원과 함께 성장하는 리더십의 중요성을 강조합니다.
Engineering Manager팀 관리1on1성장번아웃
2021. 10. 12.
뱅크샐러드
버즈빌 개발문화를 소개합니다.
버즈빌은 뛰어난 동료, 최신 기술, 자율적인 문화 속에서 개발자의 성장을 지원하며 함께 발전하는 문화를 추구합니다.
개발 문화성장동료최신 기술자율
2021. 9. 30.
버즈빌