Introduction to PHP Setting Up Your Development Environment

Hello again, and welcome back to Educator.com's Introduction to PHP course.0000

In today's lesson, we are going to go over how to set up your development environment.0005

Specifically, we are going to talk about what development environments are, and then go over a couple different kinds of development environments:0010

one known as a remote development environment, and one known as a local.0017

We are going to talk about the software that we are going to be using in this course for our development environment.0021

And then, we are going to go over a couple of concepts related to web servers, and what is known as local development.0026

Basically, we are going to be talking about the loopback IP address, and we'll explain more about that, as well as the localhost host name.0033

We are also going to talk about the concept of a document root.0040

We are also going to go over a description of the different kinds of text editors that are available,0044

and go over our PSPAD installation, which is the text editor that we are going to be using for this course.0049

And then, we are going to finish up with a section that provides some additional resources for finding help in setting up your development environment,0055

and then also, introducing our first homework challenge.0062

What exactly is a development environment?0066

Well, essentially, it is just a setup for a programmer to be able to write and test and debug their software.0069

What we have done for this course is: we have chosen a default development environment setup that we are going to use throughout the course.0076

The reason for that is that, unfortunately, one of the biggest roadblocks to new PHP developers0084

is actually just getting their development environment set up so that they can actually run PHP code and test it.0090

Part of this reason is that PHP and Apache (which, as we learned in the last lesson, are two pieces of software that need to be configured to work together)0096

can be quite difficult to do that.0106

And so, we are going to install some software for this course that is going to help ease that problem.0108

For our default environment that we are going to be using, we are going to be running it on a Windows 7 platform.0115

The reason for that is: I feel that that is the most popular operating system, and will be able to reach most of the students out there,0121

the idea being that you will be able to mimic the steps that we take in this lesson,0127

so that you will be able to get your development environment set up with as much ease as possible.0132

Additionally, we are going to be including software components as part of our development environment that have a couple of key features.0140

We are selecting components that are free, so that all of the students will be able to download them.0148

We are picking things that are easy to install and configure.0152

And additionally, we are picking software that is available for most major operating systems.0156

So, even though we are going to be walking through the setup of the development environment on a Windows 7 machine,0160

all the software that we are going to be using (except for the text editor) is available for most operating systems,0165

so if you develop on a Macintosh or Linux or Unix machine, you will be able to get the same versions of the software we are going to be using.0172

The text editor, as mentioned, is only available on Windows machines; but there are literally hundreds of text editors out there on the Web,0180

so doing a simple Google search should be able to find you a compatible text editor that will work for use in this course.0187

Additionally, the software that we have chosen is well-documented.0195

It has a large user base, so that there is a lot of information out there that will help you if you get stuck in configuring it,0199

for example, if the default configuration that we set up in this course doesn't work for you.0205

Additionally, the software that we are going to be using is actually software that is used in the real world.0210

We are going to be using the latest version of PHP, and also the Apache web server, which is the most common web server that is used in the world.0214

The other thing to note is that the development environment we are going to be setting up for this course0223

is going to be the same development environment that we are going to use in the Advanced PHP course, with some slight modifications.0227

So, for those of you that continue on in the PHP course sequence here at Educator.com,0233

you will be able to continue to use that same development environment, without having to reinstall everything over again.0238

One thing I want to talk about first is: there is a thing about this remote development and local development.0246

Basically, "remote development" refers to where a programmer develops their code, or their websites, their PHP pages,0252

on their local machine, and then the way that they test them is by uploading them (typically by FTP)0260

to a remote server, where they can be run and be tested.0267

Now, we learned in our last lesson that, in order to basically view and serve PHP pages, we need three pieces of software.0271

On the client side, we need a web browser to request the web page to be viewed.0283

