卧槽!小姐姐用动画图解 Git 命令,这也太秀了吧?!

2023-12-24 14:38

本文主要是介绍卧槽!小姐姐用动画图解 Git 命令,这也太秀了吧?!,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

公众号关注 “GitHubDaily”

设为 “星标”,每天带你逛 GitHub!

大家好,我是小 G。

在座的各位应该都知道,Git 作为居家必备、团队协作之利器,自从 Linus Torvalds 发布这款工具后,便一直受到各路开发者的喜爱。

不过,尽管如此,小 G 还是经常能在公众号后台,看到有不少水友留言反馈,说 Git 里面太多干巴巴,看起来非常枯燥无味的命令行,一旦几天没用,就很容易就忘得一干二净,希望 GitHubDaily 能出一些与 Git 相关的辅助教程,或者比较有趣、对小白比较友好的学习方式。

emmm.. 作为有求必应的小 G,当然是选择尽可能满足大家的一切要求啦。

几天前,小 G 偶然在 Twitter 看到一篇文章:《CS Visualized: Useful Git Commands》。

作者是来自英属哥伦比亚的小姐姐 Lydia Hallie,在这篇文章里面,她通过生动形象的动画,以更加直观的方式,向开发者展示 Git 命令中的 merge、rebase、reset、revert、cherry-pick 等常用骚操作的具体原理。

接下来,小 G 会挑选几个最简单的例子,让你们看看这位小姐姐是如何用动画来进行展示的。

在开始之前,还是得先跟大家简单说一下,这篇文章不算是针对小白萌新的 Git 初级入门文章,而是希望帮助有一定 Git 实操基础的用户,加深对具体 Git 命令的操作理解。

对 Git 不太熟悉的小伙伴,可看我们此前在公众号上分享的这几篇文章:

  • 强烈推荐下 GitHub 官方的这个教程

  • 收好这份 Git 命令应急手册,关键时刻可保你一命

  • 寓教于乐,用玩游戏的方式学习 Git!

嗯,下面开始进入正题。

合并(Merge)

我们都知道,在使用 Git 做日常开发项目的时候,都会选择将项目切换成多个分支,在不同分支上处理不同事务。最简单的,就是开发、测试、生产等几个不同环境来回切换,使得项目管理与产品迭代更为轻松,亦可最大化避免项目出现严重漏洞时所带来的伤害。

当我们在不同分支开发完代码后,会选择将分支进行合并(merge)。平时常用的 git merge 操作,又可分为这两种类型:fast-forwarno-fast-forward

fast-forward

一般情况下,Git 会默认使用 fast-forward 这种类型来处理分支合并,当我们成功合并后,不会产生任何提交记录,且当旧分支被移除后,其分支信息也会被一并删除。

通过动画的方式展示,就像下面这样:

no-fast-forward

而当我们使用 no-fast-forward 模式,即在合并分支命令加入 --no-ff 后缀的方式运行时,便会生成一个新的提交记录,就像下面这样:

合并冲突

在我们日常进行团队协作开发的时候,总会出现同个文件在不同分支上被同时编辑的情况。

这样,当我们提交代码的时候,比较晚提交的另一方,在运行 Git 命令时就会报冲突错误。在正常情况下,只要我们手动处理下冲突文件,然后再重新提交即可。

打个比方,现在代码仓库有个 README 文件,在同一行的位置,在不同分支上被编辑了,如下所示:

那么,使用合并命令,及修复冲突的过程,用动画的形式展示,看起来就像下面这样:

可以看到,在移除多余的提示代码后,会重新产生一条新的提交记录。

Rebase

在进行分支合并前,我们一般会先使用pull命令拉取线上的最新代码,在保证无任何冲突发生的前提下,再进行分支合并。

但是,这种代码拉取方式是最为简单粗暴的,通过这种方式合并,会使得整个提交记录看起来特别乱,不太直观与优雅。

因此,对 Git 使用比较规范、追求比较高的程序员,都会先使用rebase整理下提交记录,再提交代码,经过这样处理后的 Git 提交记录,看着就比直男还直了

以动画的方式呈现,就像下面这样:

可以清晰的看到,原本对接在 master 分支第二处的 dev 分支,被对接到顶部了。

Hard Reset

日常开发中,我们可能会因为提交了某些无用代码而进行回滚操作。通常在只有一个人独立开发的项目情况下,会选用--hard命令来进行回滚处理。

不过,这种操作方式有个不好的地方,在多人协作的时候,这么搞很容易使分支出现冲突,或直接毁掉别人的提交记录。

hard reset以动画的形式表现,看起来就像下面这样:

除此之外,小姐姐还提到了 Reverting、Cherry-picking、Fetch 等一系列操作,这里限于篇幅,就不跟大家一一讲解啦。

感兴趣的同学,可以查看小姐姐文章详情:

https://dev.to/lydiahallie/cs-visualized-useful-git-commands-37p1

