DOUG LLOYD: So in our video on PHP syntax, we talked a lot about how PHP can be used at the command line to run programs in a manner that we're pretty familiar with from C. But as I also mentioned in that video, PHP was initially developed to implement web programming, websites. And so in this video we're going to talk about how we use PHP in the web development context. 

We know, already, from our video on HTML, that websites are built out of a set of HTML tags that semantically define the structure of a web page. But websites that are built with pure HTML suffer from a very, very serious limitation. 

And to illustrate this limitation, let's consider the following. So now I want to build a web page that, whenever the user visits it, it gives me the current time in Cambridge, Mass., displaying it to the latest minute. If I was making this right now, I might say something like this. Current time in Cambridge-- so I have HTML tags, head tags, title tags, body tags-- the current time in Cambridge is 14:08, printing out military time. 

What happens if it's now 2:09 PM, 14:09? Well so far, with HTML, I have to go in and change it to 14:09. And then one minute later, I have to change it again. And then one minute later, I have to change it again. And as you can imagine, that's probably the worst job ever. You're the webmaster for a web page, and every minute, 24 hours a day, you need to update the current time by manually opening time.html and changing just that snippet of code to say the current time in hours and minutes. That's probably not a very good use of our resources, both human and computational. 

Websites that are all HTML are completely static. The only way you can update content, as we've just seen, is to manually open those source files, edit them, and save them. And then when the user refreshes the page, or visits the page for the first time, they'll get the latest content. But only because we've manually edited it. 

If we start to mix some PHP in there, our code can get a lot more flexible. And we can have a way for our pages to be dynamic, or update themselves, without requiring our poor webmaster in the previous example to be manually updating things. They can do it automatically. We don't have to intervene. We can get some sleep. Which is probably a good thing if you're doing a lot of web programming. 

So in CS50 IDE, we run a web server called Apache. It's a very commonly used, open source web server system. This system has the capacity to interpret PHP, which is going to be useful if you want to do any PHP programming. 

And in CS50 IDE, we have a command to make this very easy to do, apache50 start. And then that slash path, slash to, slash dir, that's just a really common way of indicating what you've specified here is a path to a particular directory that you want to be the root site, or the root page, or the folder from which your web server will start to examine files and serve them up to clients who request them. So let's pop over to CS50 IDE, just to show you, really quick, how this works. 

So here in CS50 IDE, I'm in a directory called Week Zero Nine. And I have two-- I have executed an LS command just above to show you that I have two directories in here, PHP, which is the set of files that I used in the PHP syntax video, and then PHP-web, which is the set of files that I would like to use in this video. 

And I would like to start a web server instance with the contents of the PHP-web folder as the files are being served up. So what am I going to do? I going to type apache50 space start, space PHP, dash web. That's the path to directory from where I currently am. Then I hit Enter. It's going to do a little bit of stuff here. And then it's going to say, Apache started successfully. Your site is now available at-- and then there's the URL for the site. So what am I going to do? I'm going to quickly copy this. And I'm going to open up-- and I'll zoom out a little bit here-- I'm going to open up a new tab in Chrome. And I'm going to visit that URL. 

I'm going to hit Enter. It's going to load. And I'll zoom out again. And we can see here is the contents of my PHP web directory. 

So now what is basically happening here is, my instance of CS50 IDE is serving up these files to anybody who requests them. And over the course of this video, we'll sort of take a look at a bunch of these different files in context. 

To test that your Apache server is working, which is generally going to be the case in CS50 IDE, but if you do this more generally, and you start building your own web servers, there's a really common sort of analog to, "hello world," that is usually used for PHP web development. Which is to have a file consisting of just this code-- a PHP delimiter set with PHP info, parentheses, semicolon in between. Which is basically a special PHP function that tells you what version of PHP you are running. 

So in CS50 IDE, I have that file available just to show you what this would look like. So I'm looking at my index from my PHP instance. My Apache instance is running the contents of PHP-Web. And I have a file here called info.php. 

I'm going to click it, zoom out. This is what you're going to see, pretty much. This is just telling me that my Apache server is working. And this is, apparently, the version of PHP that I'm running. This is my analog to "hello world." 

So I know things are operational. So we're good to go. We can proceed from here. 

So let's revisit that time example we were talking about with our poor webmaster who had to update the page constantly. This might be a fix for how I would implement things so that the webmaster didn't have to keep updating the time. It would just sort of happen automatically. 

The down below, the HTML, it's pretty similar, with one exception. But here I've got some PHP at the top. I have, apparently, called this function date_default_timezone_set. 

And we don't talk about all these functions in CS50, because PHP has probably tens of thousands. That might be a bit of an exaggeration, but it might not be. It's got a lot of functions built in. And so this is a function apparently sets my time zone as US/Eastern, which is the time zone that I'm currently in making this video. 

