Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

스토리북 및 크로마틱 작업 #57

Merged
merged 7 commits into from
Dec 29, 2023

Conversation

hyoribogo
Copy link
Contributor

🧩 이슈 번호

✅ 작업 사항

image

스토리북 세팅

https://storybook.js.org/recipes/next/
https://storybook.js.org/recipes/tailwindcss/
https://storybook.js.org/docs/builders/webpack#import-a-custom-webpack-configuration

를 참고해서 세팅했습니다.

크로마틱 세팅

https://www.chromatic.com/docs/
https://storybook.js.org/tutorials/intro-to-storybook/react/ko/deploy/

크로마틱 배포 링크: https://658d9b99caff5d98aa4a3090-vagchcrpof.chromatic.com/
빌드 링크: https://www.chromatic.com/builds?appId=658d9b99caff5d98aa4a3090

👩‍💻 공유 포인트 및 논의 사항

workflows에 chromatic.yml을 생성했습니다.
main을 제외한 브랜치에 push할 때마다 크로마틱에 자동 배포하도록 설정해주었어요.

image
image
image

제대로 배포가 잘 되는 것 같습니다!

아직 스토리는 작성을 못해서, 노션에 정리해둔 내용 바탕으로 내일 질문 드리도록 하겠습니다.

@hyoribogo hyoribogo added the 기능 기능을 추가합니다. label Dec 28, 2023
@hyoribogo hyoribogo self-assigned this Dec 28, 2023
@hyoribogo hyoribogo linked an issue Dec 28, 2023 that may be closed by this pull request
2 tasks
Copy link
Member

@bbearcookie bbearcookie left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

오.. 크로마틱 신기하네요 😮
세팅에 참고하셨던 링크도 자세히 공유해주셔서 감사합니다~

name: '@storybook/nextjs',
options: {},
},
webpackFinal: async (config) => {
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

아하!! create-next-app 으로 세팅한 next.js 프로젝트도 웹팩 번들러를 활용하는 것 이었군요!!
Turbopack 인줄.. 😅

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

스토리북이 웹팩을 사용하는 것 같은데 저도 확실하지 않네요..!

name: '@storybook/nextjs',
options: {},
},
webpackFinal: async (config) => {
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

스토리북이 웹팩을 사용하는 것 같은데 저도 확실하지 않네요..!

@hyoribogo hyoribogo merged commit 8acf5e3 into main Dec 29, 2023
3 checks passed
@hyoribogo hyoribogo deleted the 스토리북-및-크로마틱-작업 branch December 29, 2023 06:05
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
기능 기능을 추가합니다.
Projects
None yet
Development

Successfully merging this pull request may close these issues.

스토리북 및 크로마틱 작업
3 participants