Heads up! To view this whole video, sign in with your Courses account or enroll in your free 7-day trial. Sign In Enroll
Preview
Start a free Courses trial
to watch this video
Learn how to create a local git repository and seamlessly connect it to a GitHub repository using the terminal.
Related Discussions
Have questions about this video? Start a discussion with the community and Treehouse staff.
Sign upRelated Discussions
Have questions about this video? Start a discussion with the community and Treehouse staff.
Sign up
[MUSIC]
0:00
Hi everyone, my name is Travis,
and I'm an instructor and
0:09
a student success specialist in the
Techdegree program here at Treehouse.
0:12
I'd like to show you my preferred way
of creating a GitHub repository and
0:17
pushing your project files
to it using the terminal.
0:20
This will be a common approach when
working in a professional development
0:24
environment and with a team, so it's good
to start familiarizing yourself with it.
0:27
In this video, I'll walk you through the
step-by-step process of creating a local
0:32
Git repository on your computer,
setting up a new GitHub repository,
0:37
connecting them, and pushing commits
to GitHub using the terminal.
0:41
Let's get started.
0:45
The first thing we'll wanna do is download
the project files provided by Treehouse.
0:47
For this video, I'm going to be using the
Full Stack JavaScript files for Project 1,
0:51
but this process will work for any
Techdegree or project you're working on.
0:56
I'm here on the project page
under the Getting Started tab.
1:01
On the right side is a link to download
the project files, let's click it and
1:05
download them.
1:09
Next, unzip the downloaded project files.
1:11
If you're unsure of how to do this,
be sure to check the teacher's notes for
1:15
some help.
1:18
I'm renaming the project folder but
you don't have to,
1:20
it's just my personal preference.
1:22
Now, I'm going to move my
project to my desktop, but
1:25
you can store yours wherever you prefer.
1:28
Now, we need to make our project
folder a local Git repository,
1:31
let's open it up in our
preferred text editor.
1:34
I'm going to use Visual Studio Code, check
the teacher's notes below on some links
1:37
for recommended text editors
if you don't have one yet.
1:42
Let's open up the integrated Terminal.
1:45
You can select Terminal to New Terminal,
but
1:48
a useful shortcut is control back tick.
1:51
This should automatically be
navigated to the root of this folder.
1:54
But if not, you can use the CD command to
change directories to ensure you're at
1:57
the top level of this project folder.
2:01
Let's enter the command git init and
press Enter.
2:05
This command initializes a new Git
repository in the directory you specified.
2:08
It creates a hidden .git directory that
contains all the necessary files and
2:13
folders for Git to manage version control.
2:17
As you can see, all of our files are
marked green and are tagged as untracked.
2:20
Before tracking any files,
let's create a .gitignore file.
2:25
A .gitignore file tells Git
to ignore specific files or
2:29
directories when tracking
changes in a repository.
2:32
It's useful for excluding sensitive or
unnecessary files and
2:36
keeping your repository organized.
2:39
I always do this before adding any files
to Git to spare myself some trouble
2:42
later on.
2:46
So to demonstrate this, I'm gonna create
a file that I don't want to add to Git and GitHub.
2:47
So let's click New File at the root of
our folder and name it ignore_me.html.
2:52
Inside of this file, I'm going to use
the Emmet shortcut to add some boilerplate
3:00
HTML by typing an exclamation point and
pressing Tab.
3:05
Let's save that and
now let's create our .gitignore file.
3:09
Inside, I'm going to simply type,
ignore_me.html.
3:19
Let's also add some common files
we would normally want to ignore.
3:25
I use an extension with Visual Studio code
that sometimes creates a .vscode folder,
3:29
so let's add that,
3:33
and if you're on a Mac,
adding .DS_Store is always a good idea.
3:35
I won't be installing any
dependencies with this project, so
3:41
don't worry if you don't understand
what that means yet, but
3:44
a very important folder to ignore in
later projects will be node_modules.
3:47
So let's type node_modules/.
3:52
The trailing / is telling .gitignore
that this is a directory, or
3:57
folder, and we wanna also
ignore everything inside of it.
4:01
Let's save this file with Command S
on Mac, or Ctrl S on Windows,
4:06
you'll now notice that
ignore_me.html is not colored or
4:11
tagged as untracked like
the other files anymore, perfect.
4:16
Next, let's stage our first commit
that we'll soon push to GitHub.
4:21
Let's run the command git add ., this dot
is telling it to add all of the folders
4:26
and files in this directory unless they're
listed in the .gitignore, of course.
4:30
You could also specify a certain file or
folder name instead of the dot, but
4:36
most of the time, I just use the dot.
4:40
Now you can see they're
all tagged as added.
4:43
Next, run the command git
commit -m "initial commit".
4:46
We should always provide a helpful commit
message within those double quotes
4:51
stating changes that we've
made since our last commit,
4:56
but for this first one
I'll just use initial commit,
5:00
now our project files are staged and
ready to push.
5:04
The next step is to create
a new repository on GitHub.
5:09
Go to github.com and
log into your GitHub account.
5:12
If you don't have an account,
you'll need to sign up for one.
5:16
Check the teacher's notes below for
5:19
a link to a video showing you
how to complete that process.
5:21
Once you're logged in, click on the New
button to create a new repository.
5:25
Don't worry if your screen looks
a little different than mine,
5:31
the process will be the same and you can
always check the teacher's notes for
5:34
any updates and changes.
5:37
Give your repository a short and
descriptive name.
5:39
I'll name mine my-random-quote
generator with no spaces.
5:42
You can also add a description here.
5:48
I'll say, my first project submission for
the full stack JavaScript Tech degree.
5:50
Here's where you can set your
repo to be public or private.
5:57
I'm going to leave it as public so
that others can review and
6:01
grade it when I'm ready to submit.
6:04
You can also initialize the repo with
a README file, a .gitignore file, and
6:07
a license.
6:12
I'm going to leave those all blank for now
and click the Create Repository button.
6:14
Awesome, we've now created
our GitHub repository.
6:20
GitHub is now providing us with some
convenient commands we can use to make
6:24
this process much easier and faster.
6:27
We can see this second block
of commands is titled or
6:30
push an existing repository from the
command line, that's exactly what we want.
6:34
Let's click this Copy
button here on the right.
6:41
Now, back in our Terminal, we can paste
them all with Command V on Mac or
6:44
Control V on Windows.
6:48
These first two commands will set up the
connection to our GitHub repository and
6:50
main branch.
6:54
The third command will push
our staged commit for us.
6:55
Let's hit Enter and
refresh our GitHub page.
6:59
Our project files have been uploaded
to our GitHub repo successfully, nice.
7:07
Now, let's see how we go about pushing new
changes after we've completed some work on
7:13
our project.
7:17
For this example,
I'm just going to make a small change.
7:18
I'm gonna create an array, which will
eventually hold my quote objects.
7:22
If I save this change,
you'll see the file changes to yet
7:40
another color and is tagged as modified.
7:43
Back in our terminal,
let's again run the command git add ..
7:50
Then, git commit -m "started
creating my quotes array".
7:58
Now because of those three
helpful commands we copied and
8:06
pasted from GitHub earlier,
all we have to type now is git push.
8:09
Finally, let's refresh our GitHub page,
and we can see if the changes have been
8:18
successfully pushed to
our GitHub repository.
8:23
There's the commit we just pushed,
perfect.
8:27
From here on out, we only need to
use those last three commands,
8:29
git add ., git commit -m "commit message",
and git push, and that's it.
8:33
Now you know how to initialize a new Git
repository, stage and commit changes, and
8:38
connect it to a remote repo on GitHub
using the Terminal, congratulations.
8:43
I hope this video was helpful and
8:48
removed some of the fear that can
come with using the Terminal.
8:50
Refer back to this video
whenever you need a refresher,
8:54
but this will all become second
nature after doing it a few times,
8:58
we'll see you next time,
9:01
and until then, happy coding!
9:02
You need to sign up for Treehouse in order to download course files.
Sign upYou need to sign up for Treehouse in order to set up Workspace
Sign up