![[GitHub Action / Chromatic] 스토리북 PR 미리보기 배포 (feat. yarn)](https://img1.daumcdn.net/thumb/R750x0/?scode=mtistory2&fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2Fsr67M%2FbtsI0zywHah%2FpY81Ov2aFMvymIHFZKRDN0%2Fimg.png)
시작하며...이번 프로젝트에서 Storybook 을 사용하게 되었다. 그런데 공통 컴포넌트를 만들고 Storybook 을 작성한 후 Pull Request 를 올렸을 때, 리뷰어들을 Storybook 에 반영된 것을 바로 시각적으로 확인할 수 없다. 그래서 이를 해결하기 위해 GitHub Action 을 사용하여 Storybook 을 Chromatic 배포를 하여 PR 을 올릴 때, 미리 보기 배포 주소를 보여주는 것을 구현하였다. Chromatic 배포Storybook 은 Chromatic 을 사용하여 배포를 할 수 있다. Visual testing & review for web user interfacesChromatic scans every possible UI state across browse..
![[GitHub] merge 후 브랜치 자동삭제 안되는 이유 (feat. Branch protection rules)](https://img1.daumcdn.net/thumb/R750x0/?scode=mtistory2&fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2FdFv9jn%2FbtsISpBvcSF%2FmzFbmoP6IGylDhCmtqUyZk%2Fimg.png)
시작하며...분명 Automatically delete head branches 옵션을 선택하여 PR 을 올려 merge 가 되었을 때, 해당 브랜치가 삭제되도록 설정하였다.그러나 merge 가 되었음에도 불구하고 브랜치가 삭제되지 않는 현상을 발견하였다. 문제 해결하기해당 문제에 대해 의문이 있었는데 다행히 이 문제를 해결할 수 있었다! 결론은 내 문제 ㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋ 바로 Branch Protection Rules 때문이었다! Branch Protection Rules 설정PR 을 올릴 때 2명 이상한테 Approve 를 받아야 merge 될 수 있도록 규칙을 설정하였다. 여기서 문제였다! 특정 브랜치에 merge 될 때 그 특정 브랜치의 패턴을 입력해야 한다. 그래서 처음엔 모든 브랜치에 적..
![[Github Action] Organization 레포지토리 vercel 미리보기 preview 배포](https://img1.daumcdn.net/thumb/R750x0/?scode=mtistory2&fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2FXILOM%2FbtsHkltXvoA%2FLHKlzCGxcUJKoLIQGC62hk%2Fimg.png)
시작하기 앞서...프로젝트를 진행할 때, 작업한 내용을 pull request 에 올리면서 다른 사람의 코드를 보게 되는데이 코드가 제대로 동작하는지 내 눈으로 보고 싶으면 번거롭게 그 브랜치로 이동해서 직접 확인해야 된다. 이러한 과정이 번거롭기 때문에 pull request 를 올렸을 때, 자동으로 vercel 로 미리 보기 preview 를 배포해야 한다. 그러나 Organization 레포지토리가 아닌 경우 vercel 봇을 사용하여 간단하게 미리보기를 배포할 수 있지만Organization 레포지토리는 권한때문에 github action 을 사용해서 구현해야 된다. 깃허브 액션으로 pr 미리 보기 배포1. vercel 토큰 발급vercel 토큰을 발급받는 곳에서 토큰을 발급받는다. 발급 받은 토..
![[GitHub] 깃허브 이슈(issue) & PR(Pull Request) 템플릿 만들기](https://img1.daumcdn.net/thumb/R750x0/?scode=mtistory2&fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2FbgXBZI%2FbtsGsUxoskI%2FBq4XJmb0io7m14c9X8NZd1%2Fimg.jpg)
☘️ 시작하기 앞서 깃허브로 협업을 하기 위해서 이슈와 PR 이 필요하다. ☘️ 이슈 템플릿 만들기 1. 레포지토리의 Settings 창에 들어온다. 이슈를 생성할 레포지토리의 오른쪽에 있는 Settings 를 클릭한다. 2. Features 의 Set up templates 클릭한다. 스크롤을 내려서 Features 의 Issues 에 있는 초록색 Set up templates 버튼을 클릭한다. 3. Custom template 를 선택한다. select 를 클릭하여 Custom template 를 선택한다. 4. Preview and edit 을 클릭하여 템플릿을 수정한다. Preview and edit 을 클릭하고 연필 모양 아이콘을 클릭한다. 5. 원하는 템플릿 내용을 작성한다. 마크다운으로 원하..