1
00:00:00,370 --> 00:00:04,910
GitHub also gives you the option to host
your websites as user pages websites.
2
00:00:04,910 --> 00:00:08,430
User pages websites are nearly identical
to the Project Pages websites I
3
00:00:08,430 --> 00:00:09,590
covered earlier.
4
00:00:09,590 --> 00:00:12,430
The only differences
are that as a GitHub user,
5
00:00:12,430 --> 00:00:15,720
you're allowed one free user
pages website per account.
6
00:00:15,720 --> 00:00:18,860
Not every repository can
have its own user website.
7
00:00:18,860 --> 00:00:22,880
That's because user pages use your
accounts user name in the URL.
8
00:00:22,880 --> 00:00:27,480
Your URL will look like this, the user
name followed by the github domain.
9
00:00:27,480 --> 00:00:32,030
And unlike project pages, you don't
create a gh-pages branch for user pages.
10
00:00:32,030 --> 00:00:35,120
You just place the files in the master
branch of the repository and you're done.
11
00:00:36,370 --> 00:00:40,300
This makes user pages ideal for
hosting your portfolio website.
12
00:00:40,300 --> 00:00:43,380
So in this video the steps I'm
going to take to host my site
13
00:00:43,380 --> 00:00:47,840
as a user pages website are,
first initialize a local repository for
14
00:00:47,840 --> 00:00:53,060
the project, then add the repository to
GitHub using a specific naming convention.
15
00:00:53,060 --> 00:00:55,660
Then we'll wait for
GitHub pages to build the site.
16
00:00:55,660 --> 00:00:58,540
Again, it usually takes
no more than ten minutes.
17
00:00:58,540 --> 00:00:59,060
Let's get to it.
18
00:01:00,350 --> 00:01:03,460
With user pages,
you create a brand new repository.
19
00:01:03,460 --> 00:01:05,770
And all the repository's for
is your website.
20
00:01:05,770 --> 00:01:08,310
You don't even need to
create a GH pages branch
21
00:01:08,310 --> 00:01:10,240
like you need to with project pages.
22
00:01:10,240 --> 00:01:14,620
So I'm gonna create my user pages
repository using my GitHub account, and
23
00:01:14,620 --> 00:01:16,520
all my website files will be hosted here.
24
00:01:18,060 --> 00:01:20,880
So first up,
like I did earlier with project pages,
25
00:01:20,880 --> 00:01:24,320
I need to initialize
a local git repository for
26
00:01:24,320 --> 00:01:27,660
my courses website project
that's in my home directory.
27
00:01:27,660 --> 00:01:31,500
So back in the terminal I'll navigate
to the courses directory by typing
28
00:01:31,500 --> 00:01:34,800
the command cd courses.
29
00:01:34,800 --> 00:01:37,930
For this lesson I deleted
the local git repository and
30
00:01:37,930 --> 00:01:41,630
branch I created earlier for
the project pages website.
31
00:01:41,630 --> 00:01:43,430
So here I'm starting fresh.
32
00:01:43,430 --> 00:01:46,270
Now to learn how to do that be sure to
take a look at the teacher's notes.
33
00:01:47,300 --> 00:01:49,620
So you'll notice that
if I run a git status
34
00:01:51,390 --> 00:01:54,550
it tells me there's no git repository for
this project.
35
00:01:54,550 --> 00:02:00,440
So now to initialize a new git repository,
I can type the command git init and
36
00:02:01,500 --> 00:02:06,410
this creates a new empty git repository
on my computer for the course's project.
37
00:02:07,550 --> 00:02:13,060
And if I run I git status now it lists
all my project files as untracked files.
38
00:02:13,060 --> 00:02:18,530
So now I need to tell git to add these
files to staging by typing the command git
39
00:02:18,530 --> 00:02:20,370
add followed by a period.
40
00:02:21,890 --> 00:02:27,200
And then I'll commit them
by typing git commit -m,
41
00:02:27,200 --> 00:02:30,410
and as the commit message I'll say,
initial commit.
42
00:02:34,240 --> 00:02:39,020
So now that I've committed my files to the
local git repository, I need to go to my
43
00:02:39,020 --> 00:02:42,510
GitHub account and create a remote
repository for this project.
44
00:02:44,000 --> 00:02:49,380
So back in my GitHub account,
I'll click New to create a new repository.
45
00:02:49,380 --> 00:02:51,190
And as the repository name,
46
00:02:51,190 --> 00:02:56,890
I have to use a specific naming convention
GitHub requires for user pages websites.
47
00:02:56,890 --> 00:03:03,740
So, I'm going to name mine gilh.github.io.
48
00:03:03,740 --> 00:03:08,140
So the account username
followed by the GitHub domain.
49
00:03:08,140 --> 00:03:09,880
Go ahead and use your account name here.
50
00:03:11,530 --> 00:03:15,700
So next, if I leave initialize
with a README unchecked and
51
00:03:15,700 --> 00:03:17,890
click Create repository,
52
00:03:17,890 --> 00:03:21,530
the next page gives me the commands
I need to create a remote repository.
53
00:03:23,150 --> 00:03:27,490
So now I want to create the repository
by pushing an existing repository
54
00:03:27,490 --> 00:03:28,690
from the command line.
55
00:03:28,690 --> 00:03:35,210
So if I copy these commands here and
paste them in the terminal.
56
00:03:35,210 --> 00:03:39,470
Once I hit Enter, Git pushes
the files from my local repository
57
00:03:39,470 --> 00:03:42,420
to this remote GitHub repository.
58
00:03:42,420 --> 00:03:45,610
And any changes I push to this
repository will show up on the website.
59
00:03:46,990 --> 00:03:50,460
So GitHub is now building
my user pages website.
60
00:03:50,460 --> 00:03:53,560
And as I mentioned earlier it usually
takes no longer than ten minutes to
61
00:03:53,560 --> 00:03:55,960
view the site with
the GitHub pages domain.
62
00:03:55,960 --> 00:03:56,860
So let's try it out.
63
00:03:58,460 --> 00:04:05,030
So he URL for
my website is guilh.github.io,
64
00:04:05,030 --> 00:04:08,691
so the account username followed
by the GitHub pages domain.
65
00:04:10,782 --> 00:04:14,480
All right great, so now my website
is hosted as a user pages website.
66
00:04:16,330 --> 00:04:20,140
And making changes to your user
pages website is also simple.
67
00:04:20,140 --> 00:04:23,900
First, you make the changes to your
project in your local project folder,
68
00:04:23,900 --> 00:04:26,470
then you push those changes
to the master branch
69
00:04:26,470 --> 00:04:28,420
of your user pages website repository.
70
00:04:29,610 --> 00:04:31,120
So like I did in the previous video,
71
00:04:31,120 --> 00:04:34,830
I'm going to add some of my latest
Treehouse workshops to this page.
72
00:04:36,570 --> 00:04:40,730
So I'll simply open up
the project's index.html file and
73
00:04:40,730 --> 00:04:44,240
then I'll paste in the code for
the workshops, and hit Save.
74
00:04:44,240 --> 00:04:47,549
All right, so now I'm ready to
publish these changes on GitHub Pages.
75
00:04:48,590 --> 00:04:52,870
So back in terminal,
if I run the git status command,
76
00:04:52,870 --> 00:04:56,040
it lists the modified index.html file.
77
00:04:56,040 --> 00:05:00,040
So next I'm going to add
the changes to my staging are and
78
00:05:00,040 --> 00:05:05,870
commit them to my local
repository by typing git add.
79
00:05:05,870 --> 00:05:11,136
And then I'll commit them
by typing commit -m, and
80
00:05:11,136 --> 00:05:16,415
as the commit message I'll write,
add workshops.
81
00:05:19,775 --> 00:05:24,444
And finally I'll push the changes
up to the remote GitHub
82
00:05:24,444 --> 00:05:28,830
repository with the command
git push origin master.
83
00:05:31,593 --> 00:05:34,949
So now if I go back to my website and
refresh it,
84
00:05:34,949 --> 00:05:38,320
great, my latest changes
show up on the site.