Web开发中的Git:理解项目的典型工作流程

自学咖网努力为各位打造免费分享知识与教程网站

网络开发和协作有着内在的联系。大多数时候,你会和其他开发人员一起工作。即使你没有,Git也可以在很多其他方面帮助你。

Git是控制我们制作的应用程序版本的软件。它被个人开发者、大公司甚至世界上最大的开源项目Linux所使用。

作为一名web开发人员,知道如何正确使用Git进行web开发是极其重要的。我们不仅仅是在谈论“git添加”、“git提交”和“git推送”。你应该知道用Git创建一个web项目的整个工作流程。

为什么要用Git?

网站开发的基本Git工作流程

如何在Kinsta中使用Git

为什么要用Git?

这些只是开始使用Git的一些原因:

组织:与其用v1,v2,v3等文件夹来管理项目,不如用一个专门的数据库来存储所有版本的文件。

协作:Git允许你和其他人同时在同一个项目上工作而不会发生冲突。

开源:Git是开源的,但它也是我们用来协作和创建伟大的开源软件的工具。任何人都可以向GitHub或Bitbucket等平台上的开源项目发出pull请求。

平台灵活性:现在,你有许多不同的Git托管服务可供选择,如Gitlab、GitHub、Bitbucket和SourceForge。您甚至可以为所有项目使用自托管解决方案。

轻松备份:轻松撤销错误,永远不会丢失您的项目代码库。

GitHub这个词我们提过一两次,那么Git和GitHub有什么区别呢?

如果你对Git完全陌生,你可能会感到困惑。简单来说,Git和GitHub是相关但不同的工具。

Git是我们用来控制文件变更的版本控制系统(VCS ),而GitHub是我们用来在线存储项目文件及其Git历史的服务(位于。git/项目的文件夹)。

Git安装在本地和您的机器上。如果没有像GitHub或GitLab这样的托管服务,很难与其他开发者合作。

GitHub通过添加其他功能来提高协作,如克隆、分叉和合并,从而为Git充电。这两个工具的结合给你带来了一个相对友好的生态系统来开发、管理和向他人展示你的项目。

专注于开发,而不是托管。为我们的管理应用程序主持轮换。

大型IaaS供应商倾向于将事情复杂化。跳过过时的仪表盘、臃肿的产品线和令人困惑的内置功能,你就不会用了。在几分钟内部署您的代码。此外,第一个月还可以享受20美元的优惠。

网页开发的基本Git工作流程

在接下来的章节中,你将通过实践学习更多关于web开发的Git工作流。

安装要求

如果你还没有安装Git,现在是个好时机。它易于安装,可以在大多数操作系统上使用。

从官方下载页面下载。如果您使用的是Linux或macOS,您可以使用软件包管理器来安装它:

自学咖网努力为各位打造免费分享知识与教程网站

Git下载页面

要测试安装是否流畅,可以在Linux或macOS上的应用菜单中搜索“终端”来启动终端,或者在Windows上打开Git bash(默认安装Git)。

然后输入:

git –version

自学咖网努力为各位打造免费分享知识与教程网站

Git版本

如果得到Git版本的响应,就可以开始了。

我们还需要一个GitHub帐户,所以请务必注册或登录GitHub:

自学咖网努力为各位打造免费分享知识与教程网站

GitHub注册页面

一旦您安装了Git并登录到您的GitHub帐户,您就可以进入下一部分了。

协作项目的基本Git工作流

如前所述,大多数时候你不会独自开发项目。协作是一项关键技能,Git和GitHub可以帮助我们将其转化为简单有效的过程。

Git项目的典型工作流程如下:

通过克隆版本库或repo获得项目的本地副本。如果要合作,先分支这个回购。

用你想做的函数的代表名创建一个分支。

编辑项目。

在本地机器上提交更改。

将内容推送到远程版本库。

创建对原始版本的拉请求。

并在原回购的主分支机构中合并和解决冲突。

学习课程

