github 和git

by Iago Rodrigues

通过Iago Rodrigues

学习编码时如何学习Git和GitHub (How you can learn Git and GitHub while you’re learning to code)

In this article, I’ll give you some hints about how to become a Git/GitHub ninja. Also, as a bonus, I’ll show you how to use the Terminal (shell) while coding. So if you are a beginner, this post should help you understand this tech. And if you already are a ninja, have a look through to help you remember things that you might have forgotten.

在本文中，我将向您提供一些有关如何成为Git / GitHub忍者的提示。另外，作为奖励，我将向您展示如何使用终端机 (外壳) 在编码时。因此，如果您是初学者，这篇文章应该可以帮助您了解这项技术。并且，如果您已经是忍者，那么请仔细阅读以帮助您记住可能已经忘记的事情。

简要介绍 (A brief intro)

Git and GitHub are extremely important tools to our routine as a software developers. But, how can we learn them as we have so much on our plates when we are learning code?

对于我们作为软件开发人员的例行程序，Git和GitHub是极其重要的工具。但是，当我们学习代码时，如何在板子上花很多时间来学习它们呢？

I’m Iago Rodrigues, a Brazilian. I’m a Systems Information student, a software developer intern, and a freelancer. I’m at the beginning of my career, and I wanted to share some knowledge that I’ve acquired with you. So, get your coffee and let’s hack!

我是巴西人Iago Rodrigues。我是一名系统信息专业的学生，一名软件开发实习生，以及一名自由职业者。我正处于职业生涯的开始，我想与您分享一些我所获得的知识。所以，喝杯咖啡，让我们开始吧！

If you are a Portuguese reader, please go here.

如果您是葡萄牙语读者，请转到此处。

You can use this plan to study any programming language like JavaScript, Python, Node, and also HTML and CSS. It doesn’t matter what tech you are learning — versioning your work with Git is the default way to program.

您可以使用该计划来研究任何编程语言，例如JavaScript，Python，Node以及HTML和CSS。所学的技术无关紧要-使用Git对工作进行版本控制是默认的编程方式。

准备环境 (Preparing the environment)

Before we start, we need to set up the environment to save our code and examples of what we are learning.

在开始之前，我们需要设置环境以保存我们的代码和所学内容的示例。

To do this, we must complete some requirements:

为此，我们必须完成一些要求：

install Git on our machine
在我们的机器上安装Git
create a GitHub account
创建一个GitHub帐户
create a workspace on our machine
在我们的机器上创建一个工作区

If you’ve already done this, you can go straight to the GitHub’s workflow and the Terminal section.

如果您已经完成此操作，则可以直接转到GitHub的工作流程和“终端”部分。

在机器上安装Git (Installing Git on your machine)

Git installation is different on each operation system. Check out Git’s official site to see which way is right for you.

每个操作系统上的Git安装都不相同。查看Git的官方网站，看看哪种方法最适合您。

But if you are using Windows (and speak Portuguese), I recommend this article.

但是，如果您使用的是Windows(并且会说葡萄牙语)，则推荐这篇文章。

Once Git is installed, we need to create a GitHub account and configure it on our machine.

安装Git后，我们需要创建一个GitHub帐户并在我们的机器上对其进行配置。

在GitHub上创建帐户 (Creating an account on GitHub)

To create an account, go to the GitHub web site and fill out the main form.

要创建一个帐户，请访问GitHub网站并填写主表单。

I recommend that you choose a real and nice user name here so you can use the account on résumés or your LinkedIn account.

我建议您在此处选择一个真实而美观的用户名，以便您可以在简历上使用该帐户或您的LinkedIn帐户。

You need to inform GitHub which plan you want to use. Choose the free option. The only difference is that you can setup private repositories with the paid plan.

您需要通知GitHub您要使用的计划。选择免费选项。唯一的区别是您可以使用付费计划设置私有存储库。

GitHub will ask a few things before finishing your account setup. You can answer them now, or just jump to the next screen.

GitHub将在完成帐户设置之前询问一些问题。您可以立即回答，也可以跳到下一个屏幕。

With everything completed, we can start our project.

一切完成后，我们就可以开始我们的项目了。

Before we create our repository, though, let’s setup our GitHub email and user name in our machine.

不过，在创建存储库之前，让我们在计算机中设置GitHub电子邮件和用户名。

使用GitHub数据设置系统 (Setting up our system with our GitHub data)

Open up your Terminal. In Windows, you have to open the start menu and type cmd. Then click enter.

打开您的终端。在Windows中，您必须打开开始菜单并键入cmd。 然后单击回车。

Or, you can install cmder (which is a good option) to use it instead of cmd, which is the default Windows Terminal.

或者，您可以安装cmder (一个不错的选择)来代替cmd (默认的Windows终端)使用它。

