Chapter 3. Git & GitHub Project Setup

Non-Member – Start Project With Replica of Existing Repository (Fork)

On this page, we'll explain the last case. As GitHub is an open platform, you can access many repositories created by someone else. You may want to leverage an existing repository to start your new coding project.

In this case, you'll create a replica of an existing Remote Repository (but it will be a project independent from the original one). This case is also a rather common approach when you learn from a project that already exists on GitHub public repositories.

There are two key steps for this case.

  1. Create a replica of an existing Remote Repository. Find a repository that you want to leverage in your project. On the Remote Repository page on GitHub, find the Fork button to create a replica and bring it to your GitHub account page.
  2. Clone the Remote Repository. To start a project, you need to bring the project directories and files under the Remote Repository onto your computer by running the git clone command.

Case Example

For this case example, Developer C (account: ocean-blue2022 oceanblue-round-icon.png) will fork the git_practice repository owned by Developer A (account name: bloovee bloovee-round-icon.png).

1. Create a replica of an existing Remote Repository - Fork

Log in to your GitHub account. In the image below, you can see that Developer C signed in to the GitHub platform with the ocean-blue2022 account.

Non-Member--Start-Project-With-Replica-of-Existing-Repository-Fork

To go to the repository, search the repository using the search box. In this case, Developer C finds the bloovee/git_practice public repository.

Non-Member--Start-Project-With-Replica-of-Existing-Repository-Fork

Non-Member--Start-Project-With-Replica-of-Existing-Repository-Fork

Non-Member--Start-Project-With-Replica-of-Existing-Repository-Fork

To fork the repository, press the Fork button on the top right.

Non-Member--Start-Project-With-Replica-of-Existing-Repository-Fork

Press the Create fork button.

Non-Member--Start-Project-With-Replica-of-Existing-Repository-Fork

Now, the forked repository git_practice is created under the ocean-blue2022 account

Non-Member--Start-Project-With-Replica-of-Existing-Repository-Fork

2. Clone the repository to create a local copy on your computer

After you fork the repository on GitHub, the next step is the same as the one we explained in the previous practice. You need to run the git clone command to transfer the project directory onto your computer; however, you need to check two things

  • Prepared for GitHub HTTPS or SSH connection: For HTTPS, you need a PAT. For SSH, you need SSH key pairs and the public key needs to be uploaded to your GitHub platform.

  • Set the current working directory: Before running the command, you need to decide where you create the project directory and the repository. Change your current working directory using the cd command.

Once you have done the above, run the command below.

Command Line - INPUT (for HTTPS)
git clone https://github.com/bloovee/git_practice.git

Or

Command Line - INPUT (for SSH)
git clone git@github.com:bloovee/git_practice.git
Command Line - RESPONSE
Cloning into 'git_practice'...
remote: Enumerating objects: 3, done.
remote: Counting objects: 100% (3/3), done.
remote: Compressing objects: 100% (2/2), done.
remote: Total 3 (delta 0), reused 3 (delta 0), pack-reused 0
Receiving objects: 100% (3/3), done.

After this, the git_practice directory will be generated under the directory in which you run the command.

The final status seems the same as the one in the previous practice. However, there is a significant difference between them. In the previous case, you are still collaborating with the owner of the original Remote Repository. In this case, you completely separate the Remote Repository. The forked repository no longer belongs to the original owner of the repository.

bloovee-round-icon.pngDeveloper A (Project Owner Role)

Practice

Objective:
Learn how to fork a repository and bring it to the local computer

For this practice example, Developer A (account name: bloovee) will fork the html-css-introduction repository owned by Developer B (account name: sky-blue2022). In your case, you can use any user account as you don't own the html-css-introduction repository.

1. Fork the repository

First, go to your GitHub web application and search the repository using the search bar at the top. Type sky-blue2022/html-css-introduction.

Non-Member--Start-Project-With-Replica-of-Existing-Repository-Fork

You'll find the repository. Go to the the repository.

Non-Member--Start-Project-With-Replica-of-Existing-Repository-Fork

