diff --git a/README.md b/README.md new file mode 100644 index 0000000..fe1578e --- /dev/null +++ b/README.md @@ -0,0 +1,160 @@ +# Git Conflicts Template + +This template has a few conflicts to help you practice resolving them. + +> ❗️ **Important:** Follow these instructions carefully step by step. + +## Getting Ready + +1. [Command Click here to create a new repository on GitHub.com using the import repository feature](https://github.com/new/import). +2. Use this URL to import the template: + +``` +https://github.com/neuefische/web-git-conflicts-template +``` + +3. Create it as `git-conflics` in your own account. Click on "Begin import" and wait for the import to finish. +4. In your new Repository open pull requests for the `pirate`, `full-date` and `styling` branches. + _It's easiest to do this by command-clicking on the "Compare & pull request" buttons that appear after you have created the repository on GitHub._ +5. Clone your repository to your computer. + +All three branches should now show conflicts in the Pull Request interface. + +## Resolving Conflicts + +### `pirate` Branch (using `merge` on the command line) + +Switch to the `pirate` branch locally and merge `main` into it. + +#### Resolve the Conflict + +Git now shows: + +``` +Auto-merging index.html +CONFLICT (content): Merge conflict in index.html +Automatic merge failed; fix conflicts and then commit the result. +``` + +Resolve the conflict by logically combining the changes from both branches: + +- `pirate` translated the introduction to pirate speak +- `main` removed a redundant half sentence "and how to build a shelter" + +Keep the translation from `pirate` and remove the redundant half sentence: "and how 't build a shelter". + +#### Push the Changes + +Push your new changes to the `pirate` branch and look at the Pull Request. + +#### Merge using the Pull Request + +Merge the `pirate` branch into `main` using the Pull Request interface and delete the `pirate` branch. + +### `full-date` Branch (using Resolve Conflicts on GitHub) + +Go to the Pull Request for the `full-date` branch and click on the "Resolve conflicts" button above the disabled "Merge pull request" button. + +#### Resolve the Conflict + +Resolve the conflict by logically combining the changes from both branches: + +- `full-date` changed the code to show the full date +- `main` refactored the code to only on line + +Keep the changes from `full-date` as-is since the refactor to one line (on the `main` branch) was not necessary. (Accept the current change.) + +Mark the conflict as resolved by clicking "Mark as resolved" and then commit it with the "Commit merge" button. + +#### Merge using the Pull Request + +Merge the `full-date` branch into `main` using the Pull Request interface and delete the `full-date` branch. + +### `styling` Branch (using `rebase` on the command line) + +❗️ Go to the `main` branch locally and pull any changes from the remote. + +Switch to the `styling` branch locally and rebase it to `main`. + +Git now shows: + +``` +Auto-merging styles.css +CONFLICT (content): Merge conflict in styles.css +error: could not apply 25cca8a... move max-width to custom property +hint: Resolve all conflicts manually, mark them as resolved with +hint: "git add/rm ", then run "git rebase --continue". +hint: You can instead skip this commit: run "git rebase --skip". +hint: To abort and get back to the state before "git rebase", run "git rebase --abort". +Could not apply 25cca8a... move max-width to custom property +``` + +#### Resolve the Conflict + +Resolve the conflict in `style.css` by logically combining the changes: + +- Incoming change `25cca8a` (`styling`) refactored the css file to use a custom property for `--max-width` +- Current change `HEAD` (`main`) set the max width in the `min()` function to `68ch` instead of `60ch` + +Accept the incoming change from `styling` but keep the `68ch` value for `--max-width` from `main`. + +> 💡 Notice that when rebasing the logic of incoming and current change is reversed. + +Use `git add .` to add your changes and run `git rebase --continue` to continue the rebase. + +Git opens an editor with the commit message for the rebased commit. Keep the message as-is, save and close the editor. + +> 💡 Most likely you're in vim. To save and close the editor type `:wq` and press `Enter`. + +#### Resolve the second conflict + +Git now shows: + +``` +[detached HEAD 473a5e2] move max-width to custom property + 1 file changed, 13 insertions(+), 1 deletion(-) +Auto-merging styles.css +CONFLICT (content): Merge conflict in styles.css +error: could not apply dd7e7df... create more custom properties +hint: Resolve all conflicts manually, mark them as resolved with +hint: "git add/rm ", then run "git rebase --continue". +hint: You can instead skip this commit: run "git rebase --skip". +hint: To abort and get back to the state before "git rebase", run "git rebase --abort". +Could not apply dd7e7df... create more custom properties +``` + +Resolve the conflict in `style.css` by logically combining the changes: + +- Incoming change `dd7e7df` (`styling`) added more custom properties +- Current change `HEAD` (`main`) has the changes from the previously resolved conflict + +Accept the incoming change from `styling` but keep the `68ch` value for `--max-width` from `main` again. + +Run `git add .` and `git rebase --continue` and keep the commit message. + +#### Pushing the Changes + +The rebase is now finished. + +If you run `git status` you should see: + +``` +On branch styling +Your branch and 'origin/styling' have diverged, +and have 11 and 3 different commits each, respectively. + (use "git pull" to merge the remote branch into yours) + +nothing to commit, working tree clean +``` + +You cannot push the `styling` branch to the remote because it has diverged from the remote. You need to force push it. Run `git push --force-with-lease` to do so. + +#### Merge using the Pull Request + +Merge the `styling` branch into `main` using the Pull Request interface and delete the `styling` branch. + +
+ +--- + +> 👏 **Congratulations! You have successfully resolved all conflicts and all changes are in `main`.**