With that, we have to execute the following shell command in the cmder:

这样，我们必须在cmder中执行以下shell命令：

git config --global user.name "our_GitHub_user_name"

Now put in your GitHub email address:

现在输入您的GitHub电子邮件地址：

git config --global user.email "our_GitHub_user_email"

设置您的GitHub访问密钥 (Setting up your GitHub access key)

Whenever you access a repository via shell, you need to have access permission. This is granted when you sign into your GitHub account. But, every time you send something to your repository (repo), you must pass your credentials.

每当您通过外壳访问存储库时，都需要具有访问权限。当您登录GitHub帐户时，将授予此权限。但是，每次向存储库(仓库)发送内容时，都必须传递凭据。

To avoid this, use an SSH key. This is an access key which GitHub exchanges with the one configured on our machine.

为避免这种情况，请使用SSH密钥。这是GitHub与我们机器上配置的密钥交换的访问密钥。

To create this key, follow the process outlined in the GitHub documentation.

要创建此密钥，请遵循GitHub 文档中概述的过程。

With all everything all configured, you are good to go!

所有的一切都配置好了，您一切顺利！

GitHub的工作流程和终端 (GitHub’s workflow and the Terminal)

Let’s set up a rule here:

让我们在这里设置一个规则：

Every time you create a project to study something, such as making an HTML page or a command line game with Node.js or anything, you’ll create a repository, clone it in your machine, work on it using branches, and make small commits to send to GitHub.

每次您创建一个项目来研究某些东西(例如使用Node.js制作HTML页面或命令行游戏等)时，都将创建一个存储库，将其克隆到您的计算机中，使用分支机构对其进行处理，然后将其缩小承诺发送到GitHub 。

Deal?!

交易？！

This will guarantee that you get some experience which you’ll need to master these tools.

这将确保您获得一些掌握这些工具所需的经验。

So let’s get started.

因此，让我们开始吧。

创建一个新项目 (Create a new project)

Let’s get back to your GitHub page and click on the plus icon (+) at the top of the page.

让我们回到您的GitHub页面，然后单击页面顶部的加号(+)。

Click on New repository.

单击新建存储库 。

Let’s say you are creating a project to study HTML, so name your repository learning-html. It could be the name of a page that is being created or any project, such as: curriculum-in-html, little-snake, tic-tac-toe, or anything else, ok?

假设您正在创建一个研究HTML的项目，因此将存储库命名为learning-html 。它可以是正在创建的页面或任何项目的名称，例如：“ courses-in-html” ，“ little-snake” ，“ tic-tac-toe ”或其他任何内容，好吗？

The description of the project is optional. But I think it’s important to enter some helpful text there, as it will identify the scope of your project. If other people want to help you, they can understand your project briefly through the description. In your case, you can enter something like HTML language study repository.

项目的描述是可选的。但是我认为在此输入一些有用的文本很重要，因为它将确定您的项目范围。如果其他人想帮助您，他们可以通过说明简短地了解您的项目。就您而言，您可以输入类似HTML语言学习资料库的内容 。

You should make a README file as well, and define the type of license that you will use in the project. Take a look at these good examples of READMEs, as well as the license to use on the project.

您还应该制作一个README文件，并定义将在项目中使用的许可证类型。看一下这些自述文件的好例子，以及在该项目上使用的许可证。

The README file is a more complete description of your project, so it’s a good idea to put some helpful information in there. Follow the examples in the link.

README文件是您项目的更完整描述，因此在其中放置一些有用的信息是一个好主意。请遵循链接中的示例。

Although the license is optional, it’s good practice to define it. The license will say what other people can do with your code. The MIT license is one of the most popular, and allows you (and others) to do many things with the project. Take some time to search for others types of licenses if you wish.

尽管许可证是可选的，但定义它是一个好习惯。许可证将说明其他人可以如何使用您的代码。 MIT许可证是最受欢迎的许可证之一，它允许您(和其他人)对该项目进行很多操作。如果需要，请花一些时间搜索其他类型的许可证。

创建您的工作区 (Create your workspace)

Once you’ve created the repository, you can clone it on your machine. But before that, you need to create a folder where you will clone all future repositories you work on.

创建存储库后，可以将其克隆到计算机上。但是在此之前，您需要创建一个文件夹，在该文件夹中您将克隆所有将来使用的存储库。

Use the terminal to create a folder that will be your workspace. You do this to maintain an organized system, otherwise you’ll end up scattering your projects around (and you might lose them just like you lost those kittens gifs that you saved on your computer…).

使用终端创建一个文件夹，它将成为您的工作区 。您这样做是为了维护有组织的系统，否则最终将分散您的项目(并且您可能会丢失它们，就像丢失了保存在计算机上的那些小猫gif一样……)。

Assuming that you’ve already installed cmder, we can now open it (if you didn’t, now is a good time) and we will be at C:/Users/your_computer_name .

假设您已经安装了cmder，我们现在可以打开它(如果没有，现在是个好时机)，我们将位于C:/Users/your_computer_name 。

If you aren’t on this path, use the command:

如果您不在此路径上，请使用以下命令：

cd %home%

Run the command mkdir folder_name to create the workspace. For example:

运行命令mkdir folder_name创建工作空间。例如：

mkdir workspace

That’s it! Now you have the default folder for your projects, and you can clone your repositories in there.

而已！现在，您拥有了项目的默认文件夹，并且可以在其中克隆存储库。

克隆您的存储库 (Clone your repositories)

Cloning a repository means that you’ll copy all of the files and directories on the GitHub server onto your machine so you can work with them.

克隆存储库意味着您将GitHub服务器上的所有文件和目录复制到您的机器上，以便可以使用它们。

Now you need to clone the project that you created on GitHub to your workspace. To do this, go to the folder that you just created. On cmder, type:

现在，您需要将在GitHub上创建的项目克隆到工作区。 为此，请转到刚创建的文件夹。在cmder上，键入：

cd workspace\

Tip: if you created the folder or want to access one which already exists, you can start typing its name and hit TAB, and cmder will autocomplete the name for you.

提示：如果您创建了文件夹或想要访问已经存在的文件夹，则可以开始输入其名称并按TAB键，cmder会自动为您完成该名称。

With that, go to your project page on GitHub and get the link that you need to clone the repository.

这样，转到GitHub上的项目页面，并获得克隆存储库所需的链接。

The link is in that green button named Clone or Download:

链接位于名为Clone或Download的绿色按钮中：

Change from HTTPS to SSH, because you already configured your access key in your account.

从HTTPS更改为SSH，因为您已经在帐户中配置了访问密钥。

Now you can run the git clone command and pass the link that you get. Just like that:

现在，您可以运行git clone命令并传递您获得的链接。就像这样：

git clone git@github.com:our-username/learning-html.git

And your repository will be cloned, like in the following picture:

并且您的存储库将被克隆，如下图所示：

You can access the repository folder which was created in your workspace when you cloned it.

您可以访问克隆时在工作空间中创建的存储库文件夹。

Type the command: cd learning-html/

输入命令： cd learning-html/

Attention: I’m assuming that you are inside theworkspace diretory now. If you aren’t, the above command will not work. Use cd %home%\workspace\ and then the above command.

注意：我假设您现在位于workspace目录中。如果不是这样，则上述命令将不起作用。使用cd %home%\workspace\ ，然后使用上面的命令。

创建一个分支 (Create a branch)

Every time you change something in a project versioned with Git, you should create a branch with the name of the task which you’re working on. This prevents you from messing up the “main” code located on the master branch. For this, you can use the following command:

每次在使用Git版本化的项目中更改某些内容时，都应使用正在处理的任务的名称创建一个分支。这可以防止您弄乱master分支上的“ main”代码。为此，可以使用以下命令：

git checkout -b task_name

A branch is like a tree branch. It’s part of the trunk of the tree. So you can make changes in parallel with the main part of the project without affecting it.

树枝就像树枝。它是树树干的一部分。因此，您可以与项目的主要部分并行进行更改，而不影响它。

For example:

例如：

Once you’ve done this, you can change automatically to the newly created branch and can code like crazy now.

完成此操作后，您可以自动更改为新创建的分支，并且现在可以像疯了一样进行编码。

提交更改 (Commit the changes)

Once you finish a change to your project, you should commit the change to your remote repository (the one on GitHub’s servers).

完成对项目的更改后，应将更改提交到远程存储库(GitHub服务器上的远程存储库)。

To commit something is to tell Git that you are putting your changes in the queue to be pushed (sent) to your remote repository.

提交内容是告诉Git您正在将更改放入要推送(发送)到远程存储库的队列中。

Imagine that you just created an HTML page and added some titles and text to it. You have the first version of this document now, so you should commit it.

想象一下，您刚刚创建了一个HTML页面，并向其中添加了一些标题和文本。您现在拥有此文档的第一个版本，因此您应该提交它。

To do this, run some commands so that Git understands that we want to send our changes do the remote repo. Run git add file_name to tell Git to stage the file.

为此，请运行一些命令，以便Git理解我们要在远程存储库中发送更改。运行git add file_name告诉Git git add file_name文件。

Alternatively, you can run git add --all to send all the files that you made some changes to. With the git status command, you can see which changed files you will commit to the server.

另外，您可以运行git add --all发送所有您对其进行了更改的文件。使用git status命令，您可以查看要提交到服务器的更改文件。

In the above example, the index.html file was created and the git status command was run to see what was changed. Then the file was added with git add and git status was run again to see which file was added to the Git workspace.

在以上示例中，创建了index.html文件然后运行git status命令以查看更改了什么。然后，使用git add添加文件，并再次运行git status以查看哪个文件已添加到Git工作区。

With that you can now commit the changes. Just run the git commit command, just like git commit -m "commit_message" . Remember to include a descriptive message of what was added to the commit.

这样，您现在可以提交更改。只需运行git commit命令，就像git commit -m "commit_message" 。请记住要包含有关已添加到提交内容的描述性消息。

合并变更 (Merging the changes)

After you’ve committed the changes, you now have a branch with modifications ahead of the ones in the master branch. That means that you have a different version of the project, and you need to merge those changes with the main version of the project. Before doing that, verify what the differences are between the branches. On your branch, perform the command:

提交更改后，现在将在master分支之前有一个分支，其中包含修改内容。这意味着您有一个不同版本的项目，并且需要将这些更改与项目的主版本合并。在此之前，请验证分支之间的区别。在您的分支上，执行以下命令：

git diff master

The output will be something like:

输出将类似于：

Git shows you the newest commit made, which files were added or changed, and what was changed as well.

Git向您显示最新的提交，添加或更改的文件以及更改的内容。

Since you know that you have differences between your branch and the master, you need to merge them to join the new commits, which you made in your branch, with the code in the master. To do this, you need to go to the master branch, on cmder, and run the command git merge .

既然你知道你有你的分支和主之间的差异，你需要将它们合并加入新的提交，您可以在您的分支制成，具有在主代码。为此，您需要转到cmder上的master分支，然后运行命令git merge 。

To get back to the master, run git checkout master . To merge the commits, run git merge our_branch_name .

要返回主服务器，请运行git checkout master 。要合并提交，请运行git merge our_branch_name 。

Git will show you an output confirming what was added.

Git将显示一个输出，确认添加了什么。

将其发送到GitHub (Sending it to GitHub)

After you’ve made and merged all the changes, you can now send them to your remote repository on GitHub.

在完成并合并所有更改之后，现在可以将它们发送到GitHub上的远程存储库。

You will use git push origin master to do this.

您将使用git push origin master来执行此操作。

You can also just use git push . It’ll have the same result. But when you push changes for the first time on your workspace, you need to do git push origin master so that Git will know that your workspace is the origin of the push.

您也可以只使用git push 。会有相同的结果。但是，当您第一次在工作区中推送更改时，您需要执行git push origin master以便Git知道您的工作区是推送的来源。

Now your commit will appear on your GitHub repository’s page:

现在，您的提交将出现在GitHub存储库的页面上：

结论 (Conclusion)

In this tutorial, you learned how to create a project on GitHub so that you can track your progress every time you study something new. This will help you get to know the command line (Terminal), Git commands, and GitHub. Besides that, it’ll help you create a nice portfolio that you can show in job interviews.

在本教程中，您学习了如何在GitHub上创建项目，以便每次学习新内容时都可以跟踪进度。这将帮助您了解命令行(终端)，Git命令和GitHub。除此之外，它还可以帮助您创建一个不错的投资组合，可以在工作面试中显示出来。

Practicing like this will also help you better understand how to use Git with remote repositories (the repositories hosted on some platform like GitHub). You’ll also level up your knowledge and skills on the Terminal.

这样练习还将帮助您更好地了解如何将Git与远程存储库 (托管在GitHub等平台上的存储库)一起使用。您还将在终端上提高知识和技能。

Don’t forget the ground rules that you set:

不要忘记您设置的基本规则：

always create a new project of study
总是创建一个新的研究项目
work on branches
在树枝上工作
commit the changes until it’s time to push them to GitHub
提交更改，直到将其推送到GitHub为止

Ok? :)

好？ :)

Come back here and follow this step-by-step guide every time you forget something!

每当您忘记某些内容时，请回到此处并按照此分步指南进行操作！

My name is Iago Rodrigues. I am an intern in Brazil, in the city of Belem.

我叫Iago Rodrigues。我是巴西贝伦市的一名实习生。

You can follow me on social media. Always a pleasure to help with what I can.

您可以在社交媒体上关注我。总是很乐意帮助我。

Iago Rodrigues (@iagokv) | TwitterThe latest Tweets from Iago Rodrigues (@iagokv). Front-End Developer | Vue.js padawan | Noob on life. Belém, Brasiltwitter.com

Iago Rodrigues(@iagokv)| Twitter Iago Rodrigues(@iagokv)的最新推文。 前端开发人员| Vue.js Padawan | 菜鸟生活。 巴西贝伦(Belém) twitter.com

Yeah! I know. My twitter photo is something …

是的我知道。我的推特照片有点……