Creating Your First Pull Request in GitHub

“Can you create a PR?”

Have you ever heard that and had to Google around for PR’s and how to get one done successfully? Well, you’ve come to the right place. We are going to start from the beginning of creating your first Pull Request.

What Exactly is a Pull Request (PR)?

A Pull Request, or PR, is a way to contribute to a repository in GitHub.

A Pull Request allows us to contribute code to our own repo, our teams repo, or an open source repo.

The repository needs to be open, or you need to have permission to be able to submit a PR. If you have permission, then go ahead and follow the upcoming steps! If you do not, simply "Fork and Clone" the repository. Once you Fork it, then it will live on your own GitHub account as a forked repo.

Why Make a Pull Request?

Pull Requests are a big deal in the world of collaborative coding. If you've ever heard the term open source , then you may be familiar with this concept of having anyone see your code and make suggestions to it.

You could even contribute to some of the code changes and even issues on favorite projects like React . We can see the pull requests that others have done to help make React a better library.

An example of why you would want to make a Pull Request is you are working on a team and you contribute to the repository. Creating a PR is important because we wouldn't want to push to the master branch until code reviews are completed and a teammate approves it.

50% Off New Course: Make 20 React Apps !

Let's talk about the steps to create a pull request on a project. We'll be walking through the steps to grab a project and make a pull request.

Cloning into a Project

There are two ways to start the process.

1. Cloning another’s project
2. Your own project you started from scratch (not very likely)

The most common case is going to be #1. So we are going to start this example by cloning into a project that was created earlier. It’s a basic React app that was created via the command create-react-app . We can find that GitHub repo here .

Once in that GitHub repo, click on the green button that says, "Clone or download". A dropdown will show us a password protected SSH key. You can change it to HTTP by clicking "Use HTTPS" in the upper right-hand corner of that dropdown. We are going to use the SSH way in this article.

Copy that key! We are going to need it soon!

In your terminal (we are on iOS for this example), navigate to the location in your computer where you would like this project to live. To learn more about navigating throughout the Terminal, check out this article on "10 Need to Know Mac Terminal Commands" !

Using the following command, we are going to officially clone the project and be able to have all the code on our local machine:

git clone [[email protected]](mailto:[email protected]):kapehe-ok/react-git-pr.git

Use the command to get into the project:

cd react-git-pr

Now we are cloned into the project and can start with our first PR!

For the remainder of the article, let's work in VS Code. Go ahead and open up the code in VS Code.

• Note! From the Terminal, a short cut to open VS Code is code . This needs to be installed. Within VS Code hit "cmd + shift + P". Type in "Shell command: Install 'code' command in PATH." and hit "Enter". From now on, you can use code . to open up VS Code from Terminal.

When making a PR, we want to create our own branch. If someone is having you create a PR it's because they don't want you to push to the Master branch. Using the following command, we jump out of the Master branch and into our own branch:

git checkout -b kapehe-first-pr

The 'b in this is indicating that we are creating a brand new branch. The kapehe-first-pr is the name of the branch. Feel free to name a branch whatever is fitting.

• Want to double-check you are in the new branch? At the bottom left-hand corner of VS Code, you'll see the name of the branch you are on. If we see "kapehe-first-pr" there, then we did it right! If we see "master", something's not right!

Make any change within the code just so we have a change to commit in the PR. We can dive into src/App.js and edit the <div> in there. We can edit it to have the line <h1>Aloha! Kapehe here!!</h1> ! Let's hit "Save" and get ready to make this PR!

Making the Pull Request

There are a string of commands that we are going to be doing here to make our first official PR. We'll go over each one!

git status

We want to check the status of all the files we changed. To do that, run the command:

git status

All the files that we changed and saved will show up here in red. Check out this screenshot to see how that would look:

Because we change the src/App.js file, we see that in red here.

git add

There are many ways to add the files to the queue to get pushed into the PR. In this article, we'll go over two different ways.

1. git add . - This will add every single file that shows up red when running git status
2. git add <filename> - This command allows us to type in the particular file we would like to add.

In today's example, we are going to use the second way. Go ahead and run the command:

git add src/App.js

And we should nothing happen! So how do we know it was added? Or at least the right files were added? Run our git status command again!

We now see that src/App.js is now in green! That means it was added and we are good to commit this change.

git commit

This command is where we name our commit. We generally want the commit message to coincide with what is happening in the file updates. Now that our file is added to the queue, let's go ahead and commit it. Run the following command:

git commit -m "Updating App.js div text"

The -m in this command is stating that we want to create our message within this command. The "Updating App.js div text" is our commit message. We can put whatever we want here. Try and make it make sense for what changes occurred.

Here we are! We made it to the final PUSH!

To push all of our updated work to the GitHub repo in the form of a Pull Request, run the following command:

git push origin kapehe-first-pr

That last part of the command is our branch name! Make sure that matches up exactly with the branch name so that there are no issues when pushing.

We pushed! But we are not done!

Creating the Pull Request!

In this final step, we need to head back to the GitHub repo.

Right away, we should see the following:

That light yellow line is new! That's showing our branch and that a push was created "(less than a minute ago)". See that green button that says "Compare & pull request". Let's hit that!

Once we do that, we can rename the Pull Request here, but for now, we'll just keep it as what we named it when we were committing it, "Updating App.js div text". Hit the green button that says "Create pull request".

It's done! We have created our first Pull Request!

Confirming the Pull Request

To double-check that everything is good, we can click on the tab that says "Pull requests". There we will see our PR and any other PR's.

Once we click into that, we will see details about our PR. We can see what was changed by clicking on the "Files Changed" tab, we can look at all the commits that happened under the "Commits" tab, and we can even merge into the master branch on the "Conversation" tab.

To merge into master, we would click on that green button that says "Merge pull request". Only do this when the PR is approved. Most likely, the owner of the project will coordinate on who merges the PR into master. It's probably a safe bet to not do it.

Let's recap those steps quickly:

1. Cloning into a project
2. Creating a new branch off of the master branch
3. git status
4. git add . or git add <filename>
5. git status
6. git commit -m "message here"
7. git push origin <branchname>
8. Go to the repo in GitHub and create the pull request!
9. Tada!! PR Created!

Now that we have created our first Pull Request, go practice some more. Take a project of your own, create branches off of it, and practice creating PR's! The more you practice, the better we'll get at it!

Like this article? Follow @kapehe_ok on Twitter