Home Development Tools git Dozens of animated pictures tell you how Git works

Dozens of animated pictures tell you how Git works

Jul 26, 2023 pm 04:56 PM
git

git merge, git rebase, git reset, git revert, git fetch, git pull, git reflog... Do you know what tasks these git commands perform? If you are still confused, don’t miss this article. In this article, Lydia Hallie, a 21-year-old software consultant who is familiar with JavaScript, TypeScript, GraphQL, Serverless, AWS, Docker and Golang, intuitively introduces the working process of these commonly used git commands in the form of animations, ensuring that you will never forget them.

Although Git is a very powerful tool, if I say that Git is a nightmare to use, most people will also Agree with my statement. I find it very helpful when working with Git to visualize it in my head: when I execute a specific command, how will these branches interact and how will it affect the history? Why do my coworkers cry when I perform a hard reboot on master, force push to the original branch, and rimraf our .git folder?

I thought creating visual examples of some of the most commonly used and useful Git commands would be a perfect use case! Many of the commands I'll describe below have optional parameters - you can use these parameters to change the behavior of the corresponding command. And my example will only cover the default behavior of the command and won't add (or add too much) optional configuration!

Merge

##It is very convenient to have multiple branches This will isolate different new changes from each other and ensure that you don't accidentally push unsanctioned or broken code changes to production code. But once these changes are approved, we need to deploy them to our production branch!

One way to incorporate changes from one branch into another is to perform a git merge. Git can perform two types of merges: fast-forward and no-fast-forward. You may not be able to tell the difference now, but let’s take a look at the differences in a moment.
Fast-forward (—ff)

at Fast-forward merge can be performed when the current branch has no additional commits compared to the branch we want to merge. Git is lazy and will try the simplest option first: fast-forward! This type of merge does not create new commits, but instead merges the commits on the branch we are merging directly into the current branch.

Dozens of animated pictures tell you how Git works

Perfect! Now, all the changes we made on the dev branch are merged into the master branch. So what does no-fast-forward mean?

No-fast-foward (—no-ff)

##It would be nice if your current branch didn't have any commits compared to the branch you want to merge into, but unfortunately that's rarely the case! If we commit changes on the current branch that are not in the branch we want to merge, then git will perform a no-fast-forward merge.

When merging using no-fast-forward, Git will create a new merging commit on the currently active branch. The parent commit of this commit points to this active branch and also points to the branch we want to merge!

Dozens of animated pictures tell you how Git works
No big deal, perfect merge! Now, all the changes we made on the dev branch are merged into the master branch.

##Merge conflict

Although Git is pretty good at deciding how to merge branches and add changes to files, it doesn't always make decisions entirely on its own. When the two branches we want to merge have different modifications on the same line of code in the same file, or one branch deletes a file and the other branch modifies the file, Git doesn't know what to choose.

In this case, Git will ask you which option you want to keep? Assume that in both branches, we edit the first line of README.md.
Dozens of animated pictures tell you how Git works

If we want to merge dev into master, a merge conflict will occur: You want the title Is it Hello! or Hey!?

When trying to merge these branches, Git will show you where the conflicts occur. We can manually remove the changes we don't want to keep, save the changes, add the modified file again, and commit the changes.

Dozens of animated pictures tell you how Git works
Finish! Although merge conflicts are often annoying, they make sense: Git shouldn't have to guess at which changes we want to keep.

Rebasing

We just watched You can apply changes from one branch to another branch by executing git merge. Another way to incorporate changes from one branch into another is to perform a git rebase.

git rebase will copy the commits of the current branch to the specified branch.

Dozens of animated pictures tell you how Git works

Perfect, now we have all the changes on the master branch on the dev branch.

There is one major difference between rebasing and merging: Git does not try to determine which files to keep or not. The branch we rebase always contains the most recent changes we want to keep! This way we don't run into any merge conflicts and keep a nice, linear Git history.

The above example shows rebasing on the master branch. However, in larger projects, you usually don't need to do this. git rebase modifies the project's history when creating new hashes for copied commits.

If you are developing a feature branch and the master branch has been updated, rebasing is useful. You can get all updates on your branch, which prevents merge conflicts in the future.

Interactive Rebase

