WEBVTT

0
00:00.630 --> 00:02.190
In the last lesson, we looked at

1
00:02.190 --> 00:05.100
how we can push our Local Repository

2
00:05.100 --> 00:07.770
to a Remote Repository on GitHub.

3
00:07.770 --> 00:09.840
Now, in this lesson, I want to talk about

4
00:09.840 --> 00:14.840
cloning a Remote Repository on GitHub to pull it

5
00:15.030 --> 00:18.720
onto your Local Repository on your machine.

6
00:18.720 --> 00:23.720
So this is called cloning, and the command is git clone.

7
00:23.910 --> 00:27.360
And this is a way for you to pull down all of the versions

8
00:27.360 --> 00:31.290
and all of the commits of a particular remote repository,

9
00:31.290 --> 00:35.880
and to store the files in your own working directory.

10
00:35.880 --> 00:37.650
So once you've cloned a repo,

11
00:37.650 --> 00:39.570
you've essentially made a copy of it

12
00:39.570 --> 00:42.120
on your own local working environment,

13
00:42.120 --> 00:44.730
and it allows you to stand on the shoulder of giants

14
00:44.730 --> 00:47.460
and continue where they left off.

15
00:47.460 --> 00:49.260
So you won't need to clone it again

16
00:49.260 --> 00:50.580
during regular development,

17
00:50.580 --> 00:54.450
you'll continue on your own branch of that project.

18
00:54.450 --> 00:57.810
So why would you need to clone someone else's project?

19
00:57.810 --> 01:00.660
Well, it's basically so that you can have your own copy

20
01:00.660 --> 01:02.490
of a program that they wrote.

21
01:02.490 --> 01:05.490
Maybe you want to customize it to your own needs.

22
01:05.490 --> 01:08.160
Maybe the program needs to do something it currently

23
01:08.160 --> 01:11.520
doesn't do, and you want to extend its functionality.

24
01:11.520 --> 01:14.700
Or maybe you just found a bug and you want to fix it.

25
01:14.700 --> 01:17.100
So essentially, it allows you to leverage

26
01:17.100 --> 01:19.620
somebody else's open source code,

27
01:19.620 --> 01:22.980
so they're putting their source code out onto the internet

28
01:22.980 --> 01:25.470
and you can simply make a copy of it,

29
01:25.470 --> 01:27.240
and continue where they left off.

30
01:27.240 --> 01:29.520
For example, a lot of people use

31
01:29.520 --> 01:32.220
self-hosted applications for their business.

32
01:32.220 --> 01:33.840
These are free versions of projects

33
01:33.840 --> 01:36.420
and services you might have to normally pay for,

34
01:36.420 --> 01:39.270
such as productivity and project management tools

35
01:39.270 --> 01:41.550
that are alternative to Jira

36
01:41.550 --> 01:45.750
or Trello or email servers like MailChimp.

37
01:45.750 --> 01:48.120
Instead of having to pay Mailchimp a ton of money,

38
01:48.120 --> 01:51.030
you can host your own email servers,

39
01:51.030 --> 01:53.400
or time tracking software for freelancers.

40
01:53.400 --> 01:57.600
And there's a ton, a ton, literal ton of different options

41
01:57.600 --> 02:02.430
and you can take a look through that in this GitHub README.

42
02:02.430 --> 02:04.230
Let's see how it works in practice.

43
02:04.230 --> 02:06.660
Let's clone some actual repo's from GitHub

44
02:06.660 --> 02:10.350
and run them locally to see how the entire process works.

45
02:10.350 --> 02:11.700
The command is pretty simple.

46
02:11.700 --> 02:16.470
It's simply git space clone space the url (git clone url).

47
02:16.470 --> 02:19.620
But the url will typically be from GitHub

48
02:19.620 --> 02:22.680
and it will look something like this.

49
02:22.680 --> 02:24.000
So what are we going to clone?

50
02:24.000 --> 02:26.010
Well, did you know that you can run

51
02:26.010 --> 02:30.240
the original Quake video game in your web browser?

52
02:30.240 --> 02:32.250
It's entirely built in JavaScript,

53
02:32.250 --> 02:33.780
so there'll be parts of it

54
02:33.780 --> 02:35.280
that you'll be able to read through,

55
02:35.280 --> 02:36.960
and you'll be able to understand.

56
02:36.960 --> 02:38.820
But there'll be a lot of work

57
02:38.820 --> 02:40.560
that's done to create this game.

58
02:40.560 --> 02:43.530
So thankfully, we don't have to build it from scratch.

