제가 참여하고 있는 오픈소스 프로젝트에 대한 기록입니다.

UI 컴포넌트는 그냥 CSS 덩어리 정도인 것일까?

성능이 더 좋은 컴포넌트를 만들기 위해 알아두면 도움이 될 것들에 대해 소개합니다.

PropsWithChildren이라는 타입은 children: ReactNode라고 타입을 지정했을 때와 어떤 차이가 있을까요?

children을 사용할 때는 어떤 타입을 사용하면 될까요?

Render Props Pattern을 유용하게 사용할 수 있는 사례를 소개합니다.

뚱뚱한 컴포넌트를 날씬한 컴포넌트로 만들려면 어떤 점을 고려해야 할까요?

Dialog 컴포넌트를 확장성과 재사용성이 좋게 만들려면 어떻게 해야 할까요?

Button 컴포넌트를 확장성과 재사용성이 좋게 만들려면 어떻게 해야 할까요?

CSS 프로퍼티를 정렬하는 것은 개발 효율성을 높이는 데 큰 도움이 되죠. 모든 코드가 명확한 순서로 정리되어 있으면 가독성이 좋아지고, 원하는 프로퍼티를 찾기가 쉬워서 수정할 때도 한결 수월합니다.

여러분은 제네릭을 잘 활용하고 있나요? 최근에 회사에서 기존 컴포넌트를 제네릭으로 개선한 경험이 있어서 기록하는 겸 포스팅하려고 해요.

두 가지 방식을 모두 사용해본 결과, 개인적으로 Emotion의 CSS prop 방식이 훨씬 더 많은 장점을 가지고 있다고 느꼈습니다. 그 이유를 정리해보았습니다.