I'm going to try to write this article with as little mumbo jumbo as possible, so you don’t get unnecessarily confused. I’m assuming you understand the difference between Git and GitHub, as well as the ‘usefulness’ of the two. This post is going to show, in plain English, the steps that go into starting a repository. And then after, show how we do those steps.
To start, make a GitHub repository. Navigate to “New Repository” on GitHub. You should then be on a page that looks like this.
Simply give your repository a name, relative to whatever project you’re working on or going to be working on. Additionally, you can add a description if you’d like and do things like change the publicity of the repository.
At the bottom of the page, are a handful of other options to start your repository off with. This part can throw off beginners, as I will explain later on, but if you’d like to add a README, .gitignore, and/or license, go ahead.
Now that you have your GitHub repo, we can go over the 5 simple steps that will take place when working with Git and GitHub. These steps are as so:
Initiate a local git repository on your computer.
Add your remote repository.
Start coding and add your files.
Commit your code
Push your local repo state to your GitHub repo.
Now that you have the steps, let’s break them down and explain how we go about doing them.
1. Initiate a local git repository on your computer
The idea behind using Git and GitHub is that you have a git repository online, which we created earlier on GitHub, and that we also have our own local Git repo on our local computer. To make a local Git repo, open the terminal/console in your projects folder and run the command
git init
This command creates a .git file in the directory that you are currently in. This .git file makes the directory it’s in a local git repository. So now that we have a local git repository, we can now connect it to our GitHub repository.
2. Add your remote repository
So we have our local repository, but how do we connect it to our GitHub repo we made earlier? This command allows for us to connect our local repo to our GitHub repo.
git remote add origin [repo url]
Let’s break this command down to make sense out of it. We are working with the git remote functionality, which is why the first two arguments are git remote, so that’s simple enough. But what’s this add origin [repo url]?
We are adding a remote to our local repository named ‘origin’. The name ‘origin’ is not necessary either. If we wanted to, instead of ‘origin’, we could name the remote ‘purplecow’ or anything we want really. But the standard is to name it origin.
The last argument is the link to your repository, which looks a little like this: https://github.com/user/repo.git. You can find this link by clicking this button on your GitHub repo.
(Part 2)
If you added a README, or any other initial file when creating your GitHub, you NEED to follow this step. Otherwise, you may encounter some trouble. If you didn’t initialize with any files, you can skip this and go to Step 3.
The problem present is that your GitHub repo has a file that your local repository doesn’t have, which is whatever file you initialized with (README, .gitignore, etc). Your local repository is considered behind. To fix this, you now need to pull the files from your GitHub repo to your local repo. To do this we do:
git pull origin master
This will pull the README.md file or any files that GitHub started off with, into your local repo. It’s important that you do this now in the process. Otherwise, when you start committing changes, your repos will be considered ‘desynced’, and you’ll have to go thru a tedious process to get things right.
3. Start coding and add your files
Our GitHub repo and our local repo are all set up! Now it’s time to add files to the staging area. The staging area is basically just the “area” or list of updated files that are ‘appended’ to be committed. To ‘append’ a file, we use the ‘git add’ command. You can add individual files by doing something like this.
git add file1.js file2.js file3.js
However, if we already have our project developed and fleshed out, and want the entire directory to be staged, we can do something like this.
git add *
This is going to add every file, in the current directory to the staging area, that Git detects has changed. But what if there are some files that you don’t want added? Perhaps you have a file with sensitive information that you don’t want Git having access to? This is where .gitignore comes in handy.
.gitignore is a file that allows for you to blacklist other files to not be tracked. So when doing ‘git add’, you don’t accidentally add unwanted files.
To make a .gitignore file from the terminal, you may do this.
touch .gitignore
We then open the .gitignore file and filter unwanted files on separate lines. For example, on one line I may put node_modules to blacklist a folder named node_modules. On another line I may add .png, to blacklist all png files if I wanted to.
4. Commit your code
Almost done! We now need to commit our work. We added our files using git add and now need to save those changes to our local repository, as those are only in the staging area. To do this, run:
git commit -m "Initial Commit"
As mentioned, this command will commit any changes/additions we did using git add to our repo. The -m allows for us to put a message inside of our command, which we did after in quotation marks. Traditionally, on your first commit, you’ll have the message say “Initial Commit”.
5. Push your local repo state to your GitHub repo.
Now all that’s left is to update the state of our GitHub repository. We’ve been running all these commands and doing all these changes, but it’s only been affecting our local repo on our computer. So let’s run a command to update, or push, our GitHub repo.
git push origin master
Essentially what’s happening is, we’re pushing our master branch to our origin. Origin was one of the things we defined early on, being our GitHub repo's URL.
So now, look at your GitHub repo page. If all went well, your push should be successful and you should see your files online! Simple enough, right?
Post-Tutorial + Tips
Boiled down, these 5 steps can be converted to a list of these commands:
git initgit remote add origin (repo url)git addgit commit -m “your message”git push origin master
But what do you do while you’re working on a project and you make changes? How do you keep your repo updated as you code? Well, just re-iterate steps 3 - 4.
For example, what if I fix a bug in my code, so I want to update my repo. I’d do something like this.
git add modifiedFile1.php modifiedFile2.txt
As taught earlier, I'd then have to commit those changes by doing running, git commit -m “Fixed a bug where taco was displayed as toast”. As you can see, I gave a detailed but short description as to what changes I made in the iteration.
Finally, I push those changes to my GitHub with git push origin master. And that’s pretty much all there is to Git and GitHub. There are also many array of commands and functionality that Git and GitHub hold, but you’ll slowly learn these as you need them, or by looking at documentation.
Top comments (0)