首页 >web前端 >js教程 >每个 React 开发团队都需要了解的最佳版本控制实践

每个 React 开发团队都需要了解的最佳版本控制实践

Mary-Kate Olsen原创: 2024-11-08 09:16:011033浏览

想象一下与一群开发人员一起工作，他们正在构建一个复杂的乐高结构，但每个人的指令集略有不同。当许多 React 应用程序中版本控制失败时，就会发生这种情况。就在上周，一个团队对他们的网站推出了看似简单的更新，但它并没有改善事情，反而引发了问题的连锁反应。

购物车停止工作，登录页面一片空白，没有人能够弄清楚最近的哪项更改导致了混乱。

这并不是一个罕见的故事——它发生在世界各地的开发团队中。虽然大多数开发人员知道如何保存代码更改（例如创建乐高进度的定期快照），但 React 项目需要更复杂的东西。 为什么？因为 React 网站与俄罗斯方块视频游戏没有太大区别，后者需要所有部分完美地组合在一起。当他们不能很好地融入时，这不仅会令人沮丧，而且还会令人沮丧。这可能会导致游戏快速结束（收入损失、用户不满意以及开发人员压力很大）。然而，有一个更好的方法来处理这些问题，首先要了解如何监控和管理 React 项目中的更改。

介绍

2023 年前三季度，GitHub 分析显示，64% 的 React 项目因版本控制问题面临部署回滚，其中组件依赖冲突占了近一半。对于管理大型 React 应用程序的团队来说，2021 年至 2023 年间，解决合并冲突所花费的平均时间从每周 2.5 小时跃升至 4.8 小时。这些时间本可以用于构建更好的用户体验或创建新功能。虽然现在有更有效的方法来处理这些困难，但首先让我们回顾一下这种情况，看看您是否能认识到类似的情况。

您的团队花了几个小时为 React 项目进行更新，最后在花费了如此忙碌的时间进行更新之后，他们终于发布了它，却发现一个关键组件在生产中出现了故障。最糟糕的是，由于与主要客户举行重要会议，您的首席开发人员无法解决这个问题。没有人可以确定何时何地引入了重大更改，并且已经存在三个不同版本的状态管理解决方案相互冲突。这听起来像您以前遇到过的情况吗？你知道吗，在今年最后两个季度，大约 78% 的 React 开发者每三个月至少报告一次类似的情况。虽然大多数开发人员了解保存代码更改的基础知识（拍摄进度快照），当然也了解 Git 的基础知识，但 React 项目始终需要更复杂的版本控制策略，因为它们的独特挑战被许多团队忽视，因为他们知道根据最近的行业研究，这种方法可以将严重事件减少高达 72%。

为了管理源代码随时间的变化，版本控制是软件开发成功的基石。它的作用就像ABC一样简单，它使开发人员能够：

彻底记录所有代码修改。
管理多个软件版本。
与团队中的其他成员有效合作。
通过返回到早期版本来修复错误。
同时开发多个功能

从开发人员在使用版本控制系统时获得的能力来看，有必要说每个 React 开发人员都应该能够在 React 代码库始终稳定、团队合作轻松、可恢复的环境中工作改变很简单。然而，要做到这一点，需要考虑某些指导方针和实践，这在本文中得到了适当的阐述。我们将介绍在 React 中使用版本控制的最佳实践，同时精确考虑您应该采取的步骤。选择适当的版本控制系统将是我们将引导您创建一个更具生产力和协作性的工作空间的第一步，然后创建易于理解的提交消息并实施有效的分支策略。还将涵盖代码审查、管理依赖关系以及建立持续集成和部署 (CI/CD) 的重要性。最后，我们将讨论如何处理争议和回滚，以及清晰沟通和文档对开发人员的重要性。

翻译：博士

Best Version Control Practices Every React Development Team Needs To Know

#1/8：选择正确的版本控制系统

选择合适的版本控制系统取决于一些因素，例如项目的需求、团队的规模以及所需的工作流程，每种版本控制系统都有利有弊。但选择最适合您个人或专业要求的一种是明智之举！以下是一些最著名的：

1。 git：

Git 是一种分布式 VCS，每个开发人员都维护存储库的完整副本。 Git 的这种分布式特性使开发人员可以更轻松地离线工作并创建本地分支，而无需持续连接到中央服务器。

除了 Git 的优点之外，值得一提的是，Git 强大的分支和合并功能是它提供的最大优点之一。正因为如此，开发人员可以轻松测试新功能或有效调试其他分支，而不会影响主代码。这种分支效应创建的隔离可确保所有代码的生成不会出现任何中断，从而允许并行开发流。

Git 的结构可以很好地处理大型项目。它适用于小团体和大公司，因为它可以处理许多文件和许多人而不会减慢速度。

它背后有一个强大的社区和许多可用的工具。由于很多人使用 Git，因此创建了许多教程和资源。这使得 Git 对于新用户来说更容易，同时仍然为熟悉它的用户提供高级工具。

了解更多关于 Git：点击这里

2。水银：

与 Git 一样，Mercurial 也是一个分布式版本控制系统 (VCS)。这意味着 Mercurial 允许分散式开发，因此开发人员可以使用包含完整历史记录的本地存储库副本进行离线工作。

Mercurial 因其易于使用而广为人知。由于其简单的命令行界面和有吸引力的图形用户界面，它为自己赢得了对初学者友好的声誉。然而，这种用户友好性并没有削弱它的功能，因为 Mercurial 可以通过强大的分支和合并功能有效地管理复杂的工作流程。

Mercurial 就性能而言擅长处理大型项目。它结合了速度、易用性和强大的功能，快速有效地完成操作，使其成为处理大型代码库的团队可靠且值得信赖的选择。由于这些优点，Mercurial 成为寻求可靠版本控制系统的开发人员和组织的青睐选择。

要了解有关 Mercurial 的更多信息：单击此处

3。颠覆（SVN）：

另一方面，SVN 是一个集中式版本控制系统，其中客户端-服务器系统由托管项目所有历史记录的中央服务器锚定。它易于设置并且步骤数量有限，这使得它非常适合根据负责的团队部署在特定开发活动的小规模项目中。

但是SVN在分支和合并设施方面不是很强，这也是它不像大规模工作的分布式版本控制系统那样自由的原因之一。 SVN 还具有支持原子提交的令人赞赏的功能，因为用户将无法仅实现变更集的一部分。而且，SVN对Windows有很好的支持，保证其工作总能集成到Windows环境中。

了解更多关于 SVN：点击这里

除了这些类型的 VCS 之外，还可以识别其他 VCS。然而，其他类型虽然也有自己的用途，但目前在现代 Web 开发中并未广泛使用。由于它们与当前的 Web 开发范例无关，因此本文未讨论它们。尽管它们可能具有针对特定领域的特定功能，但它们不能满足常见的 Web 开发需求，并且在当今开发所需的工具和社区方面没有强大的基础和支持。

为什么 Git 是 React 开发的首选

在React框架内工作的实践中，Git变成了不可或缺的工具。尽管还有其他可用的系统，并且它们都有各自的优点和缺点；尽管如此，Git 似乎将所有这些功能与全球各地的灵活性和活跃用户结合在一起，因此是大多数开发人员（尤其是 React 开发人员）的首选。通过其在高工作流程中的可用性、有效的团队合作以及允许自由实验，它巩固了其首选地位。

