슬기로운 코드 리뷰 생활 with GitHub Pull Request

Rachel Kwak (곽소현)

Follow

Published in

직방 기술 블로그

9 min readJan 7, 2022

--

안녕하세요. 직방 IO팀에서 공통 플랫폼 개발/운영 업무를 담당하고 있는 곽소현 입니다.

직방에서는 Git을 통해 형상 관리를 하고, GitHub Pull Request (이하 PR)을 통해 코드 리뷰를 진행하고 있습니다. 각 레포지토리 의 코드오너들은 PR을 확인하여 리뷰를 남기고, 리뷰 후에는 승인하여 master 브랜치에 머지 할 수 있게 됩니다.

저 역시 직방에서 수많은 PR을 리뷰하면서, 어떻게 하면 PR을 효율적으로 확인 할 수 있을지 계속 고민을 하게 되었습니다. 그 과정에서 GitHub Pull Request에는 생각보다 다양한 기능들이 있다는 것을 알게 되었습니다.

그럼, 지금부터 코드 리뷰할 때 유용한 GitHub Pull Request의 기능들을 몇 가지 살펴보도록 하겠습니다.

일단, 크롬 익스텐션 설치부터 합시다!

Better Pull Request for GitHub 익스텐션 설치한 PR 화면

크롬을 사용하는 경우, 크롬 웹스토어에 PR에 관련된 다양한 익스텐션이 존재합니다. 코드 리뷰의 생산성에 매우 큰 차이가 있기 때문에, 일단 하나 골라서 설치를 해봅시다!

특히, PR의 파일들을 Tree View 형식으로 볼 수 있는 크롬 익스텐션을 설치하시는 것을 추천합니다.

수정된 파일이 많은 경우 파일을 트리 구조로 확인하게 되면, 어떤 경로의 파일들이 변경되었는지 좀 더 빠르게 파악이 가능합니다. 또한, 네비게이션 기능을 통해 트리에서 해당 파일로 바로 이동할 수 있습니다.

적절한 Diff View 선택하기 (Unified vs Split)

상황에 따라 Unified View (가로 분할) 와 Split View (세로 분할) 를 적절히 선택하게 되면 코드의 가독성이 크게 향상됩니다.

Unified View가 가독성 좋은 케이스

변수명, 주석, 버전 등 문자 일부가 변경된 경우에는 기존 문자와 현재 문자를 빠르게 비교할 수 있는 Unified View가 더 가독성이 좋습니다.

위와 동일한 PR을 Split View로 봤을 때, 변경된 문자열의 길이가 길어질수록 한눈에 비교가 어렵습니다.

Split View가 가독성 좋은 케이스

로직의 흐름이 변경된 경우나 연속된 라인이 크게 변경된 경우에는, 변경된 로직의 흐름을 한눈에 볼 수 있는 Split View가 더 가독성이 좋습니다.

위와 동일한 PR을 Unified View로 봤을 때, 기존 로직의 흐름과 변경한 로직의 흐름이 한눈에 잘 들어오지 않습니다.

공백 수정사항 제외하고 로직 수정사항만 빠르게 보기

간혹 코드 컨벤션이 맞지 않는 경우에 불필요한 공백을 전부 제거하거나, 혹은 코드 중간에 공백을 추가하게 됩니다. 여기서 “Hide whitespace”를 체크하여 공백 수정사항을 제외하면, 빠르게 로직 수정사항만 확인이 가능합니다.

.md 파일은 Display the rich diff 로 Preview 확인하기

.md 파일을 변경하면, 우측에 “Display the rich diff” 버튼이 나타남

.md 파일과 같이 rich diff 기능이 제공되는 파일의 경우, 해당 기능을 통해 Preview를 볼 수 있습니다.

Preview를 통해 어떤 식으로 코드가 적용되는지 보면 가독성이 높아질 뿐 아니라, 실제 적용되었을 때 의도한 것과 다르게 표시되는 경우도 빠르게 확인이 가능합니다.

연속되는 라인 묶어서 한 번에 리뷰하기