以上,就是今天跟大家的分享啦,最近也发现了几个比较有意思的项目,小 G 正在把玩中,回头玩的比较溜了,会在公众号这边撰文跟大家分享哈。

担心走丢的小伙伴,可以将 GitHubDaily 公众号设为星标,我们下期再会。

拜拜 ????。

推荐阅读:
逛 GitHub 没看过这 10 个开源项目,绝对血亏...霸榜 GitHub:去你丫的算法!
卧槽!为鼓励民众居家隔离,国外这些计算机学习资源将免费对外开放!
全球呼吸机告急!医疗科技巨头美敦力 "开源" 设计图和源代码!
Eclipse Theia 1.0 发布,这才是 VS Code 真正的开源替代方案?!

这篇关于卧槽!小姐姐用动画图解 Git 命令,这也太秀了吧?!的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/532121

相关文章

最好用的WPF加载动画功能

《最好用的WPF加载动画功能》当开发应用程序时,提供良好的用户体验(UX)是至关重要的,加载动画作为一种有效的沟通工具,它不仅能告知用户系统正在工作,还能够通过视觉上的吸引力来增强整体用户体验,本文给... 目录前言需求分析高级用法综合案例总结最后前言当开发应用程序时,提供良好的用户体验(UX)是至关重要

Linux使用nohup命令在后台运行脚本

《Linux使用nohup命令在后台运行脚本》在Linux或类Unix系统中,后台运行脚本是一项非常实用的技能,尤其适用于需要长时间运行的任务或服务,本文我们来看看如何使用nohup命令在后台... 目录nohup 命令简介基本用法输出重定向& 符号的作用后台进程的特点注意事项实际应用场景长时间运行的任务服

基于Python实现PDF动画翻页效果的阅读器

《基于Python实现PDF动画翻页效果的阅读器》在这篇博客中,我们将深入分析一个基于wxPython实现的PDF阅读器程序,该程序支持加载PDF文件并显示页面内容,同时支持页面切换动画效果,文中有详... 目录全部代码代码结构初始化 UI 界面加载 PDF 文件显示 PDF 页面页面切换动画运行效果总结主

Redis的Hash类型及相关命令小结

《Redis的Hash类型及相关命令小结》edisHash是一种数据结构,用于存储字段和值的映射关系,本文就来介绍一下Redis的Hash类型及相关命令小结,具有一定的参考价值,感兴趣的可以了解一下... 目录HSETHGETHEXISTSHDELHKEYSHVALSHGETALLHMGETHLENHSET

如何使用 Bash 脚本中的time命令来统计命令执行时间(中英双语)

《如何使用Bash脚本中的time命令来统计命令执行时间(中英双语)》本文介绍了如何在Bash脚本中使用`time`命令来测量命令执行时间,包括`real`、`user`和`sys`三个时间指标,... 使用 Bash 脚本中的 time 命令来统计命令执行时间在日常的开发和运维过程中,性能监控和优化是不

bat脚本启动git bash窗口,并执行命令方式

《bat脚本启动gitbash窗口,并执行命令方式》本文介绍了如何在Windows服务器上使用cmd启动jar包时出现乱码的问题,并提供了解决方法——使用GitBash窗口启动并设置编码,通过编写s... 目录一、简介二、使用说明2.1 start.BAT脚本2.2 参数说明2.3 效果总结一、简介某些情

PHP执行php.exe -v命令报错的解决方案

《PHP执行php.exe-v命令报错的解决方案》:本文主要介绍PHP执行php.exe-v命令报错的解决方案,文中通过图文讲解的非常详细,对大家的学习或工作有一定的帮助,需要的朋友可以参考下... 目录执行phpandroid.exe -v命令报错解决方案执行php.exe -v命令报错-PHP War

CentOS系统使用yum命令报错问题及解决

《CentOS系统使用yum命令报错问题及解决》文章主要讲述了在CentOS系统中使用yum命令时遇到的错误,并提供了个人解决方法,希望对大家有所帮助,并鼓励大家支持脚本之家... 目录Centos系统使用yum命令报错找到文件替换源文件为总结CentOS系统使用yum命令报错http://www.cppc

Qt QWidget实现图片旋转动画

《QtQWidget实现图片旋转动画》这篇文章主要为大家详细介绍了如何使用了Qt和QWidget实现图片旋转动画效果,文中的示例代码讲解详细,感兴趣的小伙伴可以跟随小编一起学习一下... 一、效果展示二、源码分享本例程通过QGraphicsView实现svg格式图片旋转。.hpjavascript

【前端学习】AntV G6-08 深入图形与图形分组、自定义节点、节点动画(下)

【课程链接】 AntV G6:深入图形与图形分组、自定义节点、节点动画(下)_哔哩哔哩_bilibili 本章十吾老师讲解了一个复杂的自定义节点中,应该怎样去计算和绘制图形,如何给一个图形制作不间断的动画,以及在鼠标事件之后产生动画。(有点难,需要好好理解) <!DOCTYPE html><html><head><meta charset="UTF-8"><title>06