Luckypear 어플리케이션을 추가하게 됨에 따라서 + 개인 개발 공부의 욕구가 더해져서 스토리북으로 디자인 시스템을 구축하기로 했다. 여기서는 디자인 시스템을 별도의 프로젝트로 구성해서 다른 프로젝트에서 가져다가 사용할 수 있도록 npm으로 배포하는 내용까지 다루어 볼 생각이다.
일단 필자는 Storybook을 많이 사용해보지 않았기때문에 나중에 본인에게 할 가이드 + 공부 목적으로 이 글을 작성 예정이다. 주로 bash 명령어와 설정 등을 다룰 예정이고, 기본적으로 이 글을 보는 사람들은 react나 js에 대한 지식이 있을 것이라고 생각하고 component에 대한 자세한 내용은 생략할 예정이다.
이 글에서 다룰 내용은 **Typography
**와 Button
컴포넌트이다.
Typography
Luckypear에서 사용하는 Text 컴포넌트이고, 대부분의 컴포년트에 기본적으로 적용될 것으로 보인다.Button
Luckypear에서 사용될 모든 버튼에대한 컴포넌트로, button state(disabled, loading 등)에 따라 표시되는 내용이 다르도록 구성할 예정이다.