## We can modify them before performing the rebase for the commit! We can use interactive rebasing to accomplish this task. Interactive rebasing is useful when you are on the branch you are currently developing and want to modify certain commits.
On the commit we are rebasing, we can perform the following 6 actions:


  • reword: Modify the submission information;

  • edit: Modify this submission;

  • squash: merge the submission into the previous submission;

  • fixup: merge the submission into the previous submission , do not keep log messages for that commit;

  • exec: Run the command we want to rebase on each commit;

  • drop: Remove the commit.


great! This way we have full control over our commits. If you want to remove a commit, just drop it.

Dozens of animated pictures tell you how Git works

#If you want to merge multiple commits Together to get a clear commit history, that's no problem!
Dozens of animated pictures tell you how Git works
Interactive rebasing gives you a lot of control when rebasing, even over the currently active branch.

Resetting

When we don’t want the previously submitted modifications, we will Use this command. Maybe this is a WIP commit or maybe it's a commit that introduced a bug, in which case you need to perform a git reset.

git reset allows us to no longer use the files on the current desktop, allowing us to control where HEAD should point.

Soft reset

Soft reset will move HEAD to the specified commit (or compared to HEAD index of the commit) without removing changes added after that commit!

Suppose we don't want to keep commit 9e78i, which adds a style.css file, and we don't want to keep commit 035cc, which adds an index.js file. However, we do want to keep the newly added style.css and index.js files! This is a perfect use case for soft reset.

Dozens of animated pictures tell you how Git works

After entering git status, you will see that we can still access all changes made on previous commits. This is great, it means we can fix the contents of these files and resubmit them later!

##Hard reset
Sometimes we don’t want to Preserve changes introduced by a specific commit. Unlike a soft reset, we should never need to access them again. Git should simply reset the overall state directly to the state before a specific commit: this even includes changes you made in the working directory and on staging files.


Dozens of animated pictures tell you how Git works
Git discarded the changes introduced by 9e78i and 035cc and reset the state to the state of ec5be.

##Reverting

Another way to undo changes is to perform git revert. By performing a revert operation on a specific commit, we create a new commit containing the reverted changes.
Suppose ec5be adds an index.js file. But then we discovered that we no longer needed the changes introduced by this commit. Then restore the ec5be submission!

Dozens of animated pictures tell you how Git works

Perfect! Commit 9e78i reverts the changes introduced by commit ec5be . git revert is useful when undoing a specific commit without modifying the branch's history.

##Cherry-picking

When a specific branch contains a certain commit that our active branch requires, we perform a cherry-pick on that commit! When cherry-picking a commit, we create a new commit on the active branch that contains the changes introduced by the picked commit.
Suppose commit 76d12 on the dev branch adds a change to the index.js file, and we want to integrate it into the master branch. We don't want the entire dev branch, just this commit!

Dozens of animated pictures tell you how Git works

##The master branch now contains the changes introduced in 76d12.

Fetching
If you have a remote Git branch, such as a branch on GitHub, you can use retrieval when the remote branch contains commits that the current branch does not have. Like when another branch is merged or your colleague pushes a quick fix.

By executing git fetch on this remote branch, we can get these changes locally. This does not affect your local branch in any way: fetch simply downloads the new data.

Dozens of animated pictures tell you how Git works

#Now we can see that since the last All modifications since push are included. The new data is now local and we can decide what to do with it.
Pulling

Although git fetch can be used to fetch Remote information for a certain branch, but we can also perform git pull. git pull is actually two commands combined into one: git fetch and git merge. When we pull changes from the source, we first retrieve all the data like git fetch, and then the latest changes are automatically merged into the local branch.

Dozens of animated pictures tell you how Git works

Great, we are now perfectly in sync with the remote branch and have all the latest changes!

##Reflog

Everyone makes mistakes, but it’s okay to make mistakes! Sometimes you may feel like you've completely corrupted your git repo, making you want to delete it entirely.
git reflog is a very useful command that can display the log of all actions that have been performed. This includes merges, resets, reverts, basically any changes you make to your branch.

Dozens of animated pictures tell you how Git works

#If you make a mistake, you can easily redo it by resetting HEAD based on the information provided by the reflog!

Suppose we don't actually need to merge the original branch. When we execute the git reflog command, we can see that the status of this repo was at HEAD@{1} before the merge. Then we perform a git reset and redirect HEAD to the location of HEAD@{1}.

