프론트엔드 개발자들 사이에서 인기를 얻고 있는 UI 컴포넌트 라이브러리 shadcn/ui가 새로운 변화를 맞이했습니다. shadcn/ui는 깔끔한 디자인과 쉬운 커스터마이징으로 많은 개발자에게 사랑받고 있지만, 기본적으로 Tailwind CSS에 강하게 의존하고 있어 일부 개발자들은 불편함을 느끼곤 했습니다. 이러한 문제의식에서 출발한 'AriaX' 프로젝트는 React Aria와 StyleX를 활용하여 Tailwind CSS 없이 shadcn/ui 컴포넌트를 사용할 수 있는 새로운 대안을 제시했습니다.
AriaX는 shadcn/ui의 공식 React Aria 기반 버전을 구현 기준으로 삼아 개발되었습니다. 이는 생성되는 DOM 구조와 계산된 CSS 속성이 공식 버전과 일치하도록 목표로 했기 때문에, 새로운 컴포넌트 라이브러리임에도 불구하고 버그 발생 가능성을 줄일 수 있었습니다. 개발 과정에서는 공식 홈페이지의 예제 코드를 Storybook 스토리로 자동 변환하여 shadcn/ui 공식 버전과 AriaX 버전을 비교 렌더링하며 검증했고, 일부 애니메이션 및 인터랙션은 AI가 생성한 보조 테스트를 통해 시험하는 등 높은 완성도를 추구했습니다. 현재는 Vite 환경에서 정상 동작이 검증되었으며, Next.js 등 다른 프레임워크에서도 동작할 것으로 예상됩니다.
이 프로젝트의 가장 큰 의미는 개발자들에게 스타일링 선택의 자유를 제공한다는 점입니다. 기존 shadcn/ui 사용자는 Tailwind CSS를 원하지 않거나 다른 CSS 라이브러리를 시도하고 싶어도 선택의 폭이 좁았습니다. AriaX는 StyleX를 통해 스타일을 설정할 수 있는 shadcn/ui 컴포넌트 라이브러리를 제공함으로써 이러한 제약을 해소합니다. 이는 개발자들이 특정 기술 스택에 얽매이지 않고 프로젝트의 특성과 개인의 선호에 맞춰 유연하게 개발 환경을 구성할 수 있도록 돕는 중요한 진전으로 평가됩니다. 공식 레지스트리 디렉토리 등록도 준비 중이어서, 향후 더욱 간편하게 설치하고 활용할 수 있을 것으로 기대됩니다.