In the last lesson, we looked at how we can push our local repository to a remote repository on GitHub. 1
Now, in this lesson, I want to talk about cloning a remote repository on GitHub to pull it onto your 2
local repository on your machine. 3
So this is called Cloning and the command is, "git clone". 4
And this is a way for you to pull down all of the versions and all of the commits of a particular remote 5
repository and to store the files in your own working directory. 6
So once you've cloned a repo, you've essentially made a copy of it on your own local working environment 7
and allows you to stand on the shoulders of giants and continue where they left off. So you won't need 8
to clone it again during regular development. 9
You'll continue on your own branch of that project. 10
So why would you need to clone someone else's project? 11
Well, it's basically so that you can have your own copy of a program that they wrote. 12
Maybe you want to customize it to your own needs. 13
Maybe the program needs to do something it currently doesn't do and you want to extend its functionality. 14
Or maybe you just found a bug and you want to fix it. 15
So essentially it allows you to leverage somebody else's open source code. 16
So they're putting their source code out onto the internet and you can simply make a copy of it and 17
continue where they left off. 18
For example, a lot of people use self-hosted applications for their business. 19
These are free versions of products and services you might have to normally pay for, such as productivity 20
and project management tools that are alternative to Jura, or Trello, or email servers like MailChimp. 21
Instead of having to pay MailChimp a ton of money, you can host your own email service or time tracking 22
software for freelancers, and there's a ton, a ton literal ton of different options and you can take 23
a look through that in this GitHub README. 24
Let's see how it works in practice. 25
Let's clone some actual repos from GitHub and run them locally to see how the entire process works. 26
The command is pretty simple. 27
It's simply git space, clone space, 28
the URL (git clone 'url'). The URL will typically be from GitHub and it will look something like this. 29
So what are we going to clone? 30
Well, did you know that you can run the original Quake video game in your web browser? 31
It's entirely built in JavaScript, so there will be parts of it that you'll be able to read through 32
and you'll be able to understand, 33
but there will be a lot of work that's done to create this game, so... 34
Thankfully, we don't have to build it from scratch, 35
all we have to do is just to get clone. 36
I go ahead, I grab the URL to clone the repository and in my terminal, I can write git clone and paste 37
in that URL. 38
Now once it receives all of the objects and it gets loaded onto my own computer, then I can go ahead 39
and cd into the repository quake.js, 40
and once I'm inside that repository, 41
I can install all of the NPM packages by running "npm install". And then the next step as they described 42
in the documentation, is I need to set the "content.quakejs.com" as the content server. 43
So I'm just going to simply copy this entire line of commands and paste it into my terminal. 44
Now once I'm done, I can simply run the server using Node by again pasting this line of commands. 45
And once it starts you can see that web server is now listening on port 8080. 46
And so now I can go to that port and check out the QuakeJS game. 47
So making sure that your URL is the same as the one that they have set in their documentation, 48
go ahead and agree and you'll see once everything's loaded up the original Quake game running on your 49
browser, 50
but more importantly, you're running it from the code that you cloned from GitHub. 51
So feel free to have a play around with the game. 52
It's pretty cool and it's very retro. 53
And there you have it. 54
Now another example is Wordle. 55
Wordle is basically a word game where you have to guess a five-letter word using just six tries. 56
And it went completely viral a few years ago and eventually got bought by The New York Times. 57
And the official Wordle is now accessed at the New York Times alongside all of their different crosswords 58
and puzzles. 59
But somebody has created all the code for Wordle, and we can clone it and run it on our own system. 60
Again, grabbing hold of the URL at the GitHub repository for Word Mastermind, you can see it's entirely 61
created in JavaScript, HTML and CSS. 62
So all the things that we know about, we can head back to our terminal, use "git clone" to clone from 63
that URL, and then again cd into the word-mastermind. 64
And the reason why they created it is because the original game only allows you to play one word per 65
day, 66
but what if you get entirely addicted to Wordle and you want to play more than one word per day? 67
Well, you're in luck because you know how to clone the program and run it on your own system. 68
Now all we have to do is just go back, use "npm install" to install all of the required modules, 69
and once that's done, 70
we can use the command npm start as they describe in the documentation, and it will show us the location 71
of our server. 72
So if we just click on it, open it inside Chrome, you'll see Word Mastermind running in the browser. 73
Go ahead, 74
have a guess, 75
see what you have, 76
and my personal starting, word top-secret is usually Notes or another word with R and T and S. But 77
have fun playing with that and you can dig through the code. 78
You can change it from Word Mastermind to anything else you want to call it. 79
Or you can change the colors. 80
You can modify the code base because you now own it on your own computer, and you can run it, and you 81
can modify it. And you can see just how cool it is to be able to simply clone somebody else's entire 82
code base that they've made open source for you to continue developing on it. 83
So look through the code, open it up and take a look inside the dict folder to see all of the available 84
words. 85
There's no cheating here. 86
They've also got other languages, and if you look inside the source folder, you'll be able to see 87
the actual code that makes this game run. 88
So you can see it's just simple JavaScript, which you know all about, 89
and some of these things you might not understand, but through studying somebody else's code and modifying 90
it, it usually makes you a much better developer. 91
Go ahead, try to improve your own version, make it a 2.0 Wordle, whatever that means to you. 92
And this is a big part of your developer journey. 93
One of the best ways to improve your programming skills is to read other people's code, to understand 94
what their code is doing, and most importantly, try to modify it just a little bit at the beginning 95
and maybe a lot more in the future, 96
but it gives you a way to level up your skill set by building on top of somebody else's work. 97
And open source code is a great way to get started. 98
You can clone somebody's repository. 99
Take a look at some of the more interesting ones that we've listed here, such as Wordle or Quake. 100
See roughly how things work and see if there are just small things that you might want to change about 101
it. 102
And this will lead you onto a very important step on your developer journey, which is contributing 103
to open source code. 104
Now there's a lot of projects. 105
There's even a list of projects on GitHub where they have curated some projects which are particularly 106
welcoming to first time contributors. 107
So teams which are open for first timers or beginners to contribute. 108
And you can take a look at that by going to awesome-for-beginners, this particular repository and take 109
a look through the README. 110
Take a look at maybe the AncientBeast game, which is a Turn based strategy game, 111
or take a look at the Brave Browser which has this concept of rewarding creators with crypto and providing 112
an alternative to advertisement in browsers. 113
You can contribute to all of these, but in order to know how to make a contribution, you need to learn 114
about Pull Requests, Branches and Merging, which is exactly what we'll cover in the upcoming lessons. 115
So for all of that and more, I'll see you there.