Then I make a call to function called, date. And, apparently, I'm storing the HIS of something called, time. So what's going on here? 

Well, basically what's happening is, I'm making a call to some server that is going to tell me what the time currently is. And I'm converting it to a format of hours, minutes, seconds. And the reason it's capital H is this is going to give me 24 hour time, not 12 hour time, which would be lowercase h. And I'm just storing that in a variable called, time. So that second line of PHP there, the call to the function, date, is just getting some string, which is going to give me the date, and the time, and a bunch of other information. And the first argument there, that HIS, is just extracting the important part that I care about for this example, which is the hour, minute, and second. So that's the all that's going on. So I store that in a variable $time. And then down at the very bottom there, I have that shorthand for printing out the current time. So I'm just going to print out what the current time is. 

So let's take a look at this in CS50 IDE and see how we're now saving that webmaster a lot of trouble. All right, so here I am again back at the root directory of my Apache instance. And I have a file here called time.php. I'm just going to click on that. And I'll scroll up, because we're zoomed in pretty far. The current time is 14:20:34. So I'm doing it hours, minutes, and seconds. And I can refresh the page and get new time. --41. I'm going to refresh the page and get new time, 44, 46, 47. 

So, I am clearly not changing anything myself. I'm here refreshing the page. So I can't be back there editing it. And I promise you, I don't have any confederates who are editing the file on my behalf on the side. 

I'm just using that PHP function, time, to generate the time for me automatically. So that even if I'm asleep, and my web server is running, the user who visits that page is still going to get exactly the current time. So that's pretty good. I've made my site more dynamic with not too much PHP code. It was just two lines of code and then a little bit of a print statement. And already I have a much more dynamic site than that first example we saw at the beginning of the video. 

So, recall from the video on PHP syntax that when the PHP interpreter runs our program, it ignores everything that's not inside of PHP delimiters, spitting it out. In that example, what the thing that it was spitting out was HTML. And this means I can now intersperse HTML and PHP together. Because the interpreter will just ignore the HTML and literally output it. Which is good, right? 

Because presumably, at the end of the day, I would like my site to be constructed of HTML. So that any web browser can interpret it, or understand the HTML on the page and render it as something that we can actually understand as humans. And I can only use PHP for the parts of my site the require dynamism, that require me to have things that update constantly. The static information can stay the same. 

OK, so that's fine. But why would I do this? Why would I mix HTML and PHP? I could just print out all the HTML, using the PHP print function. Why am I not doing that? Think about it for a second. 

Why, when I could just print out-- I could have lines of PHP that just say, print HTML tag, print head. Why am I not doing that? Why am I mixing the PHP and HTML? 

Well, if you think about it for a second. PHP, the interpreter has to interpret what it sees. And so it's going to have to execute a line of code. Print out HTML. Print out open head tag. Print out open title tag. It's going to have to execute and interpret that every single step of the way. Why not just let the interpreter just gloss over things it doesn't understand and do it automatically? It's going to save me a lot of time to mix my HTML and my PHP together. 

And so that's why we don't just have open PHP delimiter and then just print out the entire content of our page as one giant PHP call to the function, Print, and then close PHP delimiter and we're done. So that's why we mix them up together. 

So far, we haven't seen too much of a difference from general PHP syntax. It's been pretty straightforward. We've already seen the question mark, equal. We saw a couple of new function calls, but nothing really fancy going on. Let's maybe make things a little fancier. What if we want to pass information between different PHP files, so that maybe the user can submit information to me. And then I could do something with it on another page. 

So PHP has support for something called Super Global Variables, which sounds pretty awesome. They're really just giant associative arrays that help implement this functionality of passing information between PHP files that are existing on our web server. 

The first of these super globals is called $_GET. And it's probably the simplest to understand. What happens with $_GET? Well, basically, the user is going to type extra information at the end of our URLs. And whatever they type, assuming it's formatted in a particular way called a query string, which is just a set of key value pairs separated by ampersands. Those key value pairs will be stored in a $_GET associative array. And from our video on PHP syntax, we know how to work with associative arrays already. So here is an example of some PHP, where maybe I'm extracting all of the key value pairs that the user supplied in the URL. So I have my Open PHP delimiter. I have a foreach loop. I'm iterating across the Super Global Array called $_GET. 

And I want to be able to refer to both the key and the value. And I'm just printing them out, each one on apparently its own paragraph tag here. I'm printing out some HTML and interpolating the values of key and value into that statement. 

So let's take a look at how this would actually work on our IDE. And maybe this will help illustrate a little bit of what GET is actually doing. So I'm back here in my web root. And I'll zoom in a little bit to show you that I have a file called, get1.php. 

So let's click on get1.php. And I'm not seeing any content. That's weird, right? Well, not really actually. Because I didn't supply anything in the URL. I'm going to get1.php, but I didn't supply any key value pairs as part of my query string. So let's add a query string and see what this file can do. 

