front-end/React
Chakra UI React을 위한 UI 라이브러리
Hoon0211
2024. 2. 27. 10:58
728x90
1. chakra UI란
- Chakra UI는 React 애플리케이션의 UI를 구축하는 데 도움이 되는 UI 라이브러리
- 빠르고 일관된 UI를 쉽게 개발이 가능
npm i @chakra-ui/react @emotion/react @emotion/styled framer-motion
2. chakra UI 장점
- 컴포넌트 기반 디자인
컴포넌트 기반 디자인을 채택하여 개발자가 재사용 가능한 UI 요소를 쉽게 사용이 가능하며, 코드의 가독성을 향상시키고 유지 보수가 쉽습니다. - 스타일링과 테마 지원
스타일링을 위한 다양한 유틸리티와 테마를 제공을 합니다. - 접근성
기본적으로 WAI-ARIA 속성을 제공, 키보드 탐색 및 스크린 리더와의 호환성이 좋습니다.
3. chakra UI 단점
- 초기 로딩 시간
다양한 기능과 컴포넌트 제공으로 라이브러리 크기가 상대적으로 크며, 로딩의 속도에 단점이 있습니다. - 학습 시간의 소요
처음 사용시 생소한 방식으로 초기 학습 시간이 소요가 됩니다. - 커스텀마이징의 한계
다양한 스타일과 테마를 지원하지만, 디자이너가 요구한 디자인 구현이 불가능한 경우, 직접 스타일링 및 적정 수준의 디자이너와 협의가 필요합니다.
4. 참고사이트
Chakra UI - A simple, modular and accessible component library that gives you the building blocks you need to build your React a
Simple, Modular and Accessible UI Components for your React Applications. Built with Styled System
chakra-ui.com
728x90