연속되는 라인에 동일한 리뷰를 남기고 싶은 경우나, 해당 라인에 전체적으로 리뷰를 남기고 싶을 때 연속되는 라인을 묶어서 한 번에 리뷰 할 수 있습니다.

이 기능을 사용하면 라인마다 일일이 리뷰를 남기지 않고 한 번에 묶어서 빠르게 리뷰를 남길 수 있기 때문에, 리뷰 시간이 단축될 수 있습니다. 또한 리뷰의 가독성이 높아지기 때문에, 리뷰를 확인하는 사람도 효율적으로 확인이 가능합니다.

suggestion 기능 사용하기

PR의 suggestion 기능을 활용하면, 제안받은 코드의 변경사항을 PR 화면에서 확인 후 바로 커밋까지 할 수 있습니다.

“Commit suggestion” 버튼을 클릭하면 해당 제안 건만 단일 커밋을 하는 것이고, “Add suggestion to batch” 버튼을 클릭하면 제안받은 것을 한꺼번에 커밋할 수 있습니다.

리뷰 완료한 파일은 체크하기

수정된 파일이 많은 경우, 리뷰를 완료한 파일을 체크해 놓으면 리뷰가 필요한 파일을 좀 더 빠르게 파악 할 수 있습니다. 리뷰가 완료된 파일의 “Viewed”를 클릭하게 되면, 해당 파일이 자동으로 숨김 처리 됩니다.

특히, 리뷰해야 하는 파일이 많은 경우에 이 기능을 사용하면 스크롤의 압박에서 조금이나마 도움을 받을 수 있습니다. 또한, 어느 정도까지 리뷰가 진행되었는지 진행률도 확인할 수 있습니다.

여러 개의 리뷰를 한 번에 등록하기

보통은 “Add single comment”를 사용하여 리뷰를 하나씩 등록하는데, 리뷰가 하나 등록될 때마다 코드오너에게 알림이 가게 됩니다. 리뷰가 많은 경우, 자칫 코드오너에게 폭풍 알림을 선사하게 됩니다.

이때, “Start a review” 기능을 사용하게 되면 아래의 화면처럼, Pending 상태의 리뷰 여러 개를 한 번에 등록할 수 있습니다.

마지막에 꼭 Finish your review > Comment 선택 > Submit review 해야 리뷰가 등록된다.

Draft PR 생성하여 초기에 공유하기

개발 초기단계부터 코드 변경사항을 미리 공유하여 초기부터 피드백을 받고싶은 경우가 있습니다. 또한, master 브랜치에 바로 머지 할 목적이 아니라 어떤 코드에 대해 의견을 나누고 싶을 때가 있습니다.

이럴 때는 Draft PR을 생성하여 리뷰를 진행하면 됩니다.

Draft PR로 생성하게 되면 해당 레포지토리의 코드오너에게 리뷰 요청알림이 가지 않고, master 브랜치로 머지할 수도 없습니다.

Draft PR에서 리뷰를 마친 후에 master 브랜치로 머지하고 싶다면, “Ready for review”를 클릭하여 PR로 전환합니다.

혹시 이미 생성한 PR을 Draft PR로 변경하고 싶다면, PR Reviewers 하단의 “Convert to draft”를 클릭하면 됩니다.

마치며

코드 리뷰는 코드를 구현하는 것보다 더 힘들고 어려운 작업이라고 생각합니다. 같은 코드를 리뷰하더라도 어떻게 리뷰를 진행하느냐에 따라 코드 리뷰에 드는 공수의 차이가 크게 나게 됩니다.

GitHub Pull Request에는 이 포스팅에서 미처 설명하지 못한 다양한 기능들이 존재합니다. 또한 이 포스팅에서 제시한 방법들이 전부 정답도 아닙니다. 다만, 코드 리뷰가 여전히 막막하거나 이제 갓 코드 리뷰를 시작하시는 분들께서는 위의 기능들만 잘 사용하셔도 충분히 효율적인 코드 리뷰를 하실 수 있으리라 생각합니다.

여러분의 쾌적하고 슬기로운 코드 리뷰 생활에 조금이나마 도움이 될 수 있기를 바라며, 파워 코드 리뷰어로 한 발 더 다가가 봅시다!