1.3 Starting the project - Video Tutorials & Practice Problems
Video duration:
4m
Play a video:
Video transcript
<v Instructor>Now that we have a basic idea</v> about the vocabulary of HTML, namely tags surrounding content, let's actually deploy an HTML file to the live web. We'll start with the same basic steps we followed in "Learn Enough Git to be Dangerous." So let's start with a sample website directory. Mkdir -p lets us create intermediate directories if necessary. So let's repos/sample_website. And now I wanna initialize the repository. And remember, in order to do that, you have to have some file in the repo. So right now it's empty. My favorite trick is just to touch a file. And in this case, we'll use the name index.html, which is the standard file name for the main page in a website. See here, oops, it's not initialized, right? So git init. Git status. You can see here you can add everything. There's only one file, but add -A works. And then we can commit it. And now we're going to push it up to GitHub pages so that it is available on the live web. Look into that. Here's the page for a new repository, and I'll just do this under my username. The one shown in the tutorial is under the learn enough username, but that actually already exists. This is good that I can use my username because this repo name is available. You can see this green check mark here. And you can actually make this private and still have it be available on the web. But pretty much everything in this repo is going to be available on the web, so I'm just gonna leave this as public. And let's create it. And now I wanna push it up, right? So get remote add origin. Just gonna copy this. Actually, look at that. GitHub actually has that there. So I can paste it in and then push it up. I mean, actually I didn't wanna do that, though, because ordinarily you would just follow what GitHub says to do, but in this case we actually want the gh-pages branch. So it's okay that I push it up, but we're not gonna work on the master branch. We're gonna work on gh-pages. So we need checkout -b to make a new branch. And then I'll push this one up. So this is this. Origin gh-pages. And now GitHub pages has published this website. It's at your username. So this is mhartl.github.io slash the name of the repo, which is sample, what was it? Sample website? Yeah. All right, well, it's working. It's not very exciting 'cause there's nothing there yet, but we'll fix that up in the next section. This is still a huge accomplishment, though, because we've actually got a working website, even though it's empty. You can see here... Actually, let me do this. I'm gonna use curl. This is a nice little trick. Curl dash capital I just returns the head of the document. So this is... Or it's not the head of the document. It's the head of the response. So this is the HTTP response 200 OK. That means it's there. So if I were to try something else, say, sample_websit, it's gonna give me an error 404 Not Found. This is pretty cool. This shows us that we actually have a website, even though the browser is empty right here.