编写正确的 git 提交

那是 8 月 28 日，我的朋友将我的简历发送给一家拥有 2 名高级开发人员的小公司，要求招募一名初级开发人员加入他们的团队。

他们联系我并安排了一次会面后，给了我一项任务（或者说是家庭作业）。这项“家庭作业”是创建一个员工目录应用程序，提供基本的 CRUD（创建、读取、更新、删除）功能。

我被要求使用哪种类型的前端（他们内部使用 Angular，但由于我有一些 React 经验，所以最终选择了 React）以及 Nodejs + Express 作为后端（他们大量使用 Nodejs 作为后端）。“家庭作业”的一部分是要充分发挥这些功能，包括添加一些有助于开发的脚本（例如：在你的包 json 中设置一个脚本，使用rimraf（一个 Nodejs 包）删除构建文件夹，然后构建你的项目以尽可能获得最新的项目），使用 linters 和代码格式化程序，使用 Graphql 等新技术，以及使用 Algolia 等外部服务来搜索员工。

他们详细描述了如何以他们认为高效、简洁、可扩展的方式构建应用程序。他们重视代码质量和 git 提交质量。

这不是玩笑

这是你第一次发现有人要求 git 提交质量，通常招聘人员会要求你提供之前写过的代码，以便他们可以审查

通常你会提供你的 github/gitlab/bitbucket 链接，以便他们可以审查你的代码，但这还不止于此：他们会审查一些并非所有高级职员和 CTO 都关注的事情，那就是 git 提交

那么接下来发生了什么？🤔

我没有得到这份工作，但我从这个“家庭作业”中学到一些东西，你很少在任何地方得到这样的机会。

这个“家庭作业”的目的不是展示你的技能（如果你能展示你的技能，那对你有好处），而是让你适应和学习新事物，并自我检讨

他们为什么关注 git 提交？🙂

事实证明，他们开发的每个网站/应用程序/库版本，都会在 README.md 文件中记录每个版本的所有更新

拥有正确的 git 提交对填充 README.md 文件有很大帮助，如果发生任何错误，您可以随时通过 git revert 恢复到特定的提交

如果 git 提交不正确或质量较差，你将很难记住哪个提交负责特定的推送（说实话，并不是每个人都有过目不忘的记忆力来记住所有事情。我们人类会忘记，这没关系，真的！）

糟糕的 git 提交示例

update navbar

这里你说你已经更新了导航栏，但是你更新了什么呢？🤔

navbar updated, elements now stacked in a linear way

仍然很差，因为你说元素是以线性方式堆叠的，但是怎么做到的呢？为什么？首先问题是什么？

date reverser function for bookings is working

太棒了，你创建了一个反转日期格式的函数，但它在 Bookings 文件中吗？你一开始为什么要创建它？它有什么用途？

好的 git 提交示例

navbar updated [check description]

- used css-grid instead of flexbox for aligning the elements
- used grid-template-columns with a repeat of 4 columns 1fr wide
- every element is placed in the center to the main grid div tag
- this setting can help us in mobile much faster by switching columns to rows

记住前两个 git 提交，将它们与此进行比较：它们是相同的，但这个提交更易于阅读

我知道发生了什么以及我使用了什么，因此如果出现任何错误，我总是可以参考这个提交

date reverser function on bookings [check description]

- date reverser function was created in the utils folder
- purpose of this function to reverse the format from YYYY-MM-DD to DD-MM-YYYY
- eventhough this should be a backend issue but currently the backend team is busy and we needed a quick fix
- when backend engineers are free, they can reverse it from their side and this function has served its purpose

将第一个日期反转函数提交与此函数进行比较，您创建此函数的目的是因为后端团队无法自由反转日期格式，并且您需要一个快速的解决方案来使用

[查看描述] 的用途

大多数人会忽略这些提交下的描述，原因如下：

写入的第一行始终是标题，标题下的任何内容都将被视为正文。在 Github/Gitlab/Bitbucket 上，除非您按下该提交以查看描述，否则标题将仅显示

将此添加到标题中会使开发人员好奇正文中的内容

好的 git commit 示例

我们将使用导航栏示例

[UPDATE] stacking elements on Navbar [check description]

- [IMPLEMENT] use css-grid instead of flexbox
- [IMPLEMENT] use grid-template-columns repeated 4 times with 1fr wide
- [IMPLEMENT] every element is placed in the center respectively to the parent grid div
- [SUGGESTION] this setting can help us better in mobile development by switching columns to rows
- [FIX] fix padding on each element by decreasing it from 15px to 10px
- [FIX] set the elements div's left margin to auto to be aligned at the end of the parent navbar div automatically
- [UPDATE] remove bootstrap classes and use own made classes

这里有一个更详细的版本，更详细。它可能看起来很奇怪，而且很耗时，但想想看，这样你就能省下不少猜测你在那次提交中做了什么的时间了。

直到最近我才开始使用它，因为我清楚地知道我做了什么，无论是修复还是新的实现，还是以后的建议

怎么写这些提交？🤔 我的终端不允许我这么做

我使用 VSCode 来实现这个目的（我使用 VSCode 来做所有事情，因此将它设置为我的 git 编辑器也是有意义的）

最简单的方法是将 VSCode 设置为默认的 git 编辑器

首先通过设置 VSCode 的路径来启用 VSCode 在终端中工作（在此处阅读）

然后在终端中设置

git config --global core.editor "code --wait"

这会将 VSCode 设置为您的核心 git 编辑器，每当您想要在 git 中提交时，您都可以这样做：

git commit

它将在 VSCode 中打开一个新窗口，编写所需的提交，然后保存并关闭文件，这样它就不会再等待 VSCode

您可以在此处阅读