storybook2 [React Storybook] chromatic 으로 배포하기, 배포 후 빈 화면 400 (Bad Request) 에러 해결 chromatic 📌chromatic 사용해서 Storybook 배포하여 공유하기📍 chromatic - 컴포넌트의 비주얼 테스트(Visual Regression Testing)와 자동 배포를 쉽게 할 수 있는 도구.- Storybook을 배포하여 팀원들과 공유할 수 있다. 🔗 Storybook 참고 내용 - 스토리북 관리자가 만든 무료 배포 서비스인 Chromatic을 사용하겠습니다. 🔗 Chromatic 📍Chromatic 가입 및 github 연동✅ GitHub로 회원 가입! ✅ Choose from GihHub 선택 - 레포지토리와 동기화- github > storybook이 설치된 레포지토리 선택 npm install --save-dev chromaticnpx chromatic --.. 2025. 2. 20. React, Storybook 시작하기 📍 Storybook이란?Storybook은 컴포넌트 단위 UI 개발 환경을 지원하는 오픈 소스 도구로, 실제 웹 애플리케이션의 환경과 별개로 UI 컴포넌트를 독립적으로 개발하고 테스트할 수 있게 해줍니다.컴포넌트의 문서화 도구로도 활용할 수 있습니다.🔗 Storybook 📍 Install Storybooknpx storybook@latest init ✅ 설치 완료!!/.storybook/src/stories폴더와 파일이 생성되었네요 😁📍 storybook 실행npm run storybook http://localhost:6006/ 확인 완료! 📍 살펴보기 ✅ EXAMPLE > Button, Header, Page 컴포넌트에 대해 확인할 수 있어요!- 컴포넌트를 만든다.- 컴포넌트.st.. 2025. 2. 12. 이전 1 다음 반응형