To begin a query string you just type question mark. Then maybe I'll say name=Doug&year=2015. And then I will hit Enter. Now notice what's happening. I'm still in get1.php. But now I've supplied key value pairs, and I'm printing them out on their own paragraph-- name, Doug-- year, 2015. That's exactly the code we just saw on the slide a moment ago. 

And if I want to maybe add another key value pair, &class=CS50. Now I have another key value pair that's printed out when I revisit the URL again. Now maybe this isn't formatted terribly well. So I have another version of get.php. It's get2.php. 

The difference in this one is I have CSS file, and it formats things a little more nicely for me. It's maybe not the most beautiful CSS in the world. But it's just another way of doing it. So I can still get access to my variables using $_GET. And in this case, I'm just kind of making the CSS a little more fancy. And if we pop over to my IDE for a second, I'll show you in my PHP web directory here, get2.php. We'll open it up, some HTML here. Apparently I'm linking in that CSS file I was talking about. I open a table tag. And then here's my foreach loop. 

Here is that, what I showed on the slide before. The only difference is I have this key and value CSS styling that I'm applying to it. But that's all I'm doing, is I'm iterating across $_GET to get all of the key value pairs. 

And I'm printing them out as the table. And, apparently, I'm formatting the keys in one way, with the <td class="key". So apparently that applies to some class selector in my CSS file GET.CSS. And, apparently, I'm printing out my values a totally different way. Which is pretty much what we saw here, where our values were printed with a blue background, and our keys were printed with a yellow background. So that's how I'm getting those different styles. Because I'm using different CSS classes. But that's pretty much it for GET. Like I'm just extracting information. And in this case, I'm just printing it to the screen. I'm getting it out of the URL, and that's what GET does for us. 

Do you see a possible problem here though? Why would we maybe not want to use $_GET? What if, maybe, I was making this query? --to get3.php, which I don't have on my IDE. It's just a hypothetical file. But notice here that apparently passing my password in. And maybe my password is embarrassing. Or maybe I don't want people to know what my password is, right. 

If I'm passing it though-- if I'm using the $_GET method, what happens is, that's going to be in the URL. So some malicious user might be able to see what I'm doing. I may be passing them sensitive information. Or maybe it's not even a malicious user. Maybe it's just your friend who is standing over your shoulder. And now they know the password to your Facebook account. 

And maybe they wouldn't do anything with it. But if your password were submitted via $_GET to Facebook, now they know your Facebook password. Because it's right there in the URL when you've done submitting information. 

And so perhaps that's not the best way to pass sensitive information. It's a good way to pass information that we don't particularly care about as being too sensitive. Because GET is pretty fast, relative to the other super globals we're going to talk about. But maybe not the best tool for sensitive information. 

For that we might want to use something called $_POST, which is another Super Global Variable. It's another associative array. So it works pretty much exactly the same as GET. Except, instead of extracting information from the URL, it does something through HTTP headers. So recall from our video on HTTP, we talked about how browsers, servers, and clients communicate. And information is passed back and forth in HTTP headers. 

With $_POST, information is typically sent through those HTTP headers. And we'll most commonly see $_POST in the context of submitting HTML forms. You can still use HTML forms to submit things to GET. But they're usually used in the context of POST. 

So here's an example of an HTML form. Now we've seen these before, but we have not seen this part, action="post.php". So when we talked about forms in the context of HTML, I had a Submit button. And if you recall, I'd click Submit and then the page just refreshed, didn't do anything. 

In this case, I'm submitting whatever I type at this form, to a PHP file called post.php. And, apparently, the way I'm doing that in this form is using the POST method. So every piece of information that I type into this form will be submitted through the HTTP headers. 

It will be accessible in post.php, because that's the action of my form. It will be accessible by going to $_POST. And apparently, the way I can get at each individual element with that associative array is with this attribute, the Name attribute of our input tags. 

So apparently I can say $_POST square brackets name to get whatever the user typed in the first field. And $_POST password, of pw rather, to get at whatever the user typed in the second field. 

So let's take a look at this over in CS50 IDE. So here we are, and I'll zoom in for a second. And we have a file called post.html. I click on post.html. At the very top here I have a very simple web form. It's the form we just saw on the slide a second ago. 

I can type, Doug, and I can type my password, which we all know is squadgoals. And I will hit Submit. And apparently, that submits to post.php. And I'm apparently printing that. So I'm getting rid of all the security that POST gives me by just printing out the username and password. 

The user's name is Doug. The user's password is squadgoals. How did I do this? Well, pop over to IDE again for a second. We will scroll down to take a look at post.php, which was the action that I used to submit here. That was the action of my HTML form. And that's all I'm doing. The user's name is, and I'm printing out the contents of $_POST "name". And then the user's password is $_POST "password". So I was given that information by submitting the HTML form. And I can now extract it using $_POST because the method I used to transmit data with that form was the POST method. 

