깃허브 이슈를 통해 협업해보자

이번에 TIFY 프로젝트를 진행하면서 깃허브 이슈 기능을 알게 되었다.

 

깃허브 이슈..?

깃허브 이슈는 프로젝트 진행 시 진행 상황을 한눈에 파악할 수 있게 해 준다.

이슈라고 하면 뭔가 문제가 생겼을 때만 사용할 것 같은 네이밍이지만, 기능 구현, 리팩터링, 개선 사항, 버그 등 작업 상 웬만한 것들을 다 포함한다.

 

먼저 TIFY에서 진행한 깃허브 이슈 사용법은 다음과 같다.

업무 배정을 받으면 깃허브 이슈를 먼저 생성한다.

이렇게 프론트 리드님이 만들어주신 이슈 템플릿을 이용해서 이슈를 생성할 수 있다.

 

UI 이슈를 예로 들어서 설명해 보자면, 프론트의 경우, 페이지부터 작업을 하는 것이 아니라, 컴포넌트부터 생성한다.

버튼, 바텀 시트 등 재사용할 수 있게 컴포넌트를 먼저 생성하고 페이지 작업을 하게 된다.

이때 사용하는 이슈가 바로 UI 이슈이다.

 

Bug 이슈는 개발 중 발생한 버그 해결을 위한 이슈이고, Feature 이슈는 기능 구현, Performance 이슈는 성능에 관련된 작업을 위한 이슈, Refactor 이슈는 이름 그대로 리팩터링이 필요한 부분을 위한 이슈라고 생각하면 된다.

 

이슈 제목, 이슈 내용에 대해서 작성을 한 후, 오른쪽에 assignees를 지정할 수 있다.

이는 해당 작업을 수행할 사람을 지정하는 것으로 생각하면 된다.

 

아래 사진은 실제로 TIFY 프로젝트에서 내가 생성한 이슈이다.

 

이제 이슈를 생성했으니 작업에 들어가게 된다.

TIFY 프로젝트의 경우, 브랜치명에 대한 규칙도 있는데, 작업 카테고리/작업 명을 브랜치 이름으로 설정해서 작업한다.

위 CubeButton 제작의 경우, ui/cubeButton으로 작업을 한다고 보면 된다.

브랜치 생성 후, 해당 브랜치에서 CubeButton 작업을 완료한 후, 깃허브 상에 푸시한다.

이후, Pull Request를 생성해서 다른 개발자분들이 작업 상황 및 코드를 보고 리뷰를 진행하게 된다.

 

TIFY 프로젝트에서는 리드님이 PR 템플릿까지 생성해 주셔서 편하게 사용하고 있다.

이런 식으로, 해당 PR과 관련된 이슈를 PR 상에 연결해 주고, 작업에 대한 설명, 리뷰어들에게 남길 멘트를 적고 팀원들에게 리뷰를 요청하면 된다.

TIFY에서는 한 명이라도 리뷰를 남기고, approve를 해야 dev 브랜치에 머지할 수 있도록 설정을 해놨다.

 

아래와 같이 리뷰를 통해 수정이 필요한 부분 요청을 하고, 그 부분이 완료되었을 때 approve를 하면 되는 과정이다.

이제 PR까지 다 생성했으면 이슈를 close해주면 된다.

이슈를 close해주고 PR을 머지할 수 있도록 팀원이 approve해주면 그때 dev 브랜치에 스쿼시 머지를 하는 방식으로 진행하면 된다.

스쿼시 머지로 하는 이유는 하나의 작업 단위를 기준으로 커밋 기록으로 남기기 위해서이다.

 

예를 들어서, CubeButton 컴포넌트 생성 작업을 할 때 커밋 기록으로 다음과 같이 두 개를 남겼다고 해보자. 

- feat(ui): CubeButton 컴포넌트 생성

- chore(ui): CubeButton 컴포넌트 수정

 

이렇게 작업하고 머지할 때 선택지는 두 가지이다.

- rebase and merge

- squash and merge

리베이스 앤 머지를 사용하면 이 두 커밋이 데브 브랜치에 따로 들어가고, 스쿼시 앤 머지를 사용하면 하나의 커밋으로 들어가게 된다.

 

아래 사진을 보면, 작업을 위한 커밋 자체는 네 개를 했는데 dev 브랜치 상 커밋 기록을 확인하면 하나로 뜬다.

이렇게 하나의 작업 당 하나의 커밋으로 남게 하기 위해서 스쿼시 앤 머지를 사용하는 것이다.

 

이렇게 진행하면, 한 작업에 대해서 이슈 생성, 작업, 머지까지 완료하게 되는 것이다.

 

깃허브 이슈를 생성해서 작업하게 되면 다른 팀원에게 굳이 물어보지 않아도 어떤 작업을 했는지 명확하게 파악할 수 있다.

그래서 처음에 깃허브 이슈를 써봤을 때 진짜 신기했다.

이렇게 편리한 기능이 있는 줄 알았으면 진작에 썼을 거다.

 

TIFY 프로젝트에서는 리드님이 생성해 주신 이슈 템플릿과 PR 템플릿을 사용하기만 해 봤지만, 이제 내가 직접 템플릿을 만들어보려고 한다.

다음 글로는 이슈 템플릿과 PR 템플릿 생성이 될 거 같다.