59
02:43.530 --> 02:46.623
All we have to do is just to git clone.

60
02:47.490 --> 02:51.990
I go ahead, I grab the url to clone the repository,

61
02:51.990 --> 02:55.110
and in my terminal I can write git clone

62
02:55.110 --> 02:56.823
and paste in that url.

63
02:58.050 --> 03:00.690
Now, once it receives all of the objects,

64
03:00.690 --> 03:03.360
and it gets loaded onto my own computer,

65
03:03.360 --> 03:08.360
then I can go ahead and cd into the repository, quakejs.

66
03:08.730 --> 03:11.163
And once I'm inside that repository,

67
03:12.210 --> 03:15.000
I can install all of the NPM packages

68
03:15.000 --> 03:16.953
by running "npm install".

69
03:17.940 --> 03:20.940
And then the next step as they describe in the documentation

70
03:20.940 --> 03:25.410
is I need to set the content .quake.js.com

71
03:25.410 --> 03:26.670
as the content server.

72
03:26.670 --> 03:28.950
So I'm just going to simply copy this entire line

73
03:28.950 --> 03:31.770
of commands and paste it into my terminal.

74
03:31.770 --> 03:35.100
Now, once I'm done, I can simply run the server using Node

75
03:35.100 --> 03:38.280
by again pasting this line of commands.

76
03:38.280 --> 03:40.080
And once it starts,

77
03:40.080 --> 03:45.080
you can see that, "web server is now listening on port :::8080".

78
03:45.450 --> 03:48.060
And so now I can go to that port

79
03:48.060 --> 03:50.613
and check out the Quakejs game.

80
03:52.830 --> 03:55.560
So making sure that your url is the same

81
03:55.560 --> 03:59.040
as the one that they have set in their documentation,

82
03:59.040 --> 04:00.330
go ahead and agree,

83
04:00.330 --> 04:03.150
and you'll see once everything's loaded up,

84
04:03.150 --> 04:06.960
the original Quake game running on your browser.

85
04:06.960 --> 04:09.300
But more importantly, you are running it

86
04:09.300 --> 04:12.630
from the code that you cloned from GitHub.

87
04:12.630 --> 04:15.150
So feel free to have a play around with the game.

88
04:15.150 --> 04:18.840
It's pretty cool and it's very retro.

89
04:18.840 --> 04:19.940
And there you have it.

90
04:21.420 --> 04:24.357
Now another example is Wordle.

91
04:24.357 --> 04:28.140
Wordle is basically a word game where you have to guess

92
04:28.140 --> 04:31.740
a five letter word using just six tries,

93
04:31.740 --> 04:34.140
and it went completely viral a few years ago,

94
04:34.140 --> 04:36.630
and eventually got bought by the New York Times.

95
04:36.630 --> 04:39.510
And the official Wordle is now accessed

96
04:39.510 --> 04:41.010
at the New York Times

97
04:41.010 --> 04:44.340
alongside all of their different crosswords and puzzles.

98
04:44.340 --> 04:47.970
But somebody has created all the code for Wordle,

99
04:47.970 --> 04:52.500
and we can clone it and run it on our own system.

100
04:52.500 --> 04:56.430
So again, grabbing hold of the URL at the GitHub repository,

101
04:56.430 --> 04:58.020
you can see it's entirely created

102
04:58.020 --> 05:00.240
in Python and uses Tkinter.

103
05:00.240 --> 05:02.550
So all the things that we know about,

104
05:02.550 --> 05:04.380
we can head back to our terminal,

105
05:04.380 --> 05:08.133
use git clone to clone from that url,

106
05:09.720 --> 05:11.580
and then we open the folder

107
05:11.580 --> 05:14.103
and set up our virtual Python environment.

108
05:16.440 --> 05:18.330
And the reason why they created it is

109
05:18.330 --> 05:19.950
because the original game only allows

110
05:19.950 --> 05:21.240
you to play one word per day,

111
05:21.240 --> 05:24.237
but what if you get entirely addicted to Wordle

112
05:24.237 --> 05:26.250
and you want to play more than one word per day?

113
05:26.250 --> 05:29.640
Well, you're in luck because you know how to clone

114
05:29.640 --> 05:33.030
the program and run it on your own system.

115
05:33.030 --> 05:35.400
Now all we have to do is just to install

116
05:35.400 --> 05:37.860
all of the required modules,

117
05:37.860 --> 05:40.740
and once that's done, we can click on play

118
05:40.740 --> 05:43.353
and the game will start in a separate window.

119
05:44.400 --> 05:48.450
Go ahead, have a guess, see what you have.