现在是我们动手的时候了!

在本指南中,您将创建一个简单的HTML网站。出于实用目的,您将HTML网站仓库的基本项目分支到您的GitHub帐户。所有公开可用的软件库都可以做到这一点。

信息

分支是版本库的独立副本,您可以在不影响原始项目的情况下管理和修改它。另一方面,克隆仓库只是创建了一个文件的本地副本。

要分支这个HTML网站,请转到这个GitHub仓库,并单击位于页面右上角的Fork按钮:

自学咖网努力为各位打造免费分享知识与教程网站

GitHub分支

现在你有了一个Fork的原始版本,只在你的GitHub账号上有。在你开始提交变更之前,是完全一样的回购。

如你所见,只需要几秒钟就可以分叉一个公共回购。这对于开源项目来说非常好,但是请记住,如果您的组织有私人回购,您需要在尝试分叉之前作为贡献者加入。

现在是时候把你的叉子拿到你的本地机器上了。为此,您需要使用Git clone命令克隆它,该命令可以从远程服务器获取Git存储库:

git clone remote_url

您需要用分叉的url替换remote_url。要获得GitHub repo的确切网址,请进入其页面并点击代码。然后选择SSH,复制它给你的链接:

自学咖网努力为各位打造免费分享知识与教程网站

SSH URL。

克隆要运行的分支存储库的命令是:

git clone [email protected]:yourusername/HTML-site.git

当您克隆一个repo时,您将获得一个以其名称命名的文件夹。这个文件夹包含项目的源代码(这里指的是HTML网站)和Git repo,Git repo位于一个名为。饭桶。

您可以查看新目录中的文件列表,方法是在图形文件管理器中打开新文件夹,或者在终端中使用ls或dir命令直接列出这些文件:

# Linux/macOSls HTML-site/# Windowsdir HTML-site.git images .gitignore index.html LICENSE README.md styles.css

这个HTML网站非常简单。它使用了Bootstrap的实用功能和一些来自Unsplash的图片,你可以在那里为你的网站下载免费图片。

如果你在浏览器中打开index.html文件,你会看到一个简单的带有一些图片的页面:

自学咖网努力为各位打造免费分享知识与教程网站

我们正在创建一个简单的网页。

是时候玩这个项目了。感觉很空洞,也许一个带有网站名称的标题可以提升用户体验。

为此,进入HTML-site目录并创建一个名为header的分支。在这个新的分支中,我们可以编辑所有文件并实现尽可能多的代码,因为这不会影响主(原始)分支。

运行以下命令:

git checkout -b header

这将创建一个名为“header”的分支,并在这之后切换到它。这相当于:

git branch headergit checkout header

为了确保一切顺利,运行:

git status# On branch header# nothing to commit, working tree clean

您将会看到您已经从“主”分支转移到了“头”分支,但是工作树仍然是干净的,因为我们没有编辑任何文件。

在您喜欢的代码编辑器中,打开分支项目中的index.html文件。该文件包含一些到Bootstrap 5的链接,因此我们可以利用该框架的现成组件。

将以下代码添加到index.html文件的标签内和图片容器的上方:

HTML site

自学咖网努力为各位打造免费分享知识与教程网站

我们的网页上有一个新的标题。

看起来好多了!您可以自由地进行其他分支和修改。

完成项目编辑后,您应该将所有更改提交到您的本地版本。在项目目录中,在终端中键入以下内容:

git add –allgit commit -m “Added simple header in index.html file”

重要的

所有Git提交信息必须清晰且有意义。每当您添加一个提交时,您和您的团队成员应该能够识别该提交中发生了什么,这样,如果出现问题,您就可以轻松地修复它。

当你刚开始一个项目时,提交描述性信息是很常见的,但随着时间的推移和重点的转移,信息的质量往往会下降。请确保保持良好的命名习惯。

既然已经将文件提交到了本地版本库(现在只能在自己的电脑上使用),就该把它推送到远程版本库了。

