Git rebase and resolve conflicts through the GitHub Desktop

Hi in this post I’m going to show you how to do a rebase and use the GitHub Desktop to solve code conflicts.

Let’s suppose that 2 developers (Cristina y Carlos) are in the same project and then both already created their PR’S:

Cristina was working on App.js and index.css and also Carlos was working on App.js and index.css (same files, same lines), so here the PR’S:

Nice, then Cristina PR got approved:

And now she merge her PR to main branch, without issues! 🙂

Then Carlos is reviewing his PR and say: Oh my PR have conflicts! 🙁

Note: this happen because Cristina and Carlos were woking on the same file and line of code.

So, Carlos need to do the following:

1.- Update his branch (feature/carlos-branch) with the changes that main branch have, this can be possible using git rebase.

2.-He need to resolve the conflicts that his branch have (feature/carlos-branch), this can be solved using a tool called GitHub desktop.

Making a git rebase through GitHub Desktop:

1.- Go to main branch and pull the changes, type:

git pull

2.- Open your GitHub Desktop (add your repository) and click on next steps:

Then click on Start rebase:

After you click the button, you will see the next modal:

The modal show us that we have conflicts in 3 different files, so we can start fixing those issues clicking the next button:

Note: you can configure your default editor code

Solving the conflicts

After click the “Open in Visual Studio Code” button you will see how the Visual studio code will be opened automatically and will show you the file that have a conflict:

 Note 1: “<<<<<<< HEAD” to line 16 “=======” means that this code is on main branch, and the line 16 through line 22 are the changes that we did.

Note 2: Don’t worry If you see in your terminal a commit number instead of the name of your actual branch, this is because the “rebase go through every commit that is in our base branch trying to merge each commit to our actual branch

So, for this example Im going to keep both changes, but in a real project you need to be very careful of what lines of code you are moving to not damage the code of another coworker.

Then after we fixed conflicts and save, go to the GitHub Desktop tool and now see how the modal is showing green color on that file, this means that we solved the issue conflict on that file:

Nice, continue fixing the files and at the end you will see the modal with all green icon and click on Continue Rebase button:

Finally click on “Force push origin” button:

And go to the PR, then you will see that the conflicts are solved 🙂 and Carlos can merge his PR!

By Cristina Rojas.