120
05:48.450 --> 05:53.450
And my personal starting word, top secret is usually, NOTES

121
05:53.670 --> 05:56.520
or another word with R and T and S.

122
05:56.520 --> 05:58.800
But have fun playing with that.

123
05:58.800 --> 06:00.840
And you can dig through the code,

124
06:00.840 --> 06:02.880
you can change it from Wordle game

125
06:02.880 --> 06:04.800
to anything else you want to call it.

126
06:04.800 --> 06:06.360
Or you can change the colors.

127
06:06.360 --> 06:08.730
You can modify the code base,

128
06:08.730 --> 06:11.910
because you now own it on your own computer,

129
06:11.910 --> 06:13.470
and you can run it,

130
06:13.470 --> 06:15.390
and you can modify it.

131
06:15.390 --> 06:17.820
And you can see just how cool it is

132
06:17.820 --> 06:22.140
to be able to simply clone somebody else's entire code base

133
06:22.140 --> 06:23.910
that they've made open source

134
06:23.910 --> 06:26.223
for you to continue developing on it.

135
06:27.420 --> 06:30.390
So look through the code, open it up,

136
06:30.390 --> 06:33.480
and take a look inside the word files

137
06:33.480 --> 06:36.000
to see all of the available words.

138
06:36.000 --> 06:37.680
There's no cheating here.

139
06:37.680 --> 06:39.900
And you'll be able to see the actual code

140
06:39.900 --> 06:41.790
that makes this game run.

141
06:41.790 --> 06:44.370
So you can see it's just simple Python

142
06:44.370 --> 06:46.440
which you know all about.

143
06:46.440 --> 06:48.720
And some of these things you might not understand.

144
06:48.720 --> 06:52.710
But through studying somebody else's code and modifying it,

145
06:52.710 --> 06:56.040
it usually makes you a much better developer.

146
06:56.040 --> 06:59.610
Go ahead, try to improve your own version,

147
06:59.610 --> 07:04.020
make it a 2.0 Wordle, whatever that means to you.

148
07:04.020 --> 07:08.550
And this is a big part of your developer journey.

149
07:08.550 --> 07:11.790
One of the best ways to improve your programming skills

150
07:11.790 --> 07:15.540
is to read other people's code to understand

151
07:15.540 --> 07:18.270
what their code is doing, and most importantly,

152
07:18.270 --> 07:21.240
try to modify it just a little bit

153
07:21.240 --> 07:24.690
at the beginning and maybe a lot more in the future.

154
07:24.690 --> 07:27.840
But it gives you a way to level

155
07:27.840 --> 07:31.950
up your skillset by building on top of somebody else's work.

156
07:31.950 --> 07:36.950
And open-source code is a great way to get started.

157
07:37.080 --> 07:39.750
You can clone somebody's repository,

158
07:39.750 --> 07:41.730
take a look at some of the more interesting ones

159
07:41.730 --> 07:46.530
that we've listed here such as Wordle or Jarvis.

160
07:46.530 --> 07:49.710
See roughly how things work and see if there are

161
07:49.710 --> 07:53.010
just small things that you might want to change about it.

162
07:53.010 --> 07:57.750
And this will lead you onto a very important step

163
07:57.750 --> 07:59.670
on your developer journey,

164
07:59.670 --> 08:04.140
which is contributing to open source code.

165
08:04.140 --> 08:06.060
Now, there's a lot of projects,

166
08:06.060 --> 08:07.410
there's even a list of projects

167
08:07.410 --> 08:12.210
on GitHub where they have curated some projects

168
08:12.210 --> 08:16.620
which are particularly welcoming to first time contributors.

169
08:16.620 --> 08:18.990
So teams which are open

170
08:18.990 --> 08:22.800
for first timers or beginners to contribute.

171
08:22.800 --> 08:26.040
And you can take a look at that by going to

172
08:26.040 --> 08:29.460
awesome-for-beginners, this particular repository,

173
08:29.460 --> 08:31.800
and take a look through the README.

174
08:31.800 --> 08:34.800
Take a look at maybe the pandas module

175
08:34.800 --> 08:37.680
or take a look at Jarvis or Matplotlib.

176
08:37.680 --> 08:39.780
You can contribute to all of these,

177
08:39.780 --> 08:42.870
but in order to know how to make a contribution,

178
08:42.870 --> 08:47.340
you need to learn about pull requests, branches, and merging

179
08:47.340 --> 08:51.420
which is exactly what we'll cover in the upcoming lessons.

180
08:51.420 --> 08:54.183
So for all of that and more, I'll see you there.