컴포넌트라이브러리 (component library)
쉽게 풀면
버튼이나 입력창처럼 자주 쓰는 화면 부품들을 미리 표준화해서 모아둔 자료 창고예요. 그래서 버튼이나 입력창을 매번 새로 만들지 않고 미리 만들어 둔 걸 가져다 써요.
왜 중요한가
컴포넌트 라이브러리는 버튼, 입력창, 모달 같은 UI 부품을 코드와 디자인 파일로 구현해 재사용하도록 모은 것으로, 여러 팀이 같은 부품을 조립하면 화면 간 일관성이 자동으로 확보되고 개발 시간이 단축됩니다. 디자인 시스템의 실행 단위이며, 접근성 처리를 한 번 컴포넌트에 넣으면 전 제품에 전파된다는 점이 실무에서 가장 큰 이점으로 꼽힙니다. 개발 속도를 높이고 여러 화면 간 일관성을 유지하는 데 핵심적인 역할을 한다.
논문에서는 이렇게 쓰입니다
표준화된 구성 요소 재사용을 통해 일관성 문제를 해결한 개발 사례를 설명한다.
이는 컴포넌트라이브러리가 단순한 디자인 보관함이 아니라, 개발과 디자인 사이의 일관성과 작업 효율을 함께 높이는 자산임을 보여준다.
조금 더 깊게 보면
컴포넌트 라이브러리와 디자인 시스템은 자주 동일시되지만, 라이브러리는 부품 창고이고 디자인 시스템은 원칙·토큰·가이드라인·거버넌스까지 포함하는 상위 개념입니다. 라이브러리가 커지면 한 부품에 온갖 옵션이 붙어 유지가 어려워지는 문제가 생기며, 채택률이 낮으면 팀마다 변형 부품을 만들어 오히려 파편화가 심해집니다. 그래서 기여 절차와 폐기 정책 같은 거버넌스가 부품 자체보다 성패를 좌우합니다. 컴포넌트 라이브러리는 버튼이나 입력창 같은 요소를 코드로 미리 구현해 재사용하게 하며, 디자인 도구의 컴포넌트와 실제 코드 컴포넌트가 어긋나면 화면과 구현 결과가 불일치하는 문제가 생긴다. 이 불일치를 줄이기 위해 디자인 도구의 컴포넌트 이름과 코드의 컴포넌트 이름을 동일하게 맞추는 관행이 자리잡았다.
주의할 점
컴포넌트라이브러리의 항목이 과도하게 늘어나면 어떤 컴포넌트를 사용할지 팀원들이 혼란을 겪어 오히려 일관성이 저해될 수 있다. 디자인 도구의 컴포넌트와 실제 코드 컴포넌트 이름이 어긋나면 화면과 구현 결과가 불일치할 수 있다.