Best Version Control Practices Every React Development Team Needs To Know

最后，我们要指出的是，所有考虑的 VCS 都有其优点和缺点，最佳 VCS 的选择又与项目需求、参与者数量和个人工作偏好有关。但是，对于 89% 的 React 开发人员来说，没有比 Git 更好的工具了。

做出正确的选择

使用哪种 VCS 的决定非常关键。这个电话会影响您的团队、具体项目以及您完成项目开发的速度。不要急于求成，在考虑我下面列出的因素的同时，慢慢地考虑所有选项，然后再决定哪一个最适合您？.

Best Version Control Practices Every React Development Team Needs To Know

最佳实践

任何 VCS 成功的关键是正确实施、团队支持以及始终坚持最佳实践。但是，如果您定期进行培训、拥有清晰的文档并建立了工作流程，那么无论选择何种系统，有效的版本控制都离您不远。无论选择哪种 VCS，请遵循以下最佳实践：

Best Version Control Practices Every React Development Team Needs To Know

#2/8：设置您的 Git 工作流程

大家都知道，软件开发中的任何项目只有在团队环境中拥有严格的 Git 工作流程才能称为成功。首先，我将向您介绍最常用的分支策略，以方便您为特定项目选择最佳的分支策略。

Best Version Control Practices Every React Development Team Needs To Know

分支策略

1。 Git 流程：

Git Flow 是一种强大的分支策略，专为计划发布的项目而设计。它由 Vincent Driessen 提出，并已成为许多组织的标准。它遵循严格的分支层次结构，并使用长期存在的分支来实现功能和修复。

主要分行：

