Docs(design-system): CSS 스타일 수정 및 스토리북 데이터 업데이트 #305
Conversation
|
🏴☠️ Storybook 확인: 🔗 https://677bd6bc4909f2f48f4e0f42-tbxjtwopdu.chromatic.com/ |
|
실제 이미지로 변경한다는 것은 긍정적이네요~ |
There was a problem hiding this comment.
음 저의 개인적인 생각을 말씀드리자면, UI 테스트의 본질적인 목적(레이아웃, 반응형, 인터랙션 확인 등)을 위해서라면 더미데이터만으로 충분히 해결된다고 생각해요!
S3 버킷 URL을 직접 사용하는 것은 어찌됐든 외부 의존성이 생기는데, 실제 서비스와 최대한 동일한 환경에서 테스트 할 수 있다는 장점이 있으나 굳이 api 테스트를 스토리북에서 해야되나라는 생각이 들어요
어차피 데이터는 계속 바뀌는데 스토리북에서도 실제 데이터 url을 사용한다는 것이,, 불필요한 리소스를 들이는게 아닌가 생각이 듭니다. 현재 더미데이터 사진을 그대로 유지하거나, 정적 파일로 저장된 목데이터를 사용하는게 어떤가요?
저도 자세한 레퍼런스나 방법론을 알고있는 건 아니지만 더미데이터보단 실제 이미지를 삽입하면 디자인레벨에서 storybook 으로 디테일한 부분에서 피드백이 오고가지 않을까? 하는 고민이었습니다 한서님 말씀도 일리가 있는 것 같으니 한번 디자인 파트원 분들에게도 여쭤보겠습니다!
어쨋든 storybook의 장점은 백엔드와 독립된 API 모킹으로 UI를 테스트할 수 있다는 점에 있다고 생각해요!
|
📌 Summary
📚 Tasks
디자인 시스템 내에서
Card의 mock 데이터를 실제 이미지 파일로 변경합니다👀 To Reviewer
Card 컴포넌트의 샘플 데이터를 실제 이미지 url 로 변경해두었습니다. UI를 스토리북 내에서 판단하기에 해당 방법이 더 적합하다고 생각했어요.
일단 이러한 방법이 옳은지에 대해서도 잘 모르겠어요.. 레퍼런스가 많이 없어서 추가적으로 고민되는 부분은
위 사진과 같이 현재
Festival Card도 마찬가지로 dummy data 로 설정되어있어요. 스토리북에서 mock 데이터를 활용하는 이유는 서버와의 의존성을 낮추기 위함인데Card컴포넌트의 경우 현재 사용하는SpotifyAPI 에서 가져오는 url 이라 무관할 것 같지만,Festival Card에 사용되는 이미지 url 의 경우 서버 자체 S3 버킷에서 제공하는 파일 url 이라 dummy data를 수정해야 할지 고민이에요...
제가 생각해본 방법은 아래와 같아요
2번의 경우
이 의견에도 동의하지 않는다고 생각할 수 있어요 의견 부탁드립니다~
💦반대가 많을 시 브랜치 삭제하고 튑니다. 브삭튀 🛵💦💦💦💦
📸 Screenshot
Before
After
before
after
before
After
before
after