SourceTree에서 Branch 생성과 병합(Merge) 그리고 충돌(Conflict) 해결 정리

오늘은 SourceTree를 이용해서 Branch를 만들어보는 방법에 대해서 정리해 보도록 하겠습니다.

Branch가 무엇인지 간단히 알아보고,

SourceTree를 이용해 Branch를 생성하고 Merge하는 과정까지 정리해 보도록 할께요.

 

1. Branch

브랜치에 대해서 이해를 해보려고 하는데요.

먼저 실제 예를 들어보면서 이해해 보도록 하겠습니다.

 

1-1. Branch

Branch는 우리말로 가지인데요.

기존 프로젝트에 가지를 만들어서 추가기능을 그 곳에서 구현을 하고,

작업이 다되면 merge(병합)를 통해서 기존 코드에 추가기능을 더해주는 방식을 취하게 됩니다.

여기서 merge란, 기존 소스가 아닌 다른 곳에 기존소스를 복사해와서, 그곳에 추가기능을 넣어서 합치는 것을 말 합니다.

 

이러한 과정속에서 기존 코드와 충돌이 나는 곳도 있겠지만,

무작정 수정하다가 어쩔수 없이 롤백을 하는 것보다는 훨씬 저렴한 비용이겠지요

 

1-2. 사례 이해

한번 실제 예를 들어 이해해 보겠습니다.

시중에 이미 안드로이드 앱을 만들어서 배포하고 있다고 가정하겠습니다.

다음 버전 사용자들에게 알람을 주는 기능을 추가하는 코딩을 하고 있었고,

이것이 구현되는데는 시간도 많이 걸리고 QA도 많이 해야합니다.

 

그런데 갑자기 사용자들이 설정페이지에서, 앱이 크래쉬가 나온다며 빨리 고쳐달라는 글이 리뷰에 많이 달립니다.

이 부분의 코드를 보니 쉽게 고칠수 있는 것이었습니다.

그런데, 기존에 알람기능을 추가하고 있던 코드는 어떻게 해야하나요?

눈물을 머금고 롤백을 해야 할까요?

정말 난감합니다. 앱이 크래쉬가 나오면 유저들이 떠날테니 빨리 고쳐주어야하는데 말이지요.

 

이럴때 Branch를 만들어서 알람기능을 구현하고 있었다면 전혀 문제가 되지 않았을 겁니다.

 

그럼 실제로 Branch를 생성해서 다른곳에서 코딩작업을 하고, 다시 원래코드가 있는 master로 들어갔다가 Branch로 다시 들어가서,

작업했던 코드를 Merge 해 보도록 하겠습니다.

먼저 Branch를 생성해보도록 하지요.

 

2. Branch 생성

먼저 SourceTree를 보도록 하죠.

좌측 네비게이션을 보면 Branches가 있구요.

Branches위에 마우스를 올려보면 나오는 show텍스트를 클릭해보면,

아래와 같이 master가 나오는 것을 볼 수 있습니다.

 

현재 Branch는 master밖에 없다는 것을 알 수 있습니다.

master는 바로 현재 저희가 코딩을 하고 있는 곳입니다.

 

여기서 Branch를 추가로 만들면 코드가 복사되서 새로운 가지가 생겨나는 것이지요.

 

 

그럼 실제로 Branch를 만들어 보겠습니다.

자주쓰는 기능이므로 아래 이미지의 화살표가 가르키는 것과 같이 상단에 Branch아이콘과 텍스트가 있구요.

(OS나 버전에 따라 모양이나 위치는 조금다를수 있지만, 자주쓰는 기능이니 눈에 뛰는 곳에 있어 쉽게 찾을 수 있을것입니다)

클릭하면 아래와 같이 New Branch에 이름을 적어주면 됩니다.

알람기능구현 이라고 하겠습니다.

이제 Create Branch버튼을 눌러주면 브랜치가 생성됩니다.

 

 

 

생성하면 아래와 같이 Branches에 알람기능구현 Branch가 추가된 것을 볼 수 있습니다.

그리고 주의해야 할 것은 별것 아닌 것 같지만,

화살표가 가르키고 있는, 동그란 아이콘입니다. 

os나 버전별로 모양은 조금 다를 수 있지만, 현재 어느 Branch에서 작업하고 있는지를 나타내 줍니다.