On the server side (in this case, it's called the remote server), we need the Apache web server that is able to serve HTML documents,0288

and also is able to pass on--if PHP files are requested--those requests to the PHP Interpreter,0296

so that the PHP Interpreter can generate HTML output and pass it back to Apache to pass it back to the client.0304

So, in order to be able to serve and view PHP pages, we need a web browser, the Apache web server, and the PHP Interpreter.0310

Additionally, for development, we need a way to code our text files or our PHP files that we are going to be using.0321

And so, we need a fourth piece of software that is going to be a text editor.0327

And basically, the way that it works in a remote development environment is that, typically,0332

the web browser and text editor are on your local machine, and the remote server contains the web server0336

and the version of PHP running that is going to generate your dynamic web pages.0343

What happens is: you will create some PHP file on your local machine (for example, a .php file).0349

And then, what you will do is: you will typically use FTP to upload that PHP file to your web server.0356

Then, in order to test the software, you are going to open up your web browser,0364

create an http request for the particular PHP file that you are wanting to test,0369

and then the typical process for loading a PHP file occurs.0376

Apache is going to let PHP know that a PHP file has been requested.0380

PHP will load it from the hard drive, parse it, and generate HTML, which it will pass back to Apache, which Apache then forwards on to the client.0385

This is basically the scenario that happens.0396

For those of you that have been Web developers before, that have a web host,0397

typically what you do is: you develop your HTML files on your local computer.0402

You upload them to your web host, maybe to a temporary directory, and then view them there to test them out.0406

This is an example of remote development.0412

What we are going to be doing in this course is setting up a scenario for a local development, or a local development environment.0415

What you can see is that, over here, we actually don't have this remote machine involved anymore.0421

All of the software that we had in the remote development environment, we are still going to have,0426

but it is all going to be run on our local development machine.0431

So, on whatever computer you are developing on--your Windows 7 machine--we are going to have the Firefox web browser software installed.0434

We are going to install the Apache web server; we are going to have PHP installed; and then, we are also going to have a text editor installed.0442

What happens is: basically, there are a number of benefits to doing this.0450

A lot of it has to do with increasing your efficiency as a developer, because now, when you create a PHP file,0455

in your text editor, on your local machine, instead of having to FTP it across the Internet to Apache,0464

that FTP simply becomes a local saved file to your hard drive.0471

Because your Apache server is running on your local computer, Apache and PHP just need to load that file from the local hard drive.0475

So, we don't need that FTP operation, and we eliminate one of the network interactions that takes time.0482

It takes time to upload files by FTP.0491

Additionally, when we want to test a file, we don't actually have to go out on the Internet.0495

We just point our browser at our local Apache server, and it is still going to generate an http request,0499

but it is not going to go out over the Internet.0505

It is going to stay local within your computer.0507

So that, again, eliminates another network connection that you have.0510

Another added benefit of this is that, by having your web server and PHP all on your local development machine,0513

you can actually develop while you are offline--while you are not connected to the Internet--0520

because you don't need to be able to FTP to a remote server, nor do you need to connect to a remote server to test your pages.0524

The other benefit that you get from having these things installed locally is that you have access to all of the configuration files--0532

for example, for the Apache server and for the PHP Interpreter.0540

You have access to those configuration files, whereas for example, if you are using a web host and have a shared web hosting account,0545

you may not be able to alter the PHP configuration.0552

Now, because we are going to be developing,0556

we may want to set some configuration settings that will be useful for development, so we want to be able to make those changes.0558

And also, as we are learning PHP, we are going to be changing some of these settings.0563

And by having that configuration file that we can edit on our local machine, we will be able to experiment with different settings,0567

and it will help us in learning PHP and how to do PHP development.0574

The software that we are going to be using in this course, basically,0583

is the four pieces of software that we talked about: a web browser, Apache, PHP, and a text editor.0586

For the web browser, we are going to be using Firefox, which is an open source web browser that is free.0592

One of the main reasons we are going to be using it is because it has an add-on called Firebug,0600

which basically adds a bunch of Web developer tools to the browser that make it easier to do Web development,0603

and also that we will be able to use to help us diagnose problems with our PHP scripts,0610

for example, when we get into dealing with input data from HTML forms, such as something known as GET input data.0615

Actually, if we go and take a look--I have already installed Firefox, and basically, this is the link provided on that slide,0623

which will also be provided in Quick Notes, to where you can download Firefox.0630

Simply click on the download link; it is going to pop up a window allowing you to download an executable file.0633

And you simply run and install it, just as you would any other Windows application; it's a pretty straightforward and quick process.0639

Now, to install the Firebug add-on--that is actually something you do directly from Firefox.0646

The way you do that is: you go to the Firefox menu; you click on the Add-ons option, and Get Add-ons is going to load up.0650

In the Search Add-ons box, simply type Firebug.0659

What that does is searches all of the plug-ins and add-ons that are available for Firefox.0662

And we can see that Firebug pops up as one that is available.0668

We simply click on the Install button; what it is going to do is actively download that add-on in real time.0672

It has basically already installed it in this short amount of time, and then it asks you to restart Firefox in order for the changes to take effect.0680

If we click on Restart Now and wait a couple of seconds while the browser reloads (and actually, you can see that it already has),0688

what you will notice, actually--it's kind of subtle, but in the bottom right-hand corner of the screen, you will notice this little bug.0702

If you click on it, it opens up this tool panel at the bottom.0709

This is what Firebug is: it's a panel of different tools that allow you to diagnose and figure out problems that are going on with your web application.0714

And so, that is how you know it successfully installed--the little bug appears down here.0724

You can go ahead and close that by clicking on the bug again.0727

That is Firefox and the installation of the Firebug add-on.0730

The other piece of software we are going to be installing is actually a software distribution; it is called XAMPP.0736

What it is: it is a combination of a number of different pieces of software that are combined together in one distribution,0742

and set up so that they are easy to configure with one another.0749

In particular, XAMPP contains PHP (in this case, for the version we are going to be using--1.7.4).0753

It contains PHP version 5.3.5, and it contains the Apache web server version 2.2.17.0760

What we do is: we simply download this software distribution.0768

It is going to contain Apache; it is going to contain PHP, along with a number of other different pieces of software.0771

For example, it is also going to include the MySQL database.0776

And what it does is: it also provides some configuration files that make it easy for you to get Apache and PHP set up to work together.0780

That is one of the main reasons that we are using this software distribution:0788

because getting Apache and PHP to work together can be a very difficult task.0792

Also, the other piece of software that we are going to be using, that is mentioned, is the PSPAD text editor.0798

It is a Windows-based text editor, and it can be accessed at this link.0803

You simply go and download the executable file and run it, just like you did for Firefox; it's pretty simple.0807

For XAMPP, it's going to be a little bit different.0814

There are a couple of different options available at this link, which again, will be available in the Quick Notes.0816

I'm going to have you download the ZIP archive, and not the EXE file.0821

And actually, I'm going to walk through that XAMPP installation now.0825

The first thing for the XAMPP installation is actually: let's go look at the XAMPP website.0831

It is at a website called ApacheFriends.org; we want XAMPP for Windows.0837

If you scroll down this page and pull it up a little bit, you can see the different downloads.0842

There is going to be a Windows Installer and then a .zip file.0847

What we want is: we want to install the .zip archive; we want to download the .zip archive.0853

I have already downloaded that; and the first thing you do is: we are going to unzip that software distribution.0859

Now, I have actually already gone ahead and done that, because it takes a while; it's a pretty large file--it takes a while to unzip all of the contents.0869

But for this course, we are going to unzip that XAMPP software distribution into a directory called XAMPP.0874

You should put it in your Windows User directory.0882

The reason for that is related to permissions: we could install it in the Program Files directory, or maybe on the root hard drive (for example, the C drive);0886

however, because one of the things we mentioned that we want to be able to do as new developers is0895

to play with the configuration files, if you install, for example, the XAMPP distribution in the Program Files directory,0900

you run into problems when trying to edit the configuration files; you run into permissions issues.0907

Typically, that can be avoided by placing the XAMPP distribution within your User directory,0912

because you have full read and write permissions,0917

which will allow us to pretty easily change the configuration for PHP, and if we need to, Apache as well.0919

You unzip the file into an XAMPP directory in your user directory, and then the next thing you do is:0926

you run this setup script, or a batch script, that XAMPP provides for you, that is going to get everything configured and set up to work together.0932

If we go to where...Educator1 is the name of our user directory on this computer--0941

we have gone ahead and unzipped the XAMPP distribution into the XAMPP directory.0947

And you can see here, this is the contents of the XAMPP distribution.0954

What we are going to do is run the file called setup_xampp.bat, and that is the batch file that is going to set up XAMPP on your computer.0958

If we go ahead and click on that, what is going to happen is: a Windows command prompt is going to pop up.0966

And you may or may not be able to see the text in this window, but it basically says, in this case,0971

that it was successfully installed and configured, and press any key to continue.0977

If we go ahead and do that, XAMPP is properly set up on this computer.0980

Now, that being said, the next step that you want to take is to verify that the installation actually worked.0988

There can be some problems that occur.0993

The first thing that you do is: you start XAMPP; and you do that by running a file called xampp-control.exe in the XAMPP directory.0996

If we go ahead and go to our XAMPP directory, and we double-click on xampp-control.exe, this control panel for XAMPP is going to pop up.1005

And you can see, it has a number of different buttons on here.1013

The first one is a start button that relates to the Apache web server.1016

The next step that we are going to take, when we start XAMPP,1020

is to go ahead and click the Start button next to Apache, so that our Apache server will be up and running,1023

because we need that to serve files locally on our computer.1029

So, assuming everything works right, you will see a little message here that says "running," that lets us know that Apache is up and running.1032

One recommendation I would have would be to put a shortcut somewhere to this xampp-control.exe,1040

for example, on your taskbar, so that it is easy to access, because when we are changing configuration files,1045

you are going to want to be able to access that to start and stop Apache.1052

The next step that we are going to do, now that Apache is started and we know that that was successful1057

(if it wasn't, we would have gotten some sort of error message):1061

we are going to open our browser and browse to this address: http://127.0.0.1.1064

What that is: basically, we are saying we want to view the contents of the root of a web server at this IP address here, using the http protocol.1072

And if XAMPP was installed successfully, and Apache works correctly, we should see a splash screen up here.1085

So, if we go to our web browser, we open a new tab, and we go to http://127.0.0.1, and we click Enter,1092

(oops, I'm sorry, I mistyped http),1104

we see the XAMPP splash screen that is going to allow you to select a language.1109

For this course, we will be using English, so we click the English link.1113

What comes up is the XAMPP control panel; it is another one of the advantages of using a software distribution like XAMPP.1116

It provides a control panel that allows you to configure and play around with the different pieces of software that come with it,1125

especially things besides Apache and PHP, like your MySQL database and so forth.1132

So now, we know that our XAMPP distribution is up and running.1138

If you get to this point, you know that you have successfully installed XAMPP, and your Apache server is working correctly.1140

Now, what you will notice from the last slide is that we went to the address 127.0.0.1, which is an IP address.1149

It is known as a loopback IP address.1158

Basically, what it does is: when you type that in your web browser, your computer knows that when you go to that address,1160

it is not going to search for a computer on the network that has that IP address.1167

It knows that that address refers to itself--the local computer.1171

When you type that address in your web browser, your computer is going to know that it means,1175

"I want to look for a web server that is running on my local machine," so it is going to look for a local Apache web server.1179

Now, one other way to refer to this IP address is using the host name localhost.1188

Localhost is a name you can type in your browser; it works like domain names...for example, just like amazon.com does.1194

Whereas amazon.com, using DNS, translates to a specific IP address--1200

and it's an IP address that computers use to communicate, but you can access it in your web browser by typing amazon.com,1205

in that same way, we can use localhost and type that host name in our browser,1211

and that is going to refer to this loopback IP address, as well.1215

For the remainder of this course, we are always going to be using localhost to refer to our local web browser,1221

rather than the loopback IP address.1226

We are going to do that for pretty much the same reason why, when you go to amazon.com,1228

you don't type in the IP address: the domain name or the host name is easier to remember than the IP address.1231

Now, because those refer to the same IP address (localhost refers to 127.0.0.1),1238

if we go back to XAMPP or to our web browser, and we type http://, and type localhost this time,1245

what we should be able to do is make a request to our local web browser.1255

And if we hit Enter, we can see that that actually happens.1262

So, localhost and 127.0.0.1 both refer to our local machine with Apache running on it.1266

Now, one thing I want to talk about is a term called a document root.1277

Basically, what a document root is: it refers to a folder on your local hard drive1281

that contains all of the files that are accessible by your web server.1286

Basically, only files that are contained in a web server's document root or its subfolders are typically accessible by the web server.1291

For example, for those of you that have worked with web hosts before,1301

maybe your document root was named something like public_html, or www.1304

And basically, what your web hosting provider would tell you--they would say,1310

"Any files that you want to be made available on your web server--you put them in these directories."1313

For example, every file on your computer is not available by your web server; only files that are put in these specific directories--1320

the document root or its subfolders--are available by the web server.1327

For Apache and the XAMPP installation, the document root is a folder named htdocs that is located in the XAMPP root installation folder.1334