차크라(chakra) UI css library WITH react

차크라(chakra) UI css library (인텔리기준)

터미널에 입력 해서 다운로드

터미널

npm i @chakra-ui/react @emotion/react @emotion/styled framer-motion

 

<ChakraProvider></ChakreProvider>를 Index.js에 import해주고 사용하는 App 위아래로 감싸준다.

 

---

BOX - 차크라 UI 에서 div 같은 역할 (div 안에 차크라 UI 쓰면 적용x)

Box를 사용할거니깐 사용하고자 하는 컴포넌트에 import 

import { Box } from "@chakra-ui/react";

 

속성명을 확인

적용