# storybook

52개의 포스트
post-thumbnail

스토리북의 기묘한 `export * as logo from './logo.png'`

스토리북은 조용히 살고싶다.

3일 전
·
2개의 댓글

2021.10.20

과제중이다.마크업은 거의 안해보았는데, 이번기회에 마크업도 열심히 공부할 수 있도록 해야겠다.assets를 다 받는다. \- icon은 깨지지않도록 svg나머지는 특성에 맞는 이미지파일로눈으로 확인하여 큰 영역별로 나눈다. \- 아토믹디자인을 적용한다면 베이스가되는

2021년 10월 19일
·
0개의 댓글
post-thumbnail

Yarn2, Storybook, Sass 조합기

최고다 스토리북쨩!

2021년 10월 16일
·
0개의 댓글
post-thumbnail

Storybook을 활용하여 Frontend에서 TDD 경험해보기 - 1 (UI test 편)

Storybook을 사용해서 간단하게 TDD를 적용해봅시다 - UI test편

2021년 10월 14일
·
0개의 댓글
post-thumbnail

Storybook

스토리 북은 UI컴포넌트를 데이터로 관리해주는 라이브러리이다. 이런 식으로 UI컴포넌트를 폴더 별로 모아서 따로따로 관리할수 있고 밑에 Control 부분에서 컴포넌트에 전달되는 props들을 변경해서 바로바로 데이터에 의한 UI변경을 즉각적으로 확인 할수 있다.사용하

2021년 10월 9일
·
0개의 댓글
post-thumbnail

Atomic Design과 Storybook

작년 네이버 커넥트재단에서 열린 부스트캠프에 Final Project 때 Atomic Design과 Storybook을 사용했던 경험에 대해서 소개한 글입니다.

2021년 9월 12일
·
0개의 댓글

Storybook 설치 및 실행

React에서 Storybook 설치 및 실행하는 방법React를 위한 Storybook 튜토리얼

2021년 9월 6일
·
0개의 댓글

storybook 셋업 이후 tsc issue(InterpolationWithTheme<any>)

프론트엔드 개발자와 디자이너와 협업, 디자인 QA 시간 줄이기 위해 storybook 도입중에 @emotion/core 의 global css type import 로 인한 이슈

2021년 9월 1일
·
0개의 댓글

Storybook 적용

설치 시작 Hamburger.tsx Hamburger.stories.tsx

2021년 9월 1일
·
0개의 댓글

CRA React 프로젝트에 StoryBook 설치 후 오류가 뜰 때

리액트 프로젝트에 Storybook을 세팅하고 yarn start을 하자 아래와 같은 오류가 발생했다...There might be a problem with the project dependency tree. It is likely not a bug in Create

2021년 8월 31일
·
0개의 댓글

Storybook에서 global style 적용하기

이번에 진행하기 될 프로젝트의 초기세팅을 하던 중에 storybook의 스타일과 어플리케이션의 스타일이 일치하지 않았던 문제가 있었습니다.이렇게 되면 storybook으로 컴포넌트를 개발하더라도 실제 앱에서 사용할때 다른 스타일이 적용되기 때문에 치명적인 문제였죠.원인

2021년 8월 14일
·
0개의 댓글
post-thumbnail

[Storybook] Storybook 200% 활용하기

🙌 들어가기 회사에 들어온 뒤 온보딩 과제를 끝내자마자, 첫 세미나를 맡게 되었습니다 🎉 이번 200% 시리즈는 Storybook 입니다!

2021년 8월 1일
·
11개의 댓글
post-thumbnail

[TIL-20210705] Component Driven Development(CDD) / Storybook / CSS in JS 방법론

Component Driven Development(CDD) Component Driven Development(CDD)는 컴포넌트 주위에 개발 프로세스를 고정하는 개발 방법론이다. 컴포넌트 수준에서 시작해 페이지나 화면 수준에서 끝나는 것으로 "바닥부터 끝까지"(b

2021년 7월 9일
·
2개의 댓글
post-thumbnail

React에 Storybook 도입하기

Storybook이란? Storybook은 컴포넌트 단위의 UI 개발 환경을 지원하는 도구입니다. Storybook을 사용하면 실제 웹 어플리케이션의 환경과 별개로 컴포넌트 단위의 UI 개발 진행이 가능합니다. 그 외에도 컴포넌트의 문서화 도구로도 사용이 가능합

2021년 6월 22일
·
0개의 댓글
post-thumbnail

[TIL] StoryBook

state management 관리를 예로 Jest, Typescript, Mocha 등등 logic testing을 하기 위한 라이브러리들이 많은데, 정작 프론트엔드에서 View(UI)를 테스트? 하는 라이브러리에는 등한시하다.Component를 Isolated 된

2021년 6월 14일
·
0개의 댓글
post-thumbnail

React와 Typescript로 나만의 TodoList만들기 2편 - 컴포넌트 만들기 그리고 Storybook

React와 Typescript로 나만의 TodoList를 만들기 이번에는 드디어 Component를 만들어보기로 하겠다.

2021년 6월 6일
·
0개의 댓글

storybook?

Storybook은 재사용을 위해 구성 요소를 문서화하고 버그를 방지하기 위해 구성 요소를 자동으로 시각적으로 테스트 하는 데 도움이 됩니다.복잡한 개발 환경 위에서 테스트를 하지 않아도 되므로 ui 테스팅이 쉬워집니다.

2021년 6월 2일
·
0개의 댓글