하루 기록

JSX: Javascript를 확장시켜 만든 새로운 문법으로, 트랜스파일러(ex. babel)를 필수로 거쳐야 자바스크립트 런타임이 이해할 수 있는 JS 코드로 변환된다. xml 스타일의 트리 구문으로  JSX 구성 예시function HelloWorld () {  return (hello world);} babel로 컴파일 할 경우 JSX는 React.createElement로 요소를 만든다. // 리팩토링 전function HelloWorld ({ isHead, children }) {  return isHead       ? ({children})       :  ({children})}// 리팩토링 후function HelloWorld ({ isHead, children }) {  return R..

components ui libhttps://ui.shadcn.com/https://mui.com/tailwindcss 동적 css 도와주는 libhttps://cva.style/docscva 사용해보기 // 첫번째 인자 : 조합과 무관한 className // 두번째 인자 : 조합 const chipVariants = cva( ["text-sm", "border", "rounded-full", "px-2.5", "py-0.5"], { variants: { intent: { primary: "bg-blue-500 border-blue-500 text-white", secondary: "bg-gray-500 border-gray-500 ..