Dozens of animated pictures tell you how Git works

#We can see that the latest actions have been is pushed to the reflog.

The above is the detailed content of Dozens of animated pictures tell you how Git works. For more information, please follow other related articles on the PHP Chinese website!

Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn

Hot AI Tools

Undresser.AI Undress

Undresser.AI Undress

AI-powered app for creating realistic nude photos

AI Clothes Remover

AI Clothes Remover

Online AI tool for removing clothes from photos.

Undress AI Tool

Undress AI Tool

Undress images for free

Clothoff.io

Clothoff.io

AI clothes remover

Video Face Swap

Video Face Swap

Swap faces in any video effortlessly with our completely free AI face swap tool!

Hot Tools

Notepad++7.3.1

Notepad++7.3.1

Easy-to-use and free code editor

SublimeText3 Chinese version

SublimeText3 Chinese version

Chinese version, very easy to use

Zend Studio 13.0.1

Zend Studio 13.0.1

Powerful PHP integrated development environment

Dreamweaver CS6

Dreamweaver CS6

Visual web development tools

SublimeText3 Mac version

SublimeText3 Mac version

God-level code editing software (SublimeText3)

Hot Topics

Java Tutorial
1660
14
PHP Tutorial
1260
29
C# Tutorial
1233
24
How to download git projects to local How to download git projects to local Apr 17, 2025 pm 04:36 PM

To download projects locally via Git, follow these steps: Install Git. Navigate to the project directory. cloning the remote repository using the following command: git clone https://github.com/username/repository-name.git

How to update code in git How to update code in git Apr 17, 2025 pm 04:45 PM

Steps to update git code: Check out code: git clone https://github.com/username/repo.git Get the latest changes: git fetch merge changes: git merge origin/master push changes (optional): git push origin master

How to solve the efficient search problem in PHP projects? Typesense helps you achieve it! How to solve the efficient search problem in PHP projects? Typesense helps you achieve it! Apr 17, 2025 pm 08:15 PM

When developing an e-commerce website, I encountered a difficult problem: How to achieve efficient search functions in large amounts of product data? Traditional database searches are inefficient and have poor user experience. After some research, I discovered the search engine Typesense and solved this problem through its official PHP client typesense/typesense-php, which greatly improved the search performance.

How to merge code in git How to merge code in git Apr 17, 2025 pm 04:39 PM

Git code merge process: Pull the latest changes to avoid conflicts. Switch to the branch you want to merge. Initiate a merge, specifying the branch to merge. Resolve merge conflicts (if any). Staging and commit merge, providing commit message.

What to do if the git download is not active What to do if the git download is not active Apr 17, 2025 pm 04:54 PM

Resolve: When Git download speed is slow, you can take the following steps: Check the network connection and try to switch the connection method. Optimize Git configuration: Increase the POST buffer size (git config --global http.postBuffer 524288000), and reduce the low-speed limit (git config --global http.lowSpeedLimit 1000). Use a Git proxy (such as git-proxy or git-lfs-proxy). Try using a different Git client (such as Sourcetree or Github Desktop). Check for fire protection

How to use git commit How to use git commit Apr 17, 2025 pm 03:57 PM

Git Commit is a command that records file changes to a Git repository to save a snapshot of the current state of the project. How to use it is as follows: Add changes to the temporary storage area Write a concise and informative submission message to save and exit the submission message to complete the submission optionally: Add a signature for the submission Use git log to view the submission content

How to update local code in git How to update local code in git Apr 17, 2025 pm 04:48 PM

How to update local Git code? Use git fetch to pull the latest changes from the remote repository. Merge remote changes to the local branch using git merge origin/<remote branch name>. Resolve conflicts arising from mergers. Use git commit -m "Merge branch <Remote branch name>" to submit merge changes and apply updates.

How to delete a repository by git How to delete a repository by git Apr 17, 2025 pm 04:03 PM

To delete a Git repository, follow these steps: Confirm the repository you want to delete. Local deletion of repository: Use the rm -rf command to delete its folder. Remotely delete a warehouse: Navigate to the warehouse settings, find the "Delete Warehouse" option, and confirm the operation.

See all articles