Welcome to the the first part of my tutorial series outlining how to build a website from scratch.  In this post I'm going to explain how to set up a development environment. Basically this means that I'll be walking through the steps necessary to set up a real live web server running directly on your personal computer.

This is how I (and many other web developers) write software.  You get everything working on your local server (or development server) and then move it to the live server (or production server).  

So let's get started.  I use Windows, and this tutorial will assume you do the same, although it should be pretty easy to translate this into Mac OS or Linux terms.

The web server that I use involves three main components:

  

• Apache is the actual "server". It takes requests from a web browser, decides how to process them, and sends the results back to the browser.
• PHP is a scripting language.  This is what most of the actual "programming" is done in.  When Apache receives a request for a web page, it tells the PHP server to do all the heavy lifting
• MySQL is the database program.  It stores data which is accessed by PHP through queries.

Now that you've got everything installed, let's start creating the project.  You should have a folder at C:wamp/www on you main drive (assuming C is your main drive).  This "www" folder is the root of the project.  That's where all the files you make will go.

You probably already have a file called "index.php" in this folder.  We'll talk later about the significance of this file, but for now, open it up in notepad, delete everything in that file, and replace it with the following:

<?php
include_once('include/init.php');
?>

Don't worry yet about what any of this means.  Just trust me.  Now make a subfolder of "www" called "include" and make a new file inside called "init.php".  If you're not sure how to make a php file, browse to that folder, right-click in it and select the "New > Text Document" option.  Name it "init.php" and then ignore the warning Windows will give you about changing the extension.  Then open the file in notepad and type in:

<?php
die("Hello World!");
?>

Ok, that's all you need to do with the file system for now.

Change it to

include_path = ".;c:\wamp"

Notice that the semi-colon at the beginning of the line isn't there anymore.  That semi-colon commented out the line so that it wasn't used in the configuration.  By deleting the semi-colon and setting the include path to point at the "wamp" folder, we're telling PHP to let you include files from your project.

Save and close that file.  Whenever you make a change like that, you need to restart the WAMP services.  To do this, click on the WAMP icon in the task menu and select "Restart all services".

Test it out

Let's recap what we just did.  We installed a server on your PC, installed a program to help you access the database, set up your project in the "/wamp/www" folder, reconfigured PHP to include files from your project automatically, and told Windows that "calendardev" is the name of your website.

If everything worked correctly, you should be able to type "http://calendardev" into the address bar of a web browser and see a blank white page that says "Hello World!".  If you see that, you did everything correctly.  If you don't see that, leave a comment and I'll be happy to help you figure out what went wrong.

I realize that this hasn't been very informative.  I told you what to do and you did it, but you probably have no idea what's going on.  Don't worry, you won't ever need to deal with this configuration stuff again.  If you do, you basically just follow the same steps.  I might explain this stuff in more detail at some point, but for now just consider it black magic that's an unfortunate prerequisite to actual web development.

Stay tuned for the next installment of this tutorial series.  I'll explain to you how to use html to make a calendar show up on a website.