Crealanta Magazine

How To Push Code to GitHub: Step-by-Step - (r)

Jul 11, 2023
People in front of a monitor learning how to push code to github

Share the news on

This blog post will teach you how to push to GitHub using your command-line. Additionally, we will look at specific apps that can ease the process. At the end of this article We discuss the reasons why pull requests are something you learn and what they have to do with push codes. The first step is to consider how you'd use GitHub to develop your project.

How can a developer or programmer Will Use GitHub

GitHub is a vital software for developers and programmers across the globe for many reasons. It allows you to save your codes at a central place, which makes it easy to access, and also allows for more collaboration with fellow developers.

The GitHub logo, showing the word “GitHub” in black text on a white background.
The GitHub logo.

You're also able to track changes made to your code, and then return to earlier versions when necessary. Furthermore, GitHub provides tools to help manage issues and bugs which makes it more straightforward to maintain your codebase.

GitHub provides the ability to easily manage different versions of your codebase, track changes, and roll them back if you have to. Massive projects and open-source collaborative projects are only two of the ways GitHub can demonstrate its worth.

A portion of the GitHub Actions website, showing a gray box with the dialog, “Build, Test, and Publish” along with a button. There are lines akin to a flow chat connecting to three boxes for Linux, macOS, and Windows systems, each with the command, “run: npm test”. There are also gray lines running and converging from those boxes.
A case study of how GitHub Actions fit in a workflow.

On the whole, GitHub - and other remote VCS hosts, such as GitLab can provide a platform for collaboration, version control, and various other processes for developing. This can improve the process of development and increase the quality of code. As such, you will want to learn how to push to GitHub since this information will benefit you almost every day.

How to push to GitHub via the Terminal (Command line)

The remainder of this post will show you how to push to GitHub. It's a process that's simple to understand and execute.

However, you need be sure to prepare your project in advance, otherwise, you'll encounter problems. In the beginning, we look at what are the tools and abilities you'll need and then examine the procedure in more detail.

What you need to do is push to GitHub

The whole process of controlling version begins within a local area on your computer. There are specific procedures to accomplish this later, but you may already know about this (or have access to it.)

To push your code to GitHub, you can use either the command line option or a graphical user interface (GUI.) The bulk of this post will be about using the command line however, there's a section on using GUIs. GUI in addition, because some are popular. However, note that each GUI has a distinct procedure to upload the code to GitHub and this means that it is essential to use one particular application in order to get your most from the features it offers.

1. Create a GitHub Repository

First, you need creating a brand-new online repo in GitHub. Although you could do it via command line, it's simple to complete it with a web browser.

After you have logged in or register with GitHub, head to the top-right corner of the screen. There, look for a Plus drop-down menu right next to the avatar of your profile. If you select this menu, it will show you a few options that include New repository:

A portion of the GitHub interface that shows a list of latest changes within the GitHub repo. On top is a drop-down menu with a number of options. The New repository option is highlighted in blue.
Making the decision to set up a brand new repository within GitHub.

Once you click this, you come to the Make A New Repository webpage. The page will present you with several settings that will aid in setting up your remote repo up:

The Create a new repository screen within GitHub. There are a number of options here, such as naming an owner, setting a repository name, making the repo private or public, and initialization options. There are settings for readme and .gitignore files, and the option to choose a suitable license.
The creation of a repository within GitHub.

The options you set are specific to the needs of your project. But, if you have a local repo to push to GitHub, we'd tick as little as possible to ensure that you maintain a balance between local and remote.

Click the Make repository option, then GitHub will set things up underneath the hood. After that, you will be taken to the repo's homepage page that provides you with the steps to create a local repo, which links to the remote repo via the command line. The path you follow is contingent upon whether or not you're not yet in possession of repos or you'd prefer to copy the content of an existing project.

If you've successfully initialized Git and created your local repo it is not necessary to complete anything in step 2. Instead, it's time to move directly to the next step, where we look at the process of transferring code to GitHub using your local repo.

2a. Copy Your Remote's Git Repo

If you're not yet able to have a local repo, the GitHub version is the only option. The best way to sync the two repositories is using the git clone function using your PC. However, you do need the repo's URL.

For access, go to the repo on GitHub then look for the green code drop-down menu above your list of files:

A portion of a repo within Github. The main part of the image shows the green Code drop-down menu, complete with the HTTPS URL for the repo itself, and options to download a ZIP file of the repo, and to open it with GitHub Desktop.
Opening the Code drop-down menu on GitHub.

If you don't see this, it's likely because you don't yet have a populated repo. You can take the repo's URL and copy it from your blue Quick Setup box at the top of the screen. Switch to HTTPS using the buttons, and copy the URL.

A portion of the GitHub screen showing the Quick Setup box in blue. It has a header that reads, “Quick setup – if you’ve done this kind of thing before” and options to set up the repo in GitHub Desktop or copy both the HTTPS and SSH URLs for the repo. There is also a snippet of code to create a new repo on the command line.
Using the Quick setup options to duplicate the repo URL within GitHub.