main/master: 存储官方发布历史
开发：作为功能的集成分支
feature/*：包含新功能开发
release/*：准备生产版本
修补程序/*：解决生产中的关键错误

工作流程

功能开发从develop开始
功能被合并回开发中
Release分支是从develop创建的
测试后，release合并到main和develop中
修补程序从主分支并合并到主分支和开发分支

我们将看一下这个在购物应用程序中添加 Stripe 支付功能的真实应用程序开发示例。

# Start a new feature
git checkout develop
git pull origin develop
git checkout -b feature/payment-gateway

# Work on the feature
# Add Stripe integration code to payment.js
git add src/payment.js
git commit -m "Add Stripe payment integration"

# Add payment form
git add src/components/PaymentForm.jsx
git commit -m "Add payment form component"

# Add tests
git add tests/payment.test.js
git commit -m "Add payment integration tests"

# Ready to merge
git checkout develop
git pull origin develop
git merge feature/payment-gateway
git push origin develop

准备发布

# Create release branch
git checkout -b release/1.0.0 develop

# Update version
npm version 1.0.0
git add package.json
git commit -m "Bump version to 1.0.0"

# Fix last-minute issues
git add src/bugfix.js
git commit -m "Fix payment validation bug"

# Merge to main and develop
git checkout main
git merge release/1.0.0 --no-ff
git tag -a v1.0.0 -m "Version 1.0.0"
git push origin main --tags

git checkout develop
git merge release/1.0.0 --no-ff
git push origin develop

紧急修补程序示例

# Create hotfix branch
git checkout -b hotfix/1.0.1 main

# Fix the critical bug
git add src/payment.js
git commit -m "Fix payment processing timeout"

# Update version
npm version patch
git add package.json
git commit -m "Bump version to 1.0.1"

# Merge to main and develop
git checkout main
git merge hotfix/1.0.1 --no-ff
git tag -a v1.0.1 -m "Version 1.0.1"
git push origin main --tags

git checkout develop
git merge hotfix/1.0.1 --no-ff
git push origin develop

优点

非常适合预定的发布
清晰分离正在进行的工作
非常适合管理多个版本

缺点

小型项目的复杂性
会减慢持续交付
分支机构管理的开销

2。 GitHub 流程：

与 Git Flow 相比，工作流程更简单，具有单个长期分支（通常是主分支）和短期功能分支。它专注于持续交付和部署，并通过拉取请求向主分支进行提交。

关键原则

主分支始终是可部署的
通过功能分支进行的所有更改
拉取讨论请求
合并后立即部署

工作流程

从主分支创建分支
添加提交
打开拉取请求
回顾和讨论
部署和测试
合并到主目录

使用 GitHub 命令，我们将查看这个功能开发示例 - 将购物车添加到应用程序。

# Start a new feature
git checkout develop
git pull origin develop
git checkout -b feature/payment-gateway

# Work on the feature
# Add Stripe integration code to payment.js
git add src/payment.js
git commit -m "Add Stripe payment integration"

# Add payment form
git add src/components/PaymentForm.jsx
git commit -m "Add payment form component"

# Add tests
git add tests/payment.test.js
git commit -m "Add payment integration tests"

# Ready to merge
git checkout develop
git pull origin develop
git merge feature/payment-gateway
git push origin develop

部署流程

# Create release branch
git checkout -b release/1.0.0 develop

# Update version
npm version 1.0.0
git add package.json
git commit -m "Bump version to 1.0.0"

# Fix last-minute issues
git add src/bugfix.js
git commit -m "Fix payment validation bug"

# Merge to main and develop
git checkout main
git merge release/1.0.0 --no-ff
git tag -a v1.0.0 -m "Version 1.0.0"
git push origin main --tags

git checkout develop
git merge release/1.0.0 --no-ff
git push origin develop

优点

简单明了
非常适合持续部署
更适合小型团队
减少开销

缺点

不太适合多个版本
对分阶段发布的有限支持
可能需要复杂的 CI/CD

3。基于主干的开发：

涉及频繁地将小的、可管理的更改直接集成到主分支中，通常一天多次。它强调持续集成和发布。

关键概念

短暂的功能分支
直接提交到主干
未完成工作的功能标记
强调小而频繁的提交

工作流程

小功能分支（最多 1-2 天）
持续集成到主干
不完整功能的功能切换
从主干定期部署

短暂的功能分支

# Create hotfix branch
git checkout -b hotfix/1.0.1 main

# Fix the critical bug
git add src/payment.js
git commit -m "Fix payment processing timeout"

# Update version
npm version patch
git add package.json
git commit -m "Bump version to 1.0.1"

# Merge to main and develop
git checkout main
git merge hotfix/1.0.1 --no-ff
git tag -a v1.0.1 -m "Version 1.0.1"
git push origin main --tags

git checkout develop
git merge hotfix/1.0.1 --no-ff
git push origin develop

功能切换示例

# Start new feature
git checkout -b feature/shopping-cart

# Make changes and commit regularly
git add src/cart.js
git commit -m "Add shopping cart base structure"

git add src/components/CartItem.jsx
git commit -m "Add cart item component"

# Push to remote and create PR
git push origin feature/shopping-cart

# After PR review, merge via GitHub UI

优点

简化持续集成
减少合并冲突
更快的反馈周期
更适合经验丰富的团队

缺点

需要强大的测试文化
可能需要功能切换
对于经验不足的团队来说可能具有挑战性

建立分支模型

1。功能分支：

用于开发新功能的单独分支，允许独立工作而不影响主分支。功能完成和测试后合并回主分支。功能分支是大多数 Git 工作流程的基础。

最佳实践

指南

保持分支短暂（最多 1-2 周）
每个分支一个功能
定期提交并传达明确的消息
经常从父分支更新

# Start a new feature
git checkout develop
git pull origin develop
git checkout -b feature/payment-gateway

# Work on the feature
# Add Stripe integration code to payment.js
git add src/payment.js
git commit -m "Add Stripe payment integration"

# Add payment form
git add src/components/PaymentForm.jsx
git commit -m "Add payment form component"

# Add tests
git add tests/payment.test.js
git commit -m "Add payment integration tests"

# Ready to merge
git checkout develop
git pull origin develop
git merge feature/payment-gateway
git push origin develop

生命周期

从最新的开发或主要创建
定期重新调整以保持最新状态
合并前的代码审查
合并后删除

2。发布分支：
在准备新版本时创建。他们在代码上线之前帮助稳定和测试代码。在合并回主分支之前，任何错误修复或最终调整都会在此处进行。

关键方面

1。创作

# Create release branch
git checkout -b release/1.0.0 develop

# Update version
npm version 1.0.0
git add package.json
git commit -m "Bump version to 1.0.0"

# Fix last-minute issues
git add src/bugfix.js
git commit -m "Fix payment validation bug"

# Merge to main and develop
git checkout main
git merge release/1.0.0 --no-ff
git tag -a v1.0.0 -m "Version 1.0.0"
git push origin main --tags

git checkout develop
git merge release/1.0.0 --no-ff
git push origin develop

2。目的

版本升级
文档更新
错误修复
没有新功能

3。管理

从开发中创建
合并到main和develop
main 中的标签发布
合并后删除

3。修补程序分支： 用于生产中的关键错误修复。修补程序分支是从主分支创建的，修复程序将在其中应用、测试，然后合并回主分支和发布分支。

执行

1。创作

# Create hotfix branch
git checkout -b hotfix/1.0.1 main

# Fix the critical bug
git add src/payment.js
git commit -m "Fix payment processing timeout"

# Update version
npm version patch
git add package.json
git commit -m "Bump version to 1.0.1"

# Merge to main and develop
git checkout main
git merge hotfix/1.0.1 --no-ff
git tag -a v1.0.1 -m "Version 1.0.1"
git push origin main --tags

git checkout develop
git merge hotfix/1.0.1 --no-ff
git push origin develop

2。处理

主干的分支
修复单个问题
合并到main和develop
标记新版本

3。指南

最小范围
快速周转
紧急审核流程
立即部署

决策矩阵

Factor	Git Flow	GitHub Flow	Trunk-Based
Team Size	Large	Small-Medium	Any
Release Cycle	Scheduled	Continuous	Continuous
Complexity	High	Low	Medium
Experience Needed	Medium	Low	High
Version Management	Excellent	Limited	Limited

#3/8：提交消息的最佳实践

提交消息只是开发人员在保存代码更改时编写的简短描述。它描述了您更改的内容以及进行这些更改的原因。每当对文件进行更新或添加新行代码时，都会在版本控制系统（例如 Git）中创建提交。

编写清晰简洁的提交消息

出于多种原因，编写清晰的提交消息非常重要 - 出于清晰的沟通、结构化数据和集成的目的。他们在特定时间和地点记录项目，使其他开发人员（包括作者本人）更容易了解为什么进行更改。拥有良好的提交消息可以轻松地使某人获得项目的历史记录，并减少人们尝试破译历史记录所花费的时间。通过提交消息，总是有更多的信息，而不仅仅是检查更改的人员将收到的代码。

编写良好的提交消息中的描述符也可以减少代码审查过程的耗时。它可以帮助审阅者更好地理解为什么需要进行此类更改，从而将他们的注意力引导到代码的正确元素上，从而减少审阅过程中的混乱。

为分支提供干净的提交历史对于维持项目至关重要。标准提交消息还可以启用调试，因为您有更改历史记录，并且可以判断何时真正引入了错误。这使得调试变得容易，并且如果需要回滚更改，也可以快速恢复。提交消息还有助于创建有用的变更日志。

最后但并非最不重要的一点是，简单的提交消息使其他团队成员更容易理解变更的目标，从而使项目协作更加顺利。

良好提交消息的结构

结构良好的提交消息通常遵循以下格式：

# Start a new feature
git checkout develop
git pull origin develop
git checkout -b feature/payment-gateway

# Work on the feature
# Add Stripe integration code to payment.js
git add src/payment.js
git commit -m "Add Stripe payment integration"

# Add payment form
git add src/components/PaymentForm.jsx
git commit -m "Add payment form component"

# Add tests
git add tests/payment.test.js
git commit -m "Add payment integration tests"

# Ready to merge
git checkout develop
git pull origin develop
git merge feature/payment-gateway
git push origin develop

关键要素包括：

1。主题行（第一行）：

# Create release branch
git checkout -b release/1.0.0 develop

# Update version
npm version 1.0.0
git add package.json
git commit -m "Bump version to 1.0.0"

# Fix last-minute issues
git add src/bugfix.js
git commit -m "Fix payment validation bug"

# Merge to main and develop
git checkout main
git merge release/1.0.0 --no-ff
git tag -a v1.0.0 -m "Version 1.0.0"
git push origin main --tags

git checkout develop
git merge release/1.0.0 --no-ff
git push origin develop

2。邮件正文：

# Create hotfix branch
git checkout -b hotfix/1.0.1 main

# Fix the critical bug
git add src/payment.js
git commit -m "Fix payment processing timeout"

# Update version
npm version patch
git add package.json
git commit -m "Bump version to 1.0.1"

# Merge to main and develop
git checkout main
git merge hotfix/1.0.1 --no-ff
git tag -a v1.0.1 -m "Version 1.0.1"
git push origin main --tags

git checkout develop
git merge hotfix/1.0.1 --no-ff
git push origin develop

3。页脚：

任何其他信息，例如相关问题的链接或有关重大更改的注释。

良好提交消息的示例：

# Start new feature
git checkout -b feature/shopping-cart

# Make changes and commit regularly
git add src/cart.js
git commit -m "Add shopping cart base structure"

git add src/components/CartItem.jsx
git commit -m "Add cart item component"

# Push to remote and create PR
git push origin feature/shopping-cart

# After PR review, merge via GitHub UI

和/或

# Start a new feature
git checkout develop
git pull origin develop
git checkout -b feature/payment-gateway

# Work on the feature
# Add Stripe integration code to payment.js
git add src/payment.js
git commit -m "Add Stripe payment integration"

# Add payment form
git add src/components/PaymentForm.jsx
git commit -m "Add payment form component"

# Add tests
git add tests/payment.test.js
git commit -m "Add payment integration tests"

# Ready to merge
git checkout develop
git pull origin develop
git merge feature/payment-gateway
git push origin develop

提交频率：您应该多久提交一次更改？

提交更改的做法通常很频繁，更频繁地进行小更改通常被认为是最佳实践，尽管可能还涉及其他因素。大量提交允许将开发分为小部分，并将性能与之前的阶段进行比较，并在必要时快速消除缺陷。但是，在进行更改时，建议每次提交的每个责任都应该有一个更改。提交应该捕获单个更改，或逻辑上一起使用以实现功能的一组更改。这为提交保留了整洁、合理且易于审核的历史记录。此外，每次提交都应该可以创建一个里程碑，无论更改有多小； Trident 的想法是完成一项可供使用的工作，即使它的建立只是为了作为后续更改的基础。遵守这些原则才能保持版本历史记录的反应堆干净清晰。

您应该在以下情况下提交更改：

# Create release branch
git checkout -b release/1.0.0 develop

# Update version
npm version 1.0.0
git add package.json
git commit -m "Bump version to 1.0.0"

# Fix last-minute issues
git add src/bugfix.js
git commit -m "Fix payment validation bug"

# Merge to main and develop
git checkout main
git merge release/1.0.0 --no-ff
git tag -a v1.0.0 -m "Version 1.0.0"
git push origin main --tags

git checkout develop
git merge release/1.0.0 --no-ff
git push origin develop

小型、频繁的提交与大型、不频繁的提交

1。小而频繁的提交：

在使用 SCM 时，建议执行多次小更新，而不是几次大更新，因为前者不太可能扭曲版本历史记录。频繁且简短的提交也有很多好处。它们提供了线性/适当的变更进展，简化了代码审查会议，最大限度地减少了破坏性的巨大变更的可能性，并使持续集成和测试变得更加容易。

风险控制、流程控制以及团队的组建是与小频繁提交相关的其他好处。从风险管理的角度来看，更频繁的提交意味着更容易撤消某个更改，合并冲突的可能性更小，可能出现的问题被限制在一个小范围内，并且代码的基线备份更频繁。
至于开发中的流程控制，很多人发现小的提交更容易理解，这有助于简化代码审查，并且对于更详细的版本历史记录非常重要，而这反过来又说明了明确的开发流程。在团队协作方面，小型提交可以缩短反馈循环，更快地与其他变更集成，提高进度可见性并减少合并问题。

总而言之，与定期进行的大量提交相比，每日提交可以被认为是一个主要优势，这应该被用作版本控制和协作软件开发的最佳实践。

2。大量、不频繁的提交：

当提交量很大时，尤其是那些零星发生的提交时，可能会遇到许多问题。一次更新更多不相关的项目可能会导致各种更改重叠，从而使根据提交历史记录区分一项更改与另一项更改变得复杂。这是一个潜在的问题，因为识别此类程序中可能存在的问题的根源变得很麻烦。他们还发现，很有可能引入多个错误，这样做会使调试和解决问题的过程变得更加困难。

偶尔进行一次的重大更改也会导致代码审查出现问题。因此，审稿人研究变更的各个方面并理解它们变得更加困难，这可能会导致差距甚至不完整的审稿。

但是，有一些重要因素可以归因于大量、不频繁的提交。这包括遇到合并冲突的可能性、审查更改更具挑战性、出现错误时可能会丢失更多工作，以及在需要时更难以恢复更改。

大量不频繁的提交也有可能产生巨大的开发影响。它可能会导致具有挑战性的调试过程，使其随时间的演变变得不那么简单，减少单个修订的理解，并且本质上使代码库的演变变得复杂。

在向代码库提交更改时要记住几种推荐的提交模式这是一张描述如何使用它的图片

Best Version Control Practices Every React Development Team Needs To Know

保持良好提交实践的技巧：

为了确保良好的提交实践，您应该执行以下操作：

1。规划：

编码前计划您的更改
将大任务分解为更小的逻辑提交
识别工作中的逻辑断点
考虑您的更改可能对其他人产生的影响

2。审核流程：

提交前检查您的更改
使用 git diff 验证您要提交的更改
检查是否有任何意外的更改
确保您的提交消息清晰且具有描述性

3。团队协调：

与您的团队沟通您的提交模式
建立提交实践的团队约定
有效地使用分支策略（例如功能分支、拉取请求）
在整个团队的代码库中保持一致的标准

#4/8：拉取请求的最佳实践

拉取请求是一种在协作环境中建议对代码库进行更改的方法。想象一下，“伙计们，检查我在复制源中的修改 - 如果我将它们贡献给存储库，您愿意吗？” Pull 请求是 GitHub、GitLab 和 Bitbucket 等平台的核心。

这是拉取请求过程的典型流程：

开发人员从主代码库创建一个分支
他们在该分支中进行更改
他们创建了一个拉取请求来建议将他们的更改合并回来
其他开发者审查代码、留下评论并提出改进建议
一旦获得批准，更改就会合并到主分支

创建有效拉取请求的核心原则

一个好的拉取请求应该：

# Start a new feature
git checkout develop
git pull origin develop
git checkout -b feature/payment-gateway

# Work on the feature
# Add Stripe integration code to payment.js
git add src/payment.js
git commit -m "Add Stripe payment integration"

# Add payment form
git add src/components/PaymentForm.jsx
git commit -m "Add payment form component"

# Add tests
git add tests/payment.test.js
git commit -m "Add payment integration tests"

# Ready to merge
git checkout develop
git pull origin develop
git merge feature/payment-gateway
git push origin develop

PR 标题和描述

标题格式

使用一致的格式：[类型]：简要描述
类型：壮举、修复、文档、样式、重构、测试、杂务
保持在 72 个字符以内
使用祈使语气（“添加功能”而不是“添加功能”）

示例：

# Create release branch
git checkout -b release/1.0.0 develop

# Update version
npm version 1.0.0
git add package.json
git commit -m "Bump version to 1.0.0"

# Fix last-minute issues
git add src/bugfix.js
git commit -m "Fix payment validation bug"

# Merge to main and develop
git checkout main
git merge release/1.0.0 --no-ff
git tag -a v1.0.0 -m "Version 1.0.0"
git push origin main --tags

git checkout develop
git merge release/1.0.0 --no-ff
git push origin develop

描述模板

# Create hotfix branch
git checkout -b hotfix/1.0.1 main

# Fix the critical bug
git add src/payment.js
git commit -m "Fix payment processing timeout"

# Update version
npm version patch
git add package.json
git commit -m "Bump version to 1.0.1"

# Merge to main and develop
git checkout main
git merge hotfix/1.0.1 --no-ff
git tag -a v1.0.1 -m "Version 1.0.1"
git push origin main --tags

git checkout develop
git merge hotfix/1.0.1 --no-ff
git push origin develop

拉取请求清单

# Start new feature
git checkout -b feature/shopping-cart

# Make changes and commit regularly
git add src/cart.js
git commit -m "Add shopping cart base structure"

git add src/components/CartItem.jsx
git commit -m "Add cart item component"

# Push to remote and create PR
git push origin feature/shopping-cart

# After PR review, merge via GitHub UI

对于尺寸，目标是 1000行，强烈考虑拆分代码。将所有相关的变更按顺序分组在一起，并且应该符合逻辑。将重构与功能更改分开，并保持提交历史记录干净且有意义。

回复反馈时，请确保解决所有评论并对建议保持开放态度。如果您需要反驳任何反馈，请清楚地解释您这样做的理由。进行重要讨论后，请务必更新 PR 描述以反映这些对话的主要成果。

Best Version Control Practices Every React Development Team Needs To Know

#5/8：合并过程的最佳实践

合并是将一个或两个源分支中所做并提交的更改集成到同一主干的过程。这一过程类似于将一份文档的一项工作与另一份文档的一项工作结合起来，并且涉及多个开发人员独立工作以将他们的工作集成到一个最终版本中。这项活动对于创建干净的源代码库至关重要，因此需要团队协作。

常见的场景是：

功能集成：

# Start a new feature
git checkout develop
git pull origin develop
git checkout -b feature/payment-gateway

# Work on the feature
# Add Stripe integration code to payment.js
git add src/payment.js
git commit -m "Add Stripe payment integration"

# Add payment form
git add src/components/PaymentForm.jsx
git commit -m "Add payment form component"

# Add tests
git add tests/payment.test.js
git commit -m "Add payment integration tests"

# Ready to merge
git checkout develop
git pull origin develop
git merge feature/payment-gateway
git push origin develop

错误修复集成：

# Create release branch
git checkout -b release/1.0.0 develop

# Update version
npm version 1.0.0
git add package.json
git commit -m "Bump version to 1.0.0"

# Fix last-minute issues
git add src/bugfix.js
git commit -m "Fix payment validation bug"

# Merge to main and develop
git checkout main
git merge release/1.0.0 --no-ff
git tag -a v1.0.0 -m "Version 1.0.0"
git push origin main --tags

git checkout develop
git merge release/1.0.0 --no-ff
git push origin develop

合并类型

1。直接合并：

直接合并集成不太复杂，并且将所有提交的历史记录保留到单个流中。虽然它使分支之间的集成变得容易，但也使分支相互关联的历史结构变得复杂。这种合并策略最适合较小的团队，因为它涉及到潜在的复杂历史，因为参与的成员较少。

# Create hotfix branch
git checkout -b hotfix/1.0.1 main

# Fix the critical bug
git add src/payment.js
git commit -m "Fix payment processing timeout"

# Update version
npm version patch
git add package.json
git commit -m "Bump version to 1.0.1"

# Merge to main and develop
git checkout main
git merge hotfix/1.0.1 --no-ff
git tag -a v1.0.1 -m "Version 1.0.1"
git push origin main --tags

git checkout develop
git merge hotfix/1.0.1 --no-ff
git push origin develop

合并前：

# Start new feature
git checkout -b feature/shopping-cart

# Make changes and commit regularly
git add src/cart.js
git commit -m "Add shopping cart base structure"

git add src/components/CartItem.jsx
git commit -m "Add cart item component"

# Push to remote and create PR
git push origin feature/shopping-cart

# After PR review, merge via GitHub UI

合并后：

# After PR is merged to main
git checkout main
git pull origin main

# Deploy
npm run deploy

# If issues found
git checkout -b fix/cart-total
git add src/cart.js
git commit -m "Fix cart total calculation"
git push origin fix/cart-total
# Create PR for the fix

带有提交消息的真实示例

# Create short-lived branch
git checkout -b feature/add-to-cart-button

# Work fast (1-2 days max)
git add src/components/AddToCart.jsx
git commit -m "Add to cart button component"

# Regular integration to main
git checkout main
git pull origin main
git merge feature/add-to-cart-button
git push origin main

2。挤压与合并：

这是另一种方法，拉取请求中的所有提交将在合并之前被压缩为单个提交。这样，提交历史记录就简单干净，并且历史记录更容易解释。 Squash 和 Merge 还提高了更改的可读性，因为每个功能都有一个提交，并且在必要时更容易恢复。此方法的唯一缺点是它使提交详细信息无法访问。

// Feature toggle implementation
const FEATURES = {
  NEW_CHECKOUT: process.env.ENABLE_NEW_CHECKOUT === 'true',
  DARK_MODE: process.env.ENABLE_DARK_MODE === 'true',
};

// Usage in code
if (FEATURES.NEW_CHECKOUT) {
  return <NewCheckoutProcess />;
} else {
  return <LegacyCheckout />;
}

壁球前：

feature/ticket-number-brief-description
feature/user-authentication
feature/JIRA-123-payment-gateway

压缩并合并后：

release/v1.0.0
release/2024.03

带有提交消息的真实示例：

hotfix/v1.0.1
hotfix/critical-security-fix

3。变基和合并：

此策略是在创建拉取请求后操纵工作环境中的更改流程的一种方法。这种形式的 Git 工作流程旨在在执行合并之前重新调整主分支上当前拉取请求的更改。这种方法使提交历史记录呈线性形式，因此存储库中的分支点是干净的。这将使变更的预测和提交历史的管理更加线性，因此更容易理解。
不过，这种方法只能由具有足够 Git 知识的人才能正确执行，因为 rebase 有时会很乏味，并且由于一些冲突可能需要专家的干预。

让我通过示例向您展示 Rebase 和 Merge 如何工作。

<type>: Short summary (50 chars or less)

Detailed explanation of the change
[Optional: Include motivation for the change and contrasts with previous behavior]

[Optional: Include any breaking changes]

[Optional: Include any related ticket numbers or references]

该过程的实际示例：
初始状态：

- Keep it under 50 characters (< 50 chars)
- Start with a category/type (feat, fix, docs, style, refactor, test, chore)
- Use imperative mood ("Add feature" not "Added feature")
- Don't end with a period
- Capitalize the first letter

变基后：

- A more detailed explanation of the changes. If necessary (wrap at 72 characters)
- Separate from subject with a blank line
- Explain what and why vs. how
- Include context and consequences
- Clear and concise
- Use bullet points for multiple points

合并后：

feat: Add user authentication system

- Implement JWT-based authentication
- Add login and registration endpoints
- Include password hashing with bcrypt
- Set up refresh token mechanism

This change provides secure user authentication for the API.
Breaking change: API now requires authentication headers.

Relates to: JIRA-123

带有提交消息的真实示例：

Fix bug in user login validation

Previously, the validation logic for user logins did not correctly
check the email format, leading to acceptance of invalid emails.

This commit updates the regex to match only valid email formats.

Fixes #123

合并注意事项

在进行合并过程之前，这是您应该准备好的清单

# Start a new feature
git checkout develop
git pull origin develop
git checkout -b feature/payment-gateway

# Work on the feature
# Add Stripe integration code to payment.js
git add src/payment.js
git commit -m "Add Stripe payment integration"

# Add payment form
git add src/components/PaymentForm.jsx
git commit -m "Add payment form component"

# Add tests
git add tests/payment.test.js
git commit -m "Add payment integration tests"

# Ready to merge
git checkout develop
git pull origin develop
git merge feature/payment-gateway
git push origin develop

#6/8：管理依赖关系和配置

在任何项目中，依赖项和配置文件都是重要因素，可以帮助保持项目干净、可扩展和稳定。下面我们将揭示处理这些方面的技巧。

配置文件的版本控制

配置文件对于定义应用程序在不同环境中的行为至关重要。正确地对这些文件进行版本控制可确保您的开发、测试和生产环境保持一致且可重现。

环境 (.env) 文件：

这些文件存储环境变量，它们定义跨环境（例如开发、测试、生产）不同的配置设置。通常的做法是在存储库中包含 .env.example 文件，列出所有必要的环境变量，但不包含实际值。这可以作为开发者创建自己的 .env 文件的模板。

# Create release branch
git checkout -b release/1.0.0 develop

# Update version
npm version 1.0.0
git add package.json
git commit -m "Bump version to 1.0.0"

# Fix last-minute issues
git add src/bugfix.js
git commit -m "Fix payment validation bug"

# Merge to main and develop
git checkout main
git merge release/1.0.0 --no-ff
git tag -a v1.0.0 -m "Version 1.0.0"
git push origin main --tags

git checkout develop
git merge release/1.0.0 --no-ff
git push origin develop

多环境的环境文件配置

.env.development

此文件在开发过程中使用，包含特定于您的开发环境的设置。通常用于

本地开发服务器配置
特定于开发的 API 端点
启用调试标志
开发数据库连接
模拟服务端点
详细日志记录设置

# Create hotfix branch
git checkout -b hotfix/1.0.1 main

# Fix the critical bug
git add src/payment.js
git commit -m "Fix payment processing timeout"

# Update version
npm version patch
git add package.json
git commit -m "Bump version to 1.0.1"

# Merge to main and develop
git checkout main
git merge hotfix/1.0.1 --no-ff
git tag -a v1.0.1 -m "Version 1.0.1"
git push origin main --tags

git checkout develop
git merge hotfix/1.0.1 --no-ff
git push origin develop

.env.生产

这包含真实用户与您的应用程序交互的实时/生产环境的设置。常用于

生产数据库凭证
实时 API 端点
性能优化设置
安全配置
生产级日志记录设置
真正的服务集成

# Start new feature
git checkout -b feature/shopping-cart

# Make changes and commit regularly
git add src/cart.js
git commit -m "Add shopping cart base structure"

git add src/components/CartItem.jsx
git commit -m "Add cart item component"

# Push to remote and create PR
git push origin feature/shopping-cart

# After PR review, merge via GitHub UI

.env.test

此文件在测试阶段使用，包括单元测试、集成测试和 CI/CD 管道，以测试数据库配置、模拟服务配置、测试特定的 API 端点、测试超时、覆盖率报告设置和 CI/CD 特定配置.

# After PR is merged to main
git checkout main
git pull origin main

# Deploy
npm run deploy

# If issues found
git checkout -b fix/cart-total
git add src/cart.js
git commit -m "Fix cart total calculation"
git push origin fix/cart-total
# Create PR for the fix

.env.local

包含本地计算机的个人覆盖（不致力于版本控制），不应与其他开发人员共享。这通常应用于个人开发首选项、本地计算机特定路径、自定义工具配置、个人 API 密钥并覆盖其他 .env 文件中的任何设置

# Create short-lived branch
git checkout -b feature/add-to-cart-button

# Work fast (1-2 days max)
git add src/components/AddToCart.jsx
git commit -m "Add to cart button component"

# Regular integration to main
git checkout main
git pull origin main
git merge feature/add-to-cart-button
git push origin main

环境文件主要区别和用法

1。优先顺序（通常）：

// Feature toggle implementation
const FEATURES = {
  NEW_CHECKOUT: process.env.ENABLE_NEW_CHECKOUT === 'true',
  DARK_MODE: process.env.ENABLE_DARK_MODE === 'true',
};

// Usage in code
if (FEATURES.NEW_CHECKOUT) {
  return <NewCheckoutProcess />;
} else {
  return <LegacyCheckout />;
}

2。版本控制实践：

feature/ticket-number-brief-description
feature/user-authentication
feature/JIRA-123-payment-gateway

3。目录结构示例：

# Start a new feature
git checkout develop
git pull origin develop
git checkout -b feature/payment-gateway

# Work on the feature
# Add Stripe integration code to payment.js
git add src/payment.js
git commit -m "Add Stripe payment integration"

# Add payment form
git add src/components/PaymentForm.jsx
git commit -m "Add payment form component"

# Add tests
git add tests/payment.test.js
git commit -m "Add payment integration tests"

# Ready to merge
git checkout develop
git pull origin develop
git merge feature/payment-gateway
git push origin develop

使用 .env 文件的最佳实践

1。安全性： 切勿将敏感凭据提交给版本控制。为每个环境使用不同的凭据。实行秘密轮换政策。记录所需的环境变量。

# Create release branch
git checkout -b release/1.0.0 develop

# Update version
npm version 1.0.0
git add package.json
git commit -m "Bump version to 1.0.0"

# Fix last-minute issues
git add src/bugfix.js
git commit -m "Fix payment validation bug"

# Merge to main and develop
git checkout main
git merge release/1.0.0 --no-ff
git tag -a v1.0.0 -m "Version 1.0.0"
git push origin main --tags

git checkout develop
git merge release/1.0.0 --no-ff
git push origin develop

2。文档： 维护一个 .env.example 文件，其中包含虚拟值，包括解释每个变量用途的注释。记录任何默认值或备用值。

# Create hotfix branch
git checkout -b hotfix/1.0.1 main

# Fix the critical bug
git add src/payment.js
git commit -m "Fix payment processing timeout"

# Update version
npm version patch
git add package.json
git commit -m "Bump version to 1.0.1"

# Merge to main and develop
git checkout main
git merge hotfix/1.0.1 --no-ff
git tag -a v1.0.1 -m "Version 1.0.1"
git push origin main --tags

git checkout develop
git merge hotfix/1.0.1 --no-ff
git push origin develop

3。验证：

# Start new feature
git checkout -b feature/shopping-cart

# Make changes and commit regularly
git add src/cart.js
git commit -m "Add shopping cart base structure"

git add src/components/CartItem.jsx
git commit -m "Add cart item component"

# Push to remote and create PR
git push origin feature/shopping-cart

# After PR review, merge via GitHub UI

4。加载策略：

# After PR is merged to main
git checkout main
git pull origin main

# Deploy
npm run deploy

# If issues found
git checkout -b fix/cart-total
git add src/cart.js
git commit -m "Fix cart total calculation"
git push origin fix/cart-total
# Create PR for the fix

这种环境配置的分离有助于防止开发人员搞砸大部分开发环境，同时还为更改特定环境参数和编程环境的个人偏好提供必要的途径。

.gitignore:

这是另一种版本控制配置文件，它指定 Git 应忽略哪些文件和目录。通常被忽略的文件包括 node_modules、构建目录和特定于环境的文件 (.env)。通过将它们排除在版本控制之外，您可以减少存储库中的混乱并防止意外提交敏感信息。

示例 .gitignore：

# Create short-lived branch
git checkout -b feature/add-to-cart-button

# Work fast (1-2 days max)
git add src/components/AddToCart.jsx
git commit -m "Add to cart button component"

# Regular integration to main
git checkout main
git pull origin main
git merge feature/add-to-cart-button
git push origin main

关键考虑因素

在处理项目的 .gitignore 文件时必须考虑几件事。首先，.gitignore 文件中的列表应包含项目的特定忽略，包括 .pyc 和 .class 等语言模式、框架目录和构建工件。这样，只有真正应该受到版本控制的文件才会受到版本控制。

除了特定于项目的忽略之外，还存在需要解决的全局忽略。这些是用户特定的设置，应放置在 ~/.gitignore_global 文件中。一些常见的是 IDE 配置文件和操作系统创建的文件，当它们包含到系统中时，它们可能会扰乱版本控制历史记录。

管理和更新 .gitignore 文件是一项持续的任务。但是，建议开发人员定期修改该文件，以确保它仍然满足项目的需求。强烈建议将任何想要忽略的奇怪或特殊的内容也记录在 .gitignore 上，因为这样团队的任何其他成员都将能够理解为什么这些特定的忽略被认为是必要的。最后但并非最不重要的一点是，如果您希望版本控制系统跟踪空目录，那么您可以使用 .gitkeep 文件来达到目的。

处理依赖关系

依赖项是您的项目依赖的外部库和模块。正确管理这些依赖关系对于维护稳定和安全的应用程序至关重要。

包.json：

此文件列出了您的项目所需的所有依赖项。它包括有关您的项目的元数据，例如名称、版本和脚本。定期更新此文件以反映项目依赖项的当前状态。

package.json 文件的典型示例，演示了典型 JavaScript/Node.js 项目的结构良好且符合最佳实践的配置。

# Start a new feature
git checkout develop
git pull origin develop
git checkout -b feature/payment-gateway

# Work on the feature
# Add Stripe integration code to payment.js
git add src/payment.js
git commit -m "Add Stripe payment integration"

# Add payment form
git add src/components/PaymentForm.jsx
git commit -m "Add payment form component"

# Add tests
git add tests/payment.test.js
git commit -m "Add payment integration tests"

# Ready to merge
git checkout develop
git pull origin develop
git merge feature/payment-gateway
git push origin develop

示例 package.json 文件的结构包括以下关键部分：

名称和版本：定义项目的名称和当前版本。
依赖项：列出项目所需的生产依赖项及其版本限制。
devDependencies：列出测试、linting 等任务所需的开发依赖项
peerDependencies：声明项目所需的依赖项，但预计由使用应用程序提供。
脚本：定义可以执行的各种命令行脚本，例如启动服务器、运行测试或检查代码库。

管理 package.json 文件的最佳实践包括：

版本规范
- 对关键依赖项使用精确版本（“express”：“4.17.1”）以确保稳定性
- 使用脱字符号范围（“^4.17.1”）灵活更新次要版本和补丁版本
- 仅使用波形符范围（“~4.17.1”）进行补丁级别更新
脚本组织
- 将相关脚本分组在一起以便更好地组织。
- 对脚本命令使用一致的命名约定。
- 记录任何复杂或不明显的脚本。

纱线.锁/包锁.json：

通常这些文件会锁定您的项目使用的依赖项的版本。它确保在不同的环境中安装相同的版本，而不是出现“它可以在我的计算机上运行”的问题。这些锁文件也应该被提交，以便系统中有版本控制。

这些文件的目的是实现一致的安装，锁定精确的版本号和依赖项，并消除“它可以在我的计算机上运行”之类的问题。更新这些锁定文件需要将锁定文件签入版本控制系统，检查更新期间的更改并适当处理冲突。

保持依赖关系最新的最佳实践

1。定期更新： 定期更新您的依赖项，以从最新功能、改进和安全补丁中受益。使用npm outdated 或yarn outdated 等命令来检查更新。

2。语义版本控制：更新依赖项时要注意语义版本控制（semver）。 Semver 使用 MAJOR.MINOR.PATCH 格式的版本控制方案。更新：

用于向后兼容错误修复的补丁版本（x.x.1 至 x.x.2）。
次要版本（x.1.x 到 x.2.x），用于向后兼容新功能。
主要版本（1.x.x 到 2.x.x）可能会破坏兼容性的更改。

3。自动化工具： 使用 Dependabot（适用于 GitHub）或 Renovate 等自动化工具自动检查依赖项更新并创建拉取请求。这些工具有助于使您的依赖项保持最新状态，而无需手动干预。

4。测试： 在更新依赖项之前，请确保您有一个强大的测试套件来验证更新不会引入回归。更新后运行所有测试以确认一切按预期工作。

5。对等依赖关系： 请注意某些包指定的对等依赖关系。确保它们与您的项目中使用的版本兼容。

通过遵循这些实践，您将维护一个健康、一致且安全的 React 项目，确保所有团队成员和环境都在同一页面上。

#7/8：持续集成和部署（CI/CD）

将 CI/CD 与版本控制系统集成可以实现构建、测试和部署过程的无缝自动化。每当代码被推送到版本控制存储库时，CI/CD 管道就会自动触发，执行预定义的步骤来验证和部署更改。例如，当开发人员将新提交推送到 GitHub 存储库的主分支时，就会触发 GitHub Actions 工作流程。此工作流程自动编译代码，运行单元和集成测试，并将应用程序部署到暂存环境以进行进一步测试。

将 CI/CD 与版本控制集成的关键步骤：

自动构建：每次代码推送都会触发自动构建过程，确保代码库始终处于可构建状态。
自动化测试：每次推送时都会自动运行测试，以尽早发现错误。
持续部署： 通过所有测试和检查的更改将自动部署到生产或临时环境。

流行的 CI/CD 工具概述

多种 CI/CD 工具被广泛用于实施这些实践，每种工具都有自己的优势：

Jenkins： 一个开源自动化服务器，支持构建、部署和自动化任何项目。 Jenkins 拥有庞大的插件生态系统，使其高度可定制。
- 优点：丰富的插件库、高度可定制、强大的社区支持。
- 缺点：配置和维护可能很复杂，需要专用的服务器资源。
GitHub Actions：直接集成到 GitHub 中，它允许开发人员根据 GitHub 事件（例如推送、拉取请求）自动化工作流程。
- 优点：与 GitHub 无缝集成、易于设置、广泛的操作市场。
- 缺点：仅限于 GitHub 存储库，定价可能成为大型团队或复杂工作流程的问题。
Travis CI：基于云的 CI 服务，与 GitHub 项目集成良好。它以其简单易用而闻名。
- 优点：配置简单，易于与 GitHub 集成，免费用于开源项目。
- 缺点：对非 GitHub 存储库的支持有限，大型项目可能会很慢。
CircleCI： 一个支持构建、测试和部署应用程序的 CI/CD 工具。它提供强大的配置和性能优化。
- 优点：高性能，原生支持Docker，扩展性极佳。
- 缺点：配置可能很复杂，高级功能可能很昂贵。
GitLab CI/CD：直接集成到 GitLab，提供完整的 DevOps 生命周期管理工具。
- 优点：完整的 DevOps 生命周期支持，与 GitLab 集成，强大的安全功能。
- 缺点：最初设置可能很复杂，高级功能可能会很昂贵。

设置自动化工作流程

配置 CI/CD 管道涉及定义构建、测试和部署应用程序的步骤顺序。这通常是通过与应用程序代码一起存在的配置文件（例如 jenkins-pipeline.groovy、.travis.yml、.github/workflows/main.yml）来完成。

以下是 GitHub Actions 工作流程的示例，该工作流程在每次推送到主分支时运行自动化测试：

# Start a new feature
git checkout develop
git pull origin develop
git checkout -b feature/payment-gateway

# Work on the feature
# Add Stripe integration code to payment.js
git add src/payment.js
git commit -m "Add Stripe payment integration"

# Add payment form
git add src/components/PaymentForm.jsx
git commit -m "Add payment form component"

# Add tests
git add tests/payment.test.js
git commit -m "Add payment integration tests"

# Ready to merge
git checkout develop
git pull origin develop
git merge feature/payment-gateway
git push origin develop

GitHub Actions 工作流程成功运行测试套件后，它可以将应用程序部署到 AWS 或 Azure 等云托管平台。这是通过向工作流添加额外的步骤来完成的，这些步骤用于向云提供商进行身份验证并执行部署命令。

CI/CD 管道的最佳实践

1。保持管道高效且有效： 确保您的 CI/CD 管道针对速度和可靠性进行优化。

缓存依赖项：使用缓存机制通过重用依赖项来加速构建和测试过程。
优化构建步骤：将构建过程分解为更小的、可管理的步骤，以降低复杂性并改进故障排除。
并行化工作流程：并行运行独立任务以减少总体管道执行时间。

2。监控和维护管道：定期监控您的 CI/CD 管道是否存在性能瓶颈并对其进行维护，以确保它们顺利运行。

日志和监控：实施日志记录和监控工具来跟踪管道的性能和运行状况。
定期审核： 对您的管道进行定期审核，以发现并修复效率低下的问题。

3。安全最佳实践： 将安全检查集成到 CI/CD 管道中，以确保代码在投入生产之前是安全的。

静态分析：使用静态代码分析工具在开发过程的早期检测安全漏洞和代码质量问题。
秘密管理：安全地管理 API 密钥和凭证等敏感信息，确保它们不会在代码库或日志中暴露。

4。协作工作流程： 通过让团队成员参与 CI/CD 流程来培养协作文化。

代码审查： 确保所有代码更改在合并到主分支之前都经过同行审查。
反馈循环：创建一个反馈循环，开发人员可以从 CI/CD 管道收到即时反馈，并可以立即采取行动。

通过遵循这些实践，您可以创建强大且可靠的 CI/CD 管道，从而简化软件交付流程。

#8/8：处理冲突和回滚

当项目的多个更改交叉时，就会发生合并冲突，从而导致不一致。由于多个开发人员修改同一行代码或更改重命名或删除的文件或来自不同的分支历史记录，可能会导致冲突。然而，需要顺利处理这些冲突，以维护代码库的完整性。

冲突标记：

# Start a new feature
git checkout develop
git pull origin develop
git checkout -b feature/payment-gateway

# Work on the feature
# Add Stripe integration code to payment.js
git add src/payment.js
git commit -m "Add Stripe payment integration"

# Add payment form
git add src/components/PaymentForm.jsx
git commit -m "Add payment form component"

# Add tests
git add tests/payment.test.js
git commit -m "Add payment integration tests"

# Ready to merge
git checkout develop
git pull origin develop
git merge feature/payment-gateway
git push origin develop

避免和解决冲突的最佳实践

1。经常沟通：团队内开放的沟通渠道可以防止工作重叠而导致冲突。
2.定期拉取： 定期从主分支拉取更改，以保持分支更新并最大程度地减少差异。
3.小提交： 更小、更频繁的提交可以更轻松地识别冲突发生的位置。
4.自动化测试：经常运行自动化测试以尽早发现问题。
5.明智地使用分支： 将工作分离到功能分支中，避免直接在主分支上工作。
6.选择正确的策略： 对公共分支使用还原，对本地更改使用重置。

解决冲突的分步行动

1。识别冲突：

# Create release branch
git checkout -b release/1.0.0 develop

# Update version
npm version 1.0.0
git add package.json
git commit -m "Bump version to 1.0.0"

# Fix last-minute issues
git add src/bugfix.js
git commit -m "Fix payment validation bug"

# Merge to main and develop
git checkout main
git merge release/1.0.0 --no-ff
git tag -a v1.0.0 -m "Version 1.0.0"
git push origin main --tags

git checkout develop
git merge release/1.0.0 --no-ff
git push origin develop

2。选择解决策略： 在选择解决策略时，您应该确保接受传入的更改并记录当前的更改。结合这两个更改并为其创建一个新的解决方案。

3。手动分辨率：

# Create hotfix branch
git checkout -b hotfix/1.0.1 main

# Fix the critical bug
git add src/payment.js
git commit -m "Fix payment processing timeout"

# Update version
npm version patch
git add package.json
git commit -m "Bump version to 1.0.1"

# Merge to main and develop
git checkout main
git merge hotfix/1.0.1 --no-ff
git tag -a v1.0.1 -m "Version 1.0.1"
git push origin main --tags

git checkout develop
git merge hotfix/1.0.1 --no-ff
git push origin develop

回滚策略

有时，尽管我们尽了最大努力，事情还是会出错。了解如何安全地回滚更改是保持项目稳定有序的因素之一。

必要时安全回滚更改的技术

1。恢复提交： 使用版本控制工具恢复到之前的提交。此方法不会干扰其他开发人员，并允许您在保留历史记录的同时撤消更改。

# Start new feature
git checkout -b feature/shopping-cart

# Make changes and commit regularly
git add src/cart.js
git commit -m "Add shopping cart base structure"

git add src/components/CartItem.jsx
git commit -m "Add cart item component"

# Push to remote and create PR
git push origin feature/shopping-cart

# After PR review, merge via GitHub UI

2。重置操作： 如果分支明显分叉，将其重置为已知的良好状态可能会很有效。在共享分支上谨慎使用。

# After PR is merged to main
git checkout main
git pull origin main

# Deploy
npm run deploy

# If issues found
git checkout -b fix/cart-total
git add src/cart.js
git commit -m "Fix cart total calculation"
git push origin fix/cart-total
# Create PR for the fix

3。备份： 在进行重大更改之前始终维护备份，以确保您有恢复点。这用作紧急回滚调用的立即操作

# Create short-lived branch
git checkout -b feature/add-to-cart-button

# Work fast (1-2 days max)
git add src/components/AddToCart.jsx
git commit -m "Add to cart button component"

# Regular integration to main
git checkout main
git pull origin main
git merge feature/add-to-cart-button
git push origin main

4。使用 reflog 进行恢复：

// Feature toggle implementation
const FEATURES = {
  NEW_CHECKOUT: process.env.ENABLE_NEW_CHECKOUT === 'true',
  DARK_MODE: process.env.ENABLE_DARK_MODE === 'true',
};

// Usage in code
if (FEATURES.NEW_CHECKOUT) {
  return <NewCheckoutProcess />;
} else {
  return <LegacyCheckout />;
}

5。标记发布：标记稳定版本，以便您可以轻松回滚到已知的工作状态。
6.功能切换： 实现功能切换以禁用有问题的功能，而无需完全回滚。

通过遵循这些实践并了解可用的工具，团队可以有效地管理冲突并在必要时处理回滚。请记住，预防总是胜于治疗，但是可靠的回滚程序可以在问题发生时提供安全网。

结论

在 React 团队中使用版本控制最佳实践对于保持事物顺利运行和良好协作非常重要。然而，为了确保您在编码领域不会遇到任何问题，需要选择正确的版本控制系统并设置良好的分支方法、清晰的提交消息和强大的 CI/CD 系统是关键。每个部分都有助于确保您的代码库的稳定性和质量。

我们了解了使用 Git、使用 Git Flow、GitHub Flow 和基于主干的开发配置工作流程的重要性，以及管理依赖项和配置文件的最佳方法。我们还讨论了如何处理冲突和回滚、代码审查和拉取请求的价值，以及完整文档和良好沟通的必要性。

通过遵循这些最佳实践，React 团队可以更好地合作来提高代码质量，并使开发过程更加顺利，从而带来更成功的项目结果。无论您的开发人员级别如何、经验丰富还是刚刚开始使用 React，这些技巧都将帮助您管理版本控制并创建更加统一和有效的开发设置。

继续编码！？

Best Version Control Practices Every React Development Team Needs To Know

以上是每个 React 开发团队都需要了解的最佳版本控制实践的详细内容。更多信息请关注PHP中文网其他相关文章！

声明：

本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系admin@php.cn

上一篇：How to Retrieve Event Bindings to a Specific Element with jQuery?下一篇：How to Manage Global Variables in Webpack?

查看更多