목록2024/11/17 (1)

My Boundary As Much As I Experienced

variants가 엄청난 디자인시스템의 버튼 컴포넌트를 설계해보자

설계 배경UI 개발에서 버튼은 필수적인 컴포넌트 중 하나이다.하지만 단순한 기능처럼 보여도 버튼 컴포넌트를 잘 설계하는 것은 생각보다 까다로운 작업이다.다양한 상태, 크기, 색상, 아이콘 배치 등 요구사항을 충족하면서도 유지보수성과 재사용성을 고려해야 하기 때문이다. 이번에 디자이너 분이 디자인 시스템을 본격적으로 만드시기 시작했는데 (내가 디자이너 시절에 만들었던 시안을 보고 작업하셨다ㅋㅋ..)다른 컴포넌트에 비해 버튼이 특히 매우 다양한 variants가 존재하는 걸 알 수 있다.이렇게 많은 variants들은 단순 prop들로만 관리하기 힘들었고, 나는 대안으로 컴파운드 컴포넌트 패턴을 활용하기로 했다. 이번 글에서는 컴파운드 컴포넌트 패턴과 디자인 시스템을 활용한 Button 컴포넌트를 어떻게 ..
FrontEnd/React 2024. 11. 17. 00:52
이전 Prev 1 Next 다음