Storybookstorybook 공식에 나와 있는 예제를 따라하면 오류가 난다고 해서… 기본 예제를 그냥 복붙해서 가져다 쓰는 게 마음이 편하다.DesciprtionButtonProps에 적힌 내용이 Description 열에 들어간다. 근데 응집도를 더 높이는 방법을 추천한다. export interface ButtonProps { /** * Is this the principal call to action on the page? */ primary?: boolean; backgroundColor?: string; size?: 'small' | 'medium' | 'large'; label: string; onClick?: () => void; }argTypes 내부에..
크롬 개발자 창 사용하기단축명령어cmd + option + I: 최근 사용한 탭을 열어준다.cmd + shift + P: 명령어 창을 열어준다.cmd + option + J: 바로 콘솔창이 열린다.HTML요소 수정하기태그 이름이나 태그 내부에 있는 content 등을 개발자도구에서 편집할 수 있다. 위치 이동 및 속성 수정도 가능하다.CSS 수정하기CSS 스타일에 있는 네모난 색상 칸을 클릭하면 스포이드로 색 추출이 가능하다.텍스트 명도대비content 요소를 선택해서 마우스를 가져다대면 contrast로 확인이 가능하다.가상 클래스 확인요소 상태 전환 버튼을 통해 hover, active 등 여러 상태의 CSS를 확인하거나 특정 클래스를 추가할 수 있다.Javascript 비활성화환경설정 > 디버거 >..