如果你像往常一样尝试推送提交,那是不行的,因为你现在做的是头级分支。您需要为表头设置上游分支:

git push –set-upstream origin header

2021年8月13日起,GitHub要求SSH认证,请确保您的密钥设置正确。

在这之后,您应该能够在您的分叉仓库中看到一个名为header的新分支(例如:https://github . com/your username/HTML-site/branches):

自学咖网努力为各位打造免费分享知识与教程网站

标题分支。

要创建原始版本的拉取请求,请单击“活动分支”部分中的“比较”。

这将把您带到一个pull请求,您需要选择您想要与哪个分支(原始分支或您的fork)合并。默认情况下,它显示与基本仓库合并的选项:

自学咖网努力为各位打造免费分享知识与教程网站

在GitHub上创建一个拉请求

一旦你点击了拉请求选项,你需要写一个简短的描述,就像你之前提交的那样。还是那句话,尽量简洁,但要描述清楚:

自学咖网努力为各位打造免费分享知识与教程网站

写入拉取请求信息。

单击“创建拉式请求”按钮,等待基本仓库的所有者接受或反馈您的更改。

祝贺您——您已经完成了web开发中常见的Git工作流的所有步骤。

这是一个非常基本的例子,但是它的逻辑可以扩展到所有规模的项目。请确保您能在更大的合作项目中严格执行此工作流程。

如何在Kinsta中使用Git

如果你是Kinsta的用户,你已经有两种方法可以在MyKinsta portal中使用Git和GitHub。

我们来看看第一种方法。你可以很容易地通过SSH进入,并从任何Git托管服务(如GitHub、Gitlab或Bitbucket)提取一个Repo。

为此,转到Sites选项卡,选择一个网站,然后转到SSH details部分,复制SSH terminal命令。

自学咖网努力为各位打造免费分享知识与教程网站

SSH详细信息

通过SSH登录您的网站,将上述命令粘贴到您的终端中,然后进入您的网站的公共文件夹(位于/www/yoursitename/)。这里是你所有WordPress文件的位置,所以你可以下载一个Git repo,里面有你一直在做的自定义主题或者插件。

下面是如何使用一个简单的命令来下载Git repo:

ssh [email protected] -p PORT “cd /www/my_site/public && git pull https://github.com/user/repo.git”

重要的

SSH应该由高级用户使用。如果操作不熟练,不要犹豫,先联系Kinsta支持。

现在,通过引入Kinsta新的GitHub部署功能,你可以从GitHub仓库部署一个完整的WordPress网站。

你的GitHub库应该包括WordPress核心文件的拷贝,当然还有wp-content文件夹下你网站的内容。

让我们快速看一下这个选项。

转到您公司的网站,创建一个临时存储环境。不会超过两分钟。

自学咖网努力为各位打造免费分享知识与教程网站

临时环境

进入临时站点后,转到Deployment选项卡,然后单击Begin setup按钮。你会看到一个GitHub模板,允许Kinsta连接你的GitHub账户。

自学咖网努力为各位打造免费分享知识与教程网站

GitHub部署标签

现在,选择回购你想拉你的网站。

自学咖网努力为各位打造免费分享知识与教程网站

将Kinsta连接到GitHub。

最后,部署您的网站,并通过您的临时网站URL访问它。

自学咖网努力为各位打造免费分享知识与教程网站

立即部署按钮。

这项功能仍处于测试阶段,但很快每个Kinsta用户都将有机会使用它。

如果你知道如何很好地使用Git和Kinsta,那么它们将是一个强大的组合。

总结

现在的Git是web开发中必学的工具,因为大部分时候你会和别人合作,创造出最好的项目。

在本文中,我们讨论了在项目中使用Git的一些重要原因,并向您展示了Git repo中协作的基本工作流程。

hmoban主题是根据ripro二开的主题,极致后台体验,无插件,集成会员系统
自学咖网 » Web开发中的Git:理解项目的典型工作流程