Press the Fork button to create a replica of the repository under your GitHub account.

Non-Member--Start-Project-With-Replica-of-Existing-Repository-Fork

You can change the repository name if you want. Click the Create fork button for confirmation.

Non-Member--Start-Project-With-Replica-of-Existing-Repository-Fork

You'll see that a forked repository has been created under your account.

Non-Member--Start-Project-With-Replica-of-Existing-Repository-Fork

2. Clone the repository

Use your command line on your local computer to bring the repository to your local computer.

Open the project's main directory (e.g., Dev_A_bloovee) with VS Code. You can use drag & drop to open the directory.

Non-Member--Start-Project-With-Replica-of-Existing-Repository-Fork

After opening the project's main directory with VS Code, open a new terminal in the VS Code window.

Make sure that your current working directory in the command line is the project's main directory (e.g., Dev_A_bloovee)...

Non-Member--Start-Project-With-Replica-of-Existing-Repository-Fork

...and run the commands below.

Command Line - INPUT (for HTTPS)
git clone https://github.com/sky-blue2022/html-css-introduction.git

Or

Command Line - INPUT (for SSH)
git clone git@github.com:sky-blue2022/html-css-introduction.git
Command Line - RESPONSE
Cloning into 'html-css-introduction'...
remote: Enumerating objects: 100, done.
remote: Counting objects: 100% (41/41), done.
remote: Compressing objects: 100% (41/41), done.
remote: Total 100 (delta 18), reused 0 (delta 0), pack-reused 59
Receiving objects: 100% (100/100), 21.92 MiB | 4.28 MiB/s, done.
Resolving deltas: 100% (30/30), done.

You'll see that the project directory has been transferred into your main project directory.

Non-Member--Start-Project-With-Replica-of-Existing-Repository-Fork

IdeaNote: Repository URL

The repository URLs are available under the Code section of the repository as shown below. If you want to fork another repository, change the URL to the one for the repository that you want to clone.

Non-Member--Start-Project-With-Replica-of-Existing-Repository-Fork

On this page, we'll explain the last case. As GitHub is an open platform, you can access many repositories created by someone else. You may want to leverage an existing repository to start your new coding project.

In this case, you'll create a replica of an existing Remote Repository (but it will be a project independent from the original one). This case is also a rather common approach when you learn from a project that already exists on GitHub public repositories.

There are two key steps for this case.

  1. Create a replica of an existing Remote Repository. Find a repository that you want to leverage in your project. On the Remote Repository page on GitHub, find the Fork button to create a replica and bring it to your GitHub account page.
  2. Clone the Remote Repository. To start a project, you need to bring the project directories and files under the Remote Repository onto your computer by running the git clone command.

Case Example

For this case example, Developer C (account: ocean-blue2022 oceanblue-round-icon.png) will fork the git_practice repository owned by Developer A (account name: bloovee bloovee-round-icon.png).

1. Create a replica of an existing Remote Repository - Fork

Log in to your GitHub account. In the image below, you can see that Developer C signed in to the GitHub platform with the ocean-blue2022 account.

Non-Member--Start-Project-With-Replica-of-Existing-Repository-Fork

To go to the repository, search the repository using the search box. In this case, Developer C finds the bloovee/git_practice public repository.

Non-Member--Start-Project-With-Replica-of-Existing-Repository-Fork

Non-Member--Start-Project-With-Replica-of-Existing-Repository-Fork

Non-Member--Start-Project-With-Replica-of-Existing-Repository-Fork

To fork the repository, press the Fork button on the top right.

Non-Member--Start-Project-With-Replica-of-Existing-Repository-Fork

Press the Create fork button.

Non-Member--Start-Project-With-Replica-of-Existing-Repository-Fork

Now, the forked repository git_practice is created under the ocean-blue2022 account

Non-Member--Start-Project-With-Replica-of-Existing-Repository-Fork

2. Clone the repository to create a local copy on your computer

