BRIAN YU: Welcome back to CS50 Beyond.

Hope you all enjoyed lunch.

Feel free to help yourself to pizza now still, if you'd like,

as we go through this afternoon.

A bit of a change of pace this afternoon.

So we spent the morning talking about HTML and CSS,

which you had seen in CS50, but we went a little bit beyond that,

looking at other features of HTML and CSS and more modern versions of both.

What we're going to do this afternoon is take a look at Git.

And so just for show of hands--

actually, let's do via the faces.

If you've used Git before and you feel comfortable with it, green smiley face.

If you've never used it before, red frowny face.

If you're somewhere in between, yellow.

OK, so sort of all over the place.

A bunch of people have used it before.

A bunch of people have never used it before.

So if you've never used it before, this will be a good introduction.

Even if you have used it before, hopefully you'll

get a bit more of an understanding of it here.

Git is what we call a piece of version control software.

It's software designed to help us manage and track

different versions of our code.

And it is incredibly helpful.

If you ever go on to take future computer science classes,

or you go and work for a computer science internship,

or work in computer science industry, you will almost definitely

be using Git as your means of keeping track

of different versions of your projects.

And so it's good to have an understanding of it and how it works.

So today is going to be a bit of an introduction to that,

give you an opportunity to see the various features of it,

get an opportunity to practice with it hands-on later on this afternoon.

And then in the latter part of the afternoon,

we'll also take a look at SaaS, which is a way

to generate CSS code, which we'll take a look at in a moment as well.

But questions before we begin on anything from this morning,

anything about the structure of the class

or, logistics of what's going to happen this afternoon?

All right.

Let's go out and get started then.

So we're talking about Git today, and Git

is a piece of version control software, as I mentioned.

And it's good for a number of different things.

So the first thing that Git is particularly good for

is for keeping track of changes you make to your code.

I remember when I first took CS50, I would

be working on a problem in the problem set,

and I would work and get like part of it working, but not quite.

But I'd be afraid that if I added more, I would

break the stuff I had already done.

So I'd save a duplicate copy of the code somewhere,

make changes to another copy, and pretty soon, you

have four or five different copies of the same program that

are all slightly different, and they just

become a little bit tough to keep track of.

Maybe some of you had similar experiences, definitely

something that happened to me.

This is before I learned how to use Git, which is primarily

designed for trying to deal with problems like this, keeping

track of changes you make to your code, such that you have a full revision

history, so to speak, of all the changes you make.

So you might have initially created a file, made some changes to the file,

added a line to the file, removed a line from the file.

And Git is going to help keep track of all of those different changes we

make to the code so that we have a record of all the changes we've made.

Another thing that Git is particularly good for

is for synchronizing code between different people.

So you might imagine that you have some file

that you and a collaborator, a partner, are working together on.

Maybe it's a partner you're working on in a problem set in a class together,

or a bunch of people that you're working with on the same software project,

if you're working for the same company, for instance,

and you're sharing some file that you're working on together.

And what Git makes it easy to do is to give both you and your partner

the same version of that file, such that you can both independently be making

modifications to that file, change different parts of that file,

and then eventually synchronize them back up

together in some sort of central server, such

that you can both then get that updated version of the file, where the idea is

you can both be independently making changes to the code,

synchronize them somewhere so that you both have access to the latest version.

No more emailing, like, this is the latest version, use that one.

And then there are conflicting versions being emailed around

and that starts to become messy.

Git helps to just simplify that process, keep track of everything

much more cleanly.

Another thing that Git is good for is it's

good at testing changes to your code without losing

the original copy of the code.

So you might have something that's working,

and you might want to add a new feature to your website, for instance.

So you might want to tackle the next part of the problem set.

But doing so might involve breaking the stuff you've already made

and you want to save that.

So what git makes it very easy to do is say,

branch off, a term that we'll explore more in just a moment.

But say, try something else for a little bit while keeping the original.

And only when we've tried it and it works and we're feeling comfortable

with it can we then merge it back in with the original code, such

that we now have the original version of whatever it

is that we were working with.

And finally, Git is very good at reverting back to old versions of code.

You've made some changes and you decide the feature

you have is not a feature that you want, or you decide that what you've done

has a mistake in it, a bug, you want to go back to a previous version.

