Chakra UI

 

기본적인 사용 방법

1. 설치

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

 

2. 컴포넌트에서 프로바이더를 꼭 넣어주어야 적용된다.

<ChakraProvider> <컴포넌트/> <ChakraProvider/>

import * as React from 'react'

// 1. import `ChakraProvider` component
import { ChakraProvider } from '@chakra-ui/react'

function App() {
  // 2. Wrap ChakraProvider at the root of your app
  return (
    <ChakraProvider>
      <TheRestOfYourApplication />
    </ChakraProvider>
  )
}

 

 

 

---

 

차크라?

나루토? 설마?

했는데 진짜로 문서 예시에 나루토가 나온다

 

https://chakra-ui.com/docs/components/tabs/usage#fitted-tabs

Chakra UI - A simple, modular and accessible component library that gives you the building blocks you need to build your React a