![]()
오류일기가 날아갔다,,, 뭐 별로 중요한 거 없겠지,,, '{ searchKeyword: string; }' 형식은 'string' 형식에 할당할 수 없습니다. import React from 'react'interface SearchResultProps { searchKeyWord: string }const SearchResult = (KeyWord: SearchResultProps) => { return {KeyWord.searchKeyWord};};export default SearchResult 우선 interface로 props의 타입을 지정해주고 받아오니 문제가 해결되었다.아마 search가 { search : ~~ } 이런 식으로 받아와서 그런 것 같다. 근데 아이러니하게 c..
![]()
이것저것 사용해봤으나... 결국 혼자서는 해결을 하지 못해 챗gpt의 도움을 빌렸다.아래는 수정된 코드 전문이다.코드더보기import { cva, } from 'class-variance-authority';import { cn } from '@/app/utils/cn';import React from 'react';import Image from 'next/image';import { ProfileProps } from './type';export const ProfileVariants = cva('', { variants: { size: { sm: 'flex size-[4rem] rounded-[1.25rem] object-cover', md: 'flex size-[7.2re..
![]()
버튼 컴포넌트를 다 만들고 나서 이미지 컴포넌트를 만들 차례가 됐다.이전에 버튼을 만들던 경험으로 size만 있을 것 같아서 size만 붙여넣었다. 코드더보기import { cva, type VariantProps } from 'class-variance-authority';import { cn } from '@/app/utils/cn';import { ButtonHTMLAttributes, FC } from 'react';import React from 'react';type Size = 'sm' | 'md' | 'lg';interface AvatarProps { size: Size;}const AvatarVariants = cva('rounded-[0.625rem] hover:brightness-9..
![]()
버튼 컴포넌트는 버튼을 만들 때 속성들을 매번 입력하기 귀찮고 코드가 길어져서 재사용을 하기 위해 만든 것이다.1차적으로[리팩토링] 재사용 가능한 버튼 컴포넌트 만들기이 블로그의 글을 참고해서 버튼 컴포넌트를 제작하였다.코드더보기import React from 'react';import { cva, VariantProps } from 'class-variance-authority';import { ReactNode } from 'react';type Color = 'blue' | 'white' | 'gray';type Size = 'sm' | 'md' | 'lg';interface ButtonProps { type?: 'submit' | undefined; // type이 undefined인 경우에는 ..