It's very easy to just say, you know what?

Go back in the revision history.

Go back to a previous version of that file.

So questions about the goals here, the problems that we're trying to solve?

And then we'll introduce Git and see how it actually

goes about solving those problems.

All right, a website you may or may not be familiar with is called GitHub.

You should all have GitHub accounts that you made when you took CS50,

or in some other time.

And what GitHub is going to do is it's going

to be a website that's going to host what we call Git repositories.

And the word "repository" you can think of as just meaning a folder where we're

going to contain the code files that we're going to track, the code

that we want to keep track of different versions

of and synchronize between different people.

It's just a folder where you're going to store code.

And so GitHub is an online place to store those repositories,

such that you can put code there, and then different people

can access that same shared repository.

So I'll show you an example of that now.

I'll go ahead and go to github.com.

You'll be brought to an interface that looks something like this.

And in the upper right, you'll see a little Plus button.

If I click on that, there's a button there that says a New Repository.

So you click on that, New Repository.

You're going to give that repository a name.

I'll just call it Beyond for now.

You can give a description if you want.

You can make it public, meaning anyone can access it, anyone can see it.

You can also make it private.

GitHub recently allowed any user, even for free,

to create private repositories.

So if you don't want other people to be able to see it,

you can make it private as well.

I'll make this one public.

And you go in and create the repository.

And what this is going to do is just create

an empty folder, an empty repository, on GitHub servers,

wherein I can begin to store code, eventually.

So that's all I've done, created a new repository on GitHub's website.

So now, what are the commands that I can run on the command line

to interact with this Git repository?

Well, the first thing I need to do is this repository

is located on GitHub servers.

I want it on my computer so that I can begin adding files to it,

looking at the files that are in it, making modifications, and such.

And so a command that we're going to use is called git clone.

And so what git clone is going to do is if I have my computer here

and I have some server that's got the code that I want to clone locally

onto my computer, I run the command git clone, followed by the URL

are all of the repository.

And what that's going to do it's going to make a copy.

It's going to take the repository, locate it up somewhere on GitHub

servers, and it's going to copy it and bring it down onto my own computer

so that I have a copy of that repository on my local machine.

What questions do you have so far?

OK.

I'll actually do this so you can see what it looks like.

What I have here is a URL.

And there are going to be two different URLS, an HTTPS URL and an SSH URL.

If you set up SSH with GitHub-- there are

instructions for how to do that on the GitHub website-- you can use that URL.

That involves something called public-key cryptography, which

we'll talk about later in the week.

But if you haven't set that up, you're probably

safest using the HTTPS URL for now.

I'm going to use the SSH URL, but either will work.

And you'll go into your terminal.

I'll go to my desktop.

And I'm just going to type git clone, followed by that URL.

And that's going to do is it's going to clone that repository.

And it says, "Warning.

You appear to have cloned an empty repository."

But that's fine.

I know that the repository is empty.

But if I look at the folders that are inside of my desktop

right now-- recall that LS is a terminal command that stands for list,

list all the files and folders in this directory.

What I'll see is I have a directory now called

Beyond, the same name as the repository that I had just a moment ago.

If I move into the Beyond directory by typing CD--

CD for Change Directory, or move into a folder--

CD Beyond, I'm now inside the Beyond directory.

And if I type LS, nothing happens.

There's nothing inside of this folder.

But I have now cloned this folder so that I

have a copy of the repository on my computer.

So that's git clone.

Questions?

Yeah?

AUDIENCE: Sorry, can you show where you got the URL?

BRIAN YU: Yup.

So the question was, where did I get the URL?

When you create a new blank repository, you

should get a URL that shows up here.

If you have files in the repository, this interface

looks slightly different.

But there will be a dropdown where you can clone it

and there should be a link there as well.

So what I'd like to do now is add some files to this repository.

Maybe I want to put my website that I was creating this morning

inside of a gate repository, which would allow anyone to see it,

anyone to put modifications to it, allow multiple people to collaborate on it,

for instance.

And so to add something to a Git repository, the command we run

is just called git add.

And so quite simply what happens is that if I have a file,

and I make some changes to it and I want to add these changes to the next time

that I save a version of the repository--

and instead of save a version of the repository,

the terminology we're going to start using is the word "commit."