Now it's probably not so great-- I'm going to go back for a second to our set here-- it's probably not so great if I am submitting information with POST, which is ostensibly more secure. It's probably not so great if I'm doing that and then printing out the user's password. It's supposed to be more secure. 

OK, but it's not entirely secure. And so in this little snippet here I want to just draw your attention to some data security concerns, just something to think about as you're working or using the internet. This is just something to consider. 

I told you that information is submitted through HTTP headers when you use the POST method. Which means they're not entirely secure. They're harder to find than using the GET method, where it's just right in the URL. But there's still a way to find it. And I just want to show you this so that you maybe start to think about this as you're working, or using websites and submitting passwords, and maybe using the same password in a lot of different places. Know that is is still actually pretty easy to find out somebody's password. 

And so here, I'm going to go to post2.html. And the difference with post2.html and post2.php is pretty subtle. The difference is just that I don't print out the password when I submit the form. 

So I'm going to type in, Doug. And I'm going to type in, squadgoals, even though we know that's the password. Before I submit the form though, I'm going to open up Developer Tools, just to show you what's going to happen here. So in Chrome, I'm just going to hit F12. And that's going to open up my Developer Tools on the right hand side. I haven't submitted the form yet. Now I'm going to hit Submit on my form. And apparently, I made a call to, or I made a request to post2.php, which makes sense. I'm going to click on that. 

Then over here, I'm going to click on Headers. There's a lot of stuff going on here. But if I scroll down to the very bottom, notice right there-- my calendar has blocked it for a second-- right there at the very bottom corner, name-- Doug, pw-- squadgoals. So even though I'm using the POST method, which is more secure, just be aware that when you do so, you're still transmitting information through HTTP. And it can still be found by an adversary. It's just something we're going to have to deal with really. Maybe there's some ways to encrypt our passwords before we send them over, which would be a better, which I'm not doing here. 

But just be aware that the POST method has limitations too. It's an improvement over GET in terms of being immediately visible. But it's not a complete fix. So here's an example of a quick at home exercise that you can use to get some practice working with PHP. Create the following pair of web pages. The first should just be a very simple form with a single field and a Submit button. So very similar to what we just did with post.html. 

And then the second file you should create is a file, a PHP file, that is expecting input, via POST, and based on what the user typed, which you can assume will be an integer. You don't have to do any error checking or the like. You can assume the user will type an integer value, or something like an interpreted by PHP as an integer, into that form. You just want to create an n by n multiplication table. 

So if the user submits 10, we want to have a 10 by 10 multiplication table. If the user submits a 12, we want a 12 by 12 multiplication table. Just so you can see what we're driving at here, we'll take a look at this file in my IDE. 

So here in IDE, I have mult_form.html. I'll click it. All I want to do is submit a value. Type in 10, hit Submit. And apparently, mult_table.php, which we can see at the top there in the URL, I'm creating a 10 by 10 multiplication table. 

If I type 15 and hit Submit, now I have a 15 by 15 multiplication table. I'm, of course, not going to show you the contents of mult_table.php, because that would take the fun out of this at home exercise. But it's a great way to get some practice working with PHP loops and POST, very simple, hopefully stress free example, just to do a little bit of practice. And I've got a little CSS going on here to to make my individual table cells just kind of pop off a little bit and look a little more like a multiplication table, as opposed to just text just kind of sitting there. The last super global we'll talk about in this video is something called $_SESSION. And maybe this is actually the best example of something we would consider global. It's another array. It's another associative array. But it is accessible through every PHP file that exists on our system. 

We don't have to submit information one page at a time like we do with GET and with POST. It's always there. And so this is great for a page where you are logged in, for example, and you want your login information to persist from page to page to page. 

You can just start a session and then use $_SESSION to save things like the user's name, or the user's ID information, and so on. And that information will remain in $_SESSION until you destroy the session a little bit later on. 

Writing dynamic websites with PHP makes them a lot better. Your sites become very dynamic, and you don't have to do too much more than what you otherwise would have done just doing it with HTML. But it requires practice, a lot of practice. 

You already know how to work with C, and so jumping to PHP isn't too tricky. What is maybe a little bit tricky is working with this new idea of GET and POST, and maybe mixing your HTML and your PHP together. But also be aware that the internet is a vast repository of information. And PHP's documentation is available in many places, but perhaps most canonically at php.net. And you can find there, lots of different functions, and use cases, and examples upon examples, upon examples. Where if you want to try and figure out how to do something, odds are, somebody's probably done it before you. And you can use them as inspiration to implement whatever it is you're trying to implement too. 

I'm Doug Lloyd. This is CS50.