Portfolio


const API_END_POINT = ‘https://’


interface ComponentProps extends HTMLAttributes<HTMLDivElement> {

}


const ButtonStyled = styled.button``;
=> 가장 루트 태그만.
=> 내부에 또 styled 가 필요하면 재량껏...


type Hello = {};


const Hello = {
} as const;


const AvatarStyled = styled(Avatar)<{ width: number; height: number }>(
  ({ width, height }) => ({
    width: `${width}px`,
    height: `${height}px`,
  }),
);

폴더 구조 및 변수명 협의

폴더 구조

네이밍, 변수명

component prop type

emotion tag name

type name

enum 필요 시 → `constants` 폴더에

component 네이밍

styled 관련 규칙

Page 컴포넌트 이름

hook 위치

boolean타입의 props는 값을 넣어서 사용하기

폴더 구조 및 변수명 협의

폴더 구조

네이밍, 변수명

component prop type

emotion tag name

type name

enum 필요 시 → constants 폴더에

component 네이밍

styled 관련 규칙

Page 컴포넌트 이름

hook 위치

boolean타입의 props는 값을 넣어서 사용하기

enum 필요 시 → `constants` 폴더에