We'd rather make an .gitignore file, because this would be something you need anyway. You can use gitignore.io to search for the tools you use and, using them, generate a complete .gitignore file to upload to the repo:

Toptal’s GitIgnore website. It’s white, with a blue toolbar at the top. In the middle, there’s a search bar with a green confirm button to search for elements, and a blue title that reads, “gitignore.io”.
The gitignore.io site.

Regardless, once you can access the code drop-down menu, it will show URLs for your repo. There will be options to use HTTPS, Secure Shell (SSH,) and others. However, the straightforward approach is to go with HTTPS. HTTPS URL. It is possible to click on the tiny copy icon that is next to the URL to save it to your clipboard.

Next, head back towards Your Terminal (or command-line program, and execute the following commands:

Gi clone with full-github-url

After you execute the command, Git will copy the remote repo to the local environment.

2b. Start Git in Your Local Project Folder

For situations where you don't yet have a local version of your remote repo, you need to initialize one. Most of the work you do will be local, with sending the updates on the remote servers on frequent intervals. These are the steps to follow:

  • Then, cd to a folder you'd like to use for your project.
  • Next, run next, run the Git init command. The command will create Git's initialization in the local folder for your project and also create a hidden .git directory.
  • Make sure to add the .gitignore file to the directory root of your project's local folder as you will not want to create modifications to files on your system.

Now you must index your current files. It is accomplished in a usual way by using the command git add, then committing the modifications:

Git add . git commit -m "Initial Commit"
 
 git branch -M trunk

The final line switches your main branch to a different branch from which you can choose if haven't yet switched to master. The latter is problematic as it is associated with negative meanings of slavery, so it's recommended to change the branch. The trunk is what we've used here However, main is acceptable. If you're sure that this line is not what you're looking for, you may omit the line.

At this point, you're eager to know how to submit your GitHub push!

3. Create a new Remote Origin and push your Code to GitHub

When you've made a change to a remote repository using GitHub You'll need to create a new remote origin' in the local repository. It's basically the link to your remote repo so that your local one knows where to send the modifications made to the upstream.

For this, type the following command into your terminal

git remote provide the origin of github-url>

From a technical perspective the remote that you connect could have any number. Most people refer to it as "origin" as you only have one remote to add and it offers absolute clarity. In this case, you can push the file to GitHub using the following:

 git push -u origin trunk
 git push -u trunk

This command is used to push your code over to a new remote source - referred to as "origin" and then set the branch that was previously created to "trunk." It is also encouraged to add every branch into the remote repo, if you're asked to.

A portion of a Terminal window that shows the output from a git push command. It shows how the process enumerates through files, compresses them, and writes them to GitHub. It also shows which URL those files go to, any new branches that have to be set up, and a summary of the overall action taken – tracking a remote branch from the origin.
Executing a git push command in the Terminal.

When the push is complete after the process is completed, it's time to check that the push succeeded. There are several methods to check this. As an example, head to the repo on GitHub and check if updates are up and running:

A repo home page on GitHub. It shows the path for the repo, a selection of navigation options to carry out different tasks, and a list of changes based on a recent commit. There is also information about the repo, such as its license, description, and release schedule.
Checking the state of the status of a Git repo on GitHub.

But, you could also run git log from the command option:

The top of a Terminal window that shows the output from a git log command. The commit hash displays in yellow, with branch information in red. There is information for the author and date of commit, along with a commit message for each.
Running a git log command within the Terminal and viewing the output.

The command shows every commit on your repo, which includes the one you just made. As such, if you can see the commit in the log, it means that the push succeeded.

How To Send a Push Request the GitHub API GitHub Without Errors

In some instances, you might be unable to push your code if you attempt to push to the GitHub code:

A Terminal window that has looked to run a git push command, and encountered an error. The title for this error reads, “Warning: Remote Host Identification Has Changed!” and offers a lot of information relating to the error. In short, it guides you to check the RSA fingerprint, contact your sysadmin, and add the correct host key to your ‘known hosts’ file.
Getting an RSA key error following a pull from git.
ssh-keygen -R github.com

The update will be made to the file 'known hosts to reflect a confirmation message:

A corner of a Terminal screen that shows the results of removing old keygens for github.com from your ‘known hosts’ file. The command scraps the file, finds the host name, updates the file, and gives a path to where a copy of the original file is saved.
Removing an old host key with the Terminal.

In this case, do this procedure to add the key to the RSA key into your existing hosts file:

curl -L https://api.github.com/meta | jq -r '.ssh_keys | . []'  's/^/github.com>> ~/.ssh/known_hosts

Actually, you might also see an error here as well, which is related to the jq program. If this is the case then you should run one of the following depending upon your system's operating system.

  • Windows: curl -L -o /usr/bin/jq.exe https://github.com/stedolan/jq/releases/latest/download/jq-win64.exe
  • Mac: brew install jq
  • Linux: apt-get -y install JQ

Once the installation is complete, execute the command again and wait for it to complete:

The top of a Terminal window that shows the result of running a command to create a new RSA key and add it to the known hosts file. It shows the full command, and a summary of the data transfer.
Making a new RSA key with the terminal.

Utilizing a GUI to Push Your Code to GitHub

The process of pushing code to GitHub is straightforward once you've setup it however, there are many procedures, restrictions, and subprocesses to consider. An GUI could make the process easier.

You can, for instance, have all of the functionality of the command line but using an easier interface (with drag-and-drop in some cases.) Additionally, it's easier to visualize and manage modifications using visual GUI even in the event that you're not acquainted with command line programs.

If you know you'll never need to use your GUI application to connect to another remote VCS server, GitHub Desktop could be perfect.

The GitHub Desktop interface, showing a history of commits along the left-hand side, and code differences within a specific commit in the main window. There are a number of line additions that use green highlighting.
The GitHub Desktop application.

The app lets you create and manage repositories, make modifications, and then push the changes to GitHub using just a couple of clicks. It works using drag-and-drop functionality and also has a 'visual diff' tool for finding code changes that have changed between versions:

A portion of the GitHub Desktop interface that shows a single commit and its changes. It shows removal of whitespace that uses red highlighting, and line additions that use green highlighting.
The ability to view differences within a commit by using GitHub Desktop.

GitKraken is perhaps the best looking GUI application available, and comes with a reasonable free version for local and public repos. It is compatible with all major VCS hosts including GitHub, of course, but GitLab and BitBucket also, as well as others. We like the visual representation of your repo. Additionally, this solution has thoughtful features to teams, too.

Using GitHub Desktop to push the GitHub Desktop to GitHub

While the process for each application will differ slightly the The GitHub Desktop is easy to use. You work within the same screen which includes different windows and panels. When you make changes to a file (which is accessible in your preferred editor via a right-click context menu) then you make the changes by using a tiny widget on the screen:

The GitHub Desktop interface that shows a change to a file on the left, and the specific changes in the main window. There is one line removal that uses red highlighting, and two additions using green highlighting. The bottom left corner shows the commit message box. It’s highlighted in purple, and lets you type the commit message and description. There’s a blue “Commit to trunk” button to confirm the commit.
The process of committing a change is done within GitHub Desktop.

This commit will become part of the push Origin section within the upper toolbar. If there aren't any modifications to make you will receive an alert to send your commits to the remote that originated them:

The GitHub Desktop interface showing that there are no local changes. There are a number of options in the main window to push commits to the remote repo, open the repo in an editor, view those files on your computer, and view the repo page within GitHub’s web interface
Pushing changes to the remote source within the GitHub Desktop.

It's a single-click method for pushing changes to your GitHub repo. This entire workflow is simple as well as painless to implement.

Use's Application Hosting with GitHub

For the first time, sign in to your dashboard and then go through your applications screen. It will look bare as you begin accessing it:

The My dashboard, showing the Applications page. There’s a purple graphic of funnels and tubes, and a small section showing an Add service button in purple, and a Learn more button in white. There are also brief instructions on what it means to add your first service.
It is the My Applications page within the Dashboard.

If you do click the Add service button, it will give you the option to install either an application or database. For this example, we'll pick the latter option. Application:

A close-up of the Applications page creation dialog. It shows a purple Add service button with a drop-down to either create an Application or Database. There’s a white Learn more button, and guidance on what to expect once you create a new service.
You can add a new service by clicking the button that is relevant within the Application screen.

Then, it will ask you to connect to GitHub for the purpose of importing repos from the platform:

The My Applications page showing a popup dialog to integrate with GitHub. There is a brief description of what you do, and buttons to both Cancel the integration or Continue with GitHub.
The choice to join GitHub once you add a new service.

The next wizard will guide you through the process of setting your app. You first need to choose repo from GitHub, then select the default branch:

The Add Application wizard, showing the four steps to set up an app and integrate it with GitHub. There are a number of options, such as choosing a repo and branch, adding an application name, choosing a data center location, and more. At the bottom is a purple Continue button and a white Cancel button.
Configuring the application's information for your deployment within My Add application wizard. My Add application wizard.

You also need to give the application a name inside My and choose the data center you want to use. When you've selected Continue and you are asked to tweak the setting for the build environment:

The Build environment section of the Add application wizard. It shows a drop-down to select one of three build machine options, then a partial section to choose a Dockerfile for your deployment.
The setting of build environment options is done in the My installation wizard.

You have two options available:

  • Pick a building machine from the available.
  • Make a container picture, either using automation or from a specific track or your own.
The Resources section of the Add application wizard. It shows options to set a process name, select a process type, add a start command, select a pod size, and specify an instance count. There’s also a white Add new process button.
Specifying resources within the Add application wizard screen.

Summary

GitHub is an essential tool for developers and programmers. It provides a centralized repository for storing, tracking, and collaborate on code. When you've learned how you can push your code on GitHub from a local repo, you can join in with that collaboration.

Using the command line, it's easy to upload your code on GitHub and will only need just a couple of commands once you've set up everything. You may also want to look into a GUI application, like GitKraken and GitHub Desktop. They can remove the command line out the equation and let you accomplish almost everything you'll need using Git from a familiar interface.

Do you have any questions about how to push into GitHub? Ask away in the comments section!