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 …

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