After you fork the repository on GitHub, the next step is the same as the one we explained in the previous practice. You need to run the git clone command to transfer the project directory onto your computer; however, you need to check two things

  • Prepared for GitHub HTTPS or SSH connection: For HTTPS, you need a PAT. For SSH, you need SSH key pairs and the public key needs to be uploaded to your GitHub platform.

  • Set the current working directory: Before running the command, you need to decide where you create the project directory and the repository. Change your current working directory using the cd command.

Once you have done the above, run the command below.

Command Line - INPUT (for HTTPS)
git clone https://github.com/bloovee/git_practice.git

Or

Command Line - INPUT (for SSH)
git clone git@github.com:bloovee/git_practice.git
Command Line - RESPONSE
Cloning into 'git_practice'...
remote: Enumerating objects: 3, done.
remote: Counting objects: 100% (3/3), done.
remote: Compressing objects: 100% (2/2), done.
remote: Total 3 (delta 0), reused 3 (delta 0), pack-reused 0
Receiving objects: 100% (3/3), done.

After this, the git_practice directory will be generated under the directory in which you run the command.

The final status seems the same as the one in the previous practice. However, there is a significant difference between them. In the previous case, you are still collaborating with the owner of the original Remote Repository. In this case, you completely separate the Remote Repository. The forked repository no longer belongs to the original owner of the repository.

bloovee-round-icon.pngDeveloper A (Project Owner Role)

Practice

Objective:
Learn how to fork a repository and bring it to the local computer

For this practice example, Developer A (account name: bloovee) will fork the html-css-introduction repository owned by Developer B (account name: sky-blue2022). In your case, you can use any user account as you don't own the html-css-introduction repository.

1. Fork the repository

First, go to your GitHub web application and search the repository using the search bar at the top. Type sky-blue2022/html-css-introduction.

Non-Member--Start-Project-With-Replica-of-Existing-Repository-Fork

You'll find the repository. Go to the the repository.

Non-Member--Start-Project-With-Replica-of-Existing-Repository-Fork

Press the Fork button to create a replica of the repository under your GitHub account.

Non-Member--Start-Project-With-Replica-of-Existing-Repository-Fork

You can change the repository name if you want. Click the Create fork button for confirmation.

Non-Member--Start-Project-With-Replica-of-Existing-Repository-Fork

You'll see that a forked repository has been created under your account.

Non-Member--Start-Project-With-Replica-of-Existing-Repository-Fork

2. Clone the repository

Use your command line on your local computer to bring the repository to your local computer.

Open the project's main directory (e.g., Dev_A_bloovee) with VS Code. You can use drag & drop to open the directory.

Non-Member--Start-Project-With-Replica-of-Existing-Repository-Fork

After opening the project's main directory with VS Code, open a new terminal in the VS Code window.

Make sure that your current working directory in the command line is the project's main directory (e.g., Dev_A_bloovee)...

Non-Member--Start-Project-With-Replica-of-Existing-Repository-Fork

...and run the commands below.

Command Line - INPUT (for HTTPS)
git clone https://github.com/sky-blue2022/html-css-introduction.git

Or

Command Line - INPUT (for SSH)
git clone git@github.com:sky-blue2022/html-css-introduction.git
Command Line - RESPONSE
Cloning into 'html-css-introduction'...
remote: Enumerating objects: 100, done.
remote: Counting objects: 100% (41/41), done.
remote: Compressing objects: 100% (41/41), done.
remote: Total 100 (delta 18), reused 0 (delta 0), pack-reused 59
Receiving objects: 100% (100/100), 21.92 MiB | 4.28 MiB/s, done.
Resolving deltas: 100% (30/30), done.

You'll see that the project directory has been transferred into your main project directory.

Non-Member--Start-Project-With-Replica-of-Existing-Repository-Fork

IdeaNote: Repository URL

The repository URLs are available under the Code section of the repository as shown below. If you want to fork another repository, change the URL to the one for the repository that you want to clone.

Non-Member--Start-Project-With-Replica-of-Existing-Repository-Fork