master가 기존에 코드를 작업했던 곳이고, 알람기능의 구현은 알람기능 Branch에서만 해야 겠지요.

 

현재는 아래에서와 같이 알람기능구현 Branch에 들어가 있습니다.

 

 

 

이번에는 master브랜치로 이동해 보겠습니다.

방법은 간단한데요. 이동하고자 하는 branch를 더블클릭해주면 됩니다.

네, 이렇게 더블클릭만으로 쉽게 이동할 수 있습니다.

 

 

그럼 이제 알림기능구현 branch에서 간단히 작업해보고 커밋해보도록 하겠습니다.

 

3. 생성한 Branch에서 작업하기

먼저 알람기능구현 branch로 이동하기 위해 해당 브랜치명을 더블클릭해줍니다.

(위에서 해봤으니 이미지는 생략합니다)

 

이제 알람기능구현 branch로 이동 되었구요.

여기서 간단히 아래와 같이 텍스트를 추가해주고 커밋합니다.

 

 

이제 master 브랜치를 더블클릭해서 몇몇 파일을 추가하고 커밋해 보겠습니다.

아무래도 master브랜치에서 이미 작업들을 진행해 나가고 있다고 가정해야,

실제 사용에 좀더 가까울테니까요.

 

커밋을 하고 Graph쪽을 보면 아래와 같이 알람기능구현Branch와 master Branch의 구분이 명확해집니다.

 

 

 

4. 생성한 Branch를 Master Branch에 Merge하기

Branch에서 목표한 작업을 다하게되면 master Branch에 병합을 시켜야 하는데요.

 

이 때 중요한 것은 master에 병합하고자 하면 master Branch에서 해야한다는 것입니다.

master에 병합하니까 알람기능구현 branch에서 merge(병합)한다고 생각할수도 있지만,

병합을 받는 master Branch에서 작업해야 하는 것을 잊으면 않됩니다.

 

좌측상단 네비게이션 메뉴에서

merge(병합)하고자 하는 알람기능추가 Branch를 우측마우스 버튼으로 클릭해주고,

나오는 merge 알람기능구현 into master를 선택해 줍니다.

 

 

 

확인 팝업이 뜨고, OK를 클릭해주면 아래와 같이 merger가 된 것을 알 수 있습니다.

 

 

마지막으로 이렇게 병합이 되었다면, push해주어서 동기화 되도록 해주는 것도 잊지 말아야 겠지요.

 

4. Conflict(충돌) 이 나온 경우 

sourceTree는 보통의 경우 Conflict가 발생하지 않도록 잘 merge를 해주지만,
소스의 같은 부분에 대해 서로 다른 branch에서 작업하다보면 Conflict가 발생하는 경우도 있습니다.

아래와 같이 충돌시킬 브랜치에서 작업한 내용을 merge해보니 아래와 같이
merge Conflicts팝업이 나왔습니다.

 

 

이제 해결해보도록 하겠습니다.
일단 OK를 클릭해서 화면을 닫아줍니다.
먼저 충돌이 발생한 코드를 보도록 하겠습니다.

이미지와 같이 <<<<<< HEAD 그리고 =======
마지막으로 >>>>>가 생겼습니다.

 

 

 

이 기호들의 의미를 보면 다음과 같은데요.

 

구분	내용
<<<<<에서 =====까지	현재 브랜치에서의 코드내용.
======에서 >>>>>>까지	병합할 브랜치에서 충돌되는 내용

 

이를 해결하는 방법은 간단합니다.
<<<< ==== >>>> 안의 코드들을 수정하고자 하는 데로 수정해주기만 하면 됩니다.
저는 간단하게 아래와 같이 수정해 주었습니다. 

 

 

이걸로 끝이 아니구요. 당연히 SourceTree에 Conflict가 해결되었다고 알려주어야 겠지요.

SourceTree에 Uncommited changes를 보면 아래와 같이 

unstaged files에 충돌된 파일이 나오구요.

우측마우스 버튼을 클릭해서, Resolve Conflicts> Mark Resolved를 선택해주시면 됩니다.

 

 

 

선택해주면, 확인 팝업창이 뜨구요.

OK를 클릭해주면 아래와 같이 변합니다.

 

 

커밋을 해 줌으로써 아래와 같이 병합이 최종적으로 마무리 되게 됩니다.

 

 

이렇게 Branch를 생성하고 병합후에 생기는 충돌 해결까지 정리해 보았습니다.