Q. 여러분들은 코드리뷰 어떻게 하시나요?
A.
- 회의실 들어가서 해요 -> you out
1번) git clone받아서 개발툴(IntelliJ/VScode)에서 합니다!
회사에서 사용하는 개발도구인 IntelliJ나 WebStorm, VSCode 등에서 프로젝트를 열어서 특정 버전의 파일 히스토리를 클릭해서
수정/추가/삭제된 부분이 있는지 비교하고, 이 커밋의 수정담당자한테 왜 이렇게 바뀌었는지 설명해달라고 요청하는 방식
(이슈트래킹이 잘 되고 작은 팀 단위로 소통이 잘되면 예상가능한 커밋들은 skip하는경우도 있다)
2번) gitlab이나 github의 commits 클릭하고 날짜 Range를 선택 후(datepicker) 해당 기간(ex:1주일)의 커밋들을 모아서 어느 부분이 삭제됐고, 추가됐는지에 대한 논의를 나눠요
내가 다녔던 회사도 gitlab을 사용해서 web에서 코드리뷰를 진행했었다
왜냐하면 누구는 VScode쓰고, 누구는 IntelliJ쓰고... 그랬기 때문
장단점
두 방식 다 장단점이 있다
1. git clone && IDE open
장점
- 같이 코드를 리뷰하는 사람들한테 화면을 즉각적으로 맞춰줄 수 있음(블랙<->화이트, 폰트 크기 조절)
- 그 지점으로 checkout해서 개발툴 내에서 소스를 깊게 파보거나 컴파일이 깨지지 않는지 볼수있음(물론 기존에 CI 파이프라인이 있거나.. 항상 build를 해야하는 규칙이 있다면 상관이 없을지도)
- 팀원들이 다 같은 개발툴을 사용중이라면 뭔가 편안함
- 옵션이 많다. Text Match / Branch / User / Date
- 멀티프로젝트(다중 github repo)를 사용중이여도 리뷰하기가 편하다 -> paths 옵션만 바꿔주면 됨
단점
- 함께 프로젝트를 진행하는 사람이 코드리뷰어면 상관없는데, 해당 프로젝트를 하지 않고 관리하고 코드리뷰만 하는 임원이라면 로컬PC에 git pull받기가 싫거나 부담스러울 수 있음
2. github나 gitlab에서 보기
장점
- git CLI를 사용하는 것과 거의 비슷하게 나오기때문에, git을 GUI가 아니라 CUI로 이용하는 경우 편안함을 느낄 수 있다
- git pull받지 않고도 브라우저에서 바로 리뷰할 수 있음
단점
- 테마를 바꾸려면 settings 들어가서 바꾸고 다시 페이지 리로딩해야됨. 폰트도 마찬가지
- 옵션이 개발툴을 사용하는 것에 비해 살짝 빈약
- 여러 레포를 사용하는 경우는 탭을 계속 옮겨가면서 리뷰해야함
난 개인적으로 1번을 선호하긴한다. 근데 개인의 선호이지, 그 회사에서 결정권자가 정하는대로 하시길~
하지만 version에 대해서 tracking해가면서 특정 커밋의 변경점/이유에 대해 찾는게 아니라 현재 가장 최신버전의 코드에서 개선점만 알려주고 싶을 때는 어떻게할까?
예를 들어, 현재 내가 멘토링 서비스의 멘토라고 하자. 프로그래머스/인프런/원티드 등등 여러 플랫폼에서 멘토역할을 하고 있는데, 멘티들이 작성한 프로젝트를 보고 개선방안에 대해서 논의하고 알려주는 일을 해야한다고 치자.
모든 멘티들의 프로젝트들을 git pull받아서 한 폴더에 저장하면 다행이지만 실수로 이곳저곳 흩어져서 만들면 나중에 다시 정리하는것도 귀찮고 컴퓨터 용량도 차지할 것이다.. 이런경우는 2번을 사용해 웹에서 볼 수 있는데, 어떻게 어떻게 바꾸세요~ 하는거를 말로밖에 설명할 수 가 없다 => 집중력 저하
이런 경우 다른 방법이 없을까?
있다 ⭐️
https://docs.github.com/ko/codespaces/the-githubdev-web-based-editor
github.dev 웹 기반 편집기 - GitHub Docs
github.dev 웹 기반 편집기를 사용하여 파일을 편집하고 변경 내용을 커밋할 수 있습니다.
docs.github.com
바로 정답만 말하면 .dev를 이용하는 방법이다
에? 그게 먼데요 장난합니까?
아 ㅇㅋㅇㅋ... 일단 깃허브 레포지토리로 들어간다
내가 아닌 다른 사람의 레포도 상관없다
난 java 챔피언인 josh long님의 spring-ai 프로젝트를 들어갔다
https://github.com/joshlong/spring-ai
위의 url 경로에서 .com을 .dev로 바꿔보자
vscode 기반의 web editor가 오픈된다
이제 아무 패키지로 들어가서 코드를 추가해보자
나는 spring-ai-core의 src/main/.../EvaluationRequest.java 파일을 열었다
System.out.println("Josh Long님 code-boki/dev lighthouse 다녀갑니다^^");코드를 추가해봤다
물론 내가 이 repo의 owner또는 collaborator가 아니기때문에 push해봣자 PR로 떨어진다
어쨌든 여기서 중요한 포인트는 web browser에서 프로젝트를 다운로드 받지 않고 열어서 코드를 수정할 수 있다는 점이다
그리고 필요하다면 폰트 크기/테마도 바꿀 수 있다
이 방법을 통해 멘티들의 as-is코드를 to-be코드 예시로 보여줄 수 있을 것이다
다만 단점이 있다. 자동완성을 완벽하게 지원하지는 않는 것 같다
기대한바는 sout -> System.out.println()이었다
System 이후 .을 입력했는데도 안내를 받을 수 없는 모습
그럼 Java관련 Extension을 설치해서 도움을 받아볼까..?
웹용 Visual Studio Code에서 'Java' 확장을 사용할 수 없습니다. <
웹용으로 띄운거에서는 자바는 ide의 완성 도움을 받을 수 없나보다..
이와 마찬가지로 git graph 또한 마찬가지이다
왼쪽과 마찬가지로 노란색 경고 warning 아이콘이 뜬 경우는 web vscode editor에서 설치할 수 없나보다
Q. 그럼 이 git graph를 설치못한다면 git관련된 작업도 할 수 없다는것일까?
A. 그렇지 않다
변경 내용에 들어가있는 모습. 다만 CLI를 사용하려고 터미널을 클릭했더니 아래와 같이 나온다
나도 정확히는 모르지만... Github CodeSpaces는 Github에서 제공하는 가상환경인것 같다
여기서는 git graph를 설치하고 사용할 수 있는 모습..
근데 이거에 대해 잘 모르고 내가 얘기하고 싶은건 이게 아니기때문에 다시 롤백!
참고로 코틀린 코드도 볼 수 있는데, extension을 설치하면 색상이 나온다(색상이 별거아닌거같아 보이지만, 하얀색 텍스트보다 보기 좋다)
이정도면 대충 특징들을 보여준 것 같다
사실 url을 github.com에서 .dev로 바꾸라고 했지만.. 바로 들어가는 방법이 있다
repository까지 들어간 다음에 .(dot)을 누르면(키보드) 바로 .dev로 이동해서 vscode web editor가 열리는 모습을 볼 수 있다!
부록으로 .dev말고 github1s.com처럼 github뒤에 1s라고 url을 입력하면 위에서 소개한 것과 비슷한 web editor가 열린다
왼쪽 github 아이콘 모양이 .dev / 우측의 고양이 모양이 github1s.com
차이점은 위 그림에서도 알 수 있다시피 1s는 [Preview]이다
또한 이 페이지는 깃허브에서 공식적으로 제공하는게 아니라고 주의표시가 떠있다
이상한 사이트는 아니고 오픈소스 프로젝트라 그런갑다
github1s는 코드 수정이 불가능하다
또한 github1s는 무한정 레포를 여는게 불가능해보인다
뭔가 github내의 api를 사용해서 웹 에디터를 오픈하는것 같은데, 깃허브 공식홈페이지에서 api limit을 걸어둔 모양새다
그러니 코드를 보고 수정하는 목적을 가지고 있다면 깃허브 레포지토리에서 .을 클릭하거나 .dev로 url을 바꿔서 vscode web editor를 열자
개인적으로 쌈@뽕@하게 하고싶으면 유료IDE인 Jetbrains사의 IntelliJ를 사용해서 코드리뷰를 해보는 것을 추천한다
'DailyLife > Tech Tips' 카테고리의 다른 글
| Chat GPT 좀 더 잘 사용하기 (2) | 2024.08.23 |
|---|---|
| 크롬 검색창에서 다른 사이트 검색하기!! (0) | 2024.06.22 |
| 크롬 유용한 단축키(Windows / MacOS) (0) | 2022.05.05 |
댓글