[ Git & Github으로 협업하는 법 ]

💻 브랜치 활용하기

브랜치는 복사본 같은 것!

1. 명령어

  • git branch 브랜치명 -> enter : 브랜치(복사본) 생성 명령어(enter 쳐도 아무 변화가 없음)

  • git branch : 브랜치 확인 명령어(나올 땐 키보드 q)
    브랜치 생성 후 git branch 해보면 아래와 같이 표시된다.
    login : 새로 생성은 됐는데 현재 위치해 있진 않음(파일을 만들었다고 해서 그 파일에 들어가 있는 건 아님)
    * main(초록색으로 표시) : 내가 현재 위치해 있는 브랜치

  • git switch 브랜치명(또는 git checkout 브랜치명) : 브랜치 이동 명령어(브랜치를 만든다고 해서 그 폴더로 들어가 있는 것이 아니기 때문에, 브랜치로 들어가는 작업이 필요)

  • git switch -c 브랜치명(또는 git checkout -b 브랜치명) : 브랜치 한번에 생성 & 이동(만들어 지면서 동시에 이동)

  • git branch -D 브랜치명 : 브랜치 삭제

2. 새로운 브랜치에서 코드 수정

ex) (현재 login 브랜치에 있는 상태) 코드 수정 -> 새로운 브랜치에서 수정된 코드 저장(add & commit)

⭐️ 독립적으로 저장 됨!! 위의 예에서 login 브랜치에서 코드 수정 한 것이니 main은 수정이 안 된 상태! (복사본 만들어서 복사본 수정한 것) git switch main해서 main으로 이동하면 수정된 코드가 반영 안 돼 있음.

3. 코드 수정한 브런치를 main에 합치기

⭐️ main 브랜치가 최종 브랜치이니 꼭 main에 합쳐줘야 함!

  • git switch 최종 브랜치명 -> git merge 합칠 브랜치명(최종 브랜치로 이동 먼저하고, 합쳐야 함)

💻 Pull Request 활용하기

  • Pull request하는 목적 : 코드 리뷰
  • 사실 git merge 명령어 잘 안 쓴다.(github에 올려야 다른 사람들이 다 볼 수 있고, 코드 리뷰도 할 수 있기 때문에 터미널에서 merge 잘 안 하고, 보통 github에서 합침)

1. Pull Request(PR)란?

Pull : 당겨서 합치는 것(merge) + Request : 요청하다

  • 지금 main에 login을 합친 상태인데, git mergy login 하기 전으로 돌아갔다고 치고 github에 업로드 해보자.
    git push origin 브랜치명(지금은 login) 하고 github에 들어가면 업로드 돼 있음 -> Compare & pull request 클릭(base: main이 최종 브랜치, compare: login이 기능 브랜치) -> 맨 위에 메세지 쓰고 Create pull request 클릭 -> Pull Request 생성

  • Pull Request 생성된 페이지에서 Files changed 누르면 코드 변경점을 확인하고, 코드리뷰를 할 수 있다.
    Merge하기 : Merge pull request -> Confirm merge

  • github에서 merge해도 VSC에는 반영되지 않아서 반영해 줘야 한다.
    git switch 브랜치명(여기선 main) : 로컬 main 브랜치로 이동 -> git pull origin 브랜치명(여기선 main) : github 코드 반영

2. 문제점

회사에서 main 브랜치가 배포용으로 많이 쓰이는데, 여기에 사람들이 github으로 막 merge 하면 아래와 같은 문제가 생길 수 있다.

  • 완벽하게 기능 개발해야 merge 가능해서 다 만드는데 오래 걸리고, 버그 수정도 오래 걸린다.
    ex) 회원가입, 로그인, 로그아웃 3개 합쳤을 때 잘 작동하는지 확인하고 main에 올려야 할 것인데 main에 하나씩 따로 올리면 어디서 버그났는지도 모르고 오래 걸린다.
    <해결책> 중간에 개발용 브랜치를 만든다.
    - main 브랜치 : 배포용 브랜치
    - develop 브랜치 : 배포 전 합치기용 브랜치(테스트용)
    - 기능 브랜치 : 기능 개발용 브랜치
  • 그냥 무작정 합치면 위험하다. (사실 회사에서는 자동화되어 있을 것)
    ex) 다른 사람이 같은 파일에 같은 변수를 사용해서 merge하면 에러 남
    <해결책> 로컬에서 먼저 테스트한다.
    github(원격) dev 브랜치(다른 사람들이 여러개 합쳐 놓음)에서 git pill origin dev를 해서 내 컴퓨터(로컬)에서 내코드와 합쳐서 테스트해 본다. 다 됐으면 기능 브랜치에 push하고 dev로 merge한다.

💻 협업 실전 가이드

1. 초기 세팅

  • 팀장 : 초기 코드 작성 및 Github 업로드
    a. 폴더 생성
    b. 초기 코드 작성
    c. git init, add, commit
    d. Github 레포지토리 생성
    e. Github 업로드(git push)

  • 팀장 : dev(혹은 develop) 브랜치 생성
    a. git switch -c dev(로컬에서 dev 브랜치 생성) - github에서 바로 만들어도 됨
    b. git push origin dev(github에도 반영)

  • Github에서 dev 브랜치를 default로 설정(main으로 바로 합치는 실수를 방지하기 위해)
    a. 레포지토리 Settings
    b. default branch에서 화살표 클릭 -> dev 클릭 -> update

  • 팀원틀을 collaborator로 등록
    a. 레포지토리 Settings
    b. collaborators 클릭 -> add people

  • 팀원 : git clone하기
    a. 레포지토리에서 <>Code 클릭 -> 레포지토리 주소 복사
    b. 폴더 생성 -> VSC로 폴더 열기 -> git clone 주소 .
    c. default 브랜치가 dev로 되어있는 것 확인

2. 기능 개발 시작

a. git switch -c 기능브랜치명(안전하게 복사본 만들기) - 브랜치 이름 짓는 법 구글링 해보기 ex) feature/singup

b. 코드 작성 -> 코드 저장 및 내 브랜치로 업로드(add, commit, git push origin feaure/singup)

c. Pull request 생성 -> Compare & pull request 클릭 -> base 브랜치(dev)와 기능 브랜치 확인 -> Create pull request 클릭
⭐️ 만약 충돌이 나서 합치기가 안 되면 git pull origin dev해서 충돌 해결하고 다시 합치기

3. 코드 작성자 : 리뷰 요청하기

레포지토리 Pull requests -> Reviewers 클릭 -> collaborators에게 리뷰 요청

4. 코드 리뷰어 : 리뷰 하기

레포지토리 Pull requests -> File changed 클릭 -> 리뷰 요청한 사람이 뭘 수정했는지 표시됨 -> + 버튼 눌러서 리뷰 쓰기 -> Start review 클릭 -> Finish your review 클릭 -> 합쳐도 될 코드라면 Approve 클릭, 못 합칠 코드라면 Request changes 클릭, 애매해서 댓글만 남기고 싶으면 Comment 클릭 -> Submit review 클릭

5. 합치기 전 내 로컬에서 충돌 해결 및 테스트

기능 브랜치에서 git pull origin dev -> 충돌 나면 해결 -> 테스트도 해보기

6. merge

수정 했다면 저장(git add . , git commit -m "메세지") -> git push origin 기능브랜치명 -> (github에서 자동으로 체크) -> Merge pull Request 클릭 -> Confirm merge 클릭

7. 추가 기능 개발

a. 내 로컬의 dev에도 변경 사항 반영(git switch dev -> git pull origin dev)

b. 다음 기능 개발 : 기능 브랜치 생성 및 코드 작성 -> git add, commit, push -> Pull request 작성 및 코드 리뷰 -> 내 로컬에서 충돌 해결 및 테스트 -> 코드 업로드 및 merge

profile
코린이 강아지 집사🐶

0개의 댓글

Powered by GraphCDN, the GraphQL CDN