So, This Is How It Begins
It may be that the subject of this post is a bit dry, but I'd like to get it written down as much for my own benefit as for anyone else who might end up reading it. I may need to go through the process of setting up a local server again at some point and it will be useful to have a record of what I needed to do to get things working properly. I've spent a bit of time over the past few weeks trying to get this web site working. At the moment, I have one blog post and a page that includes the game I'm working on at the moment. I've had a bit of success getting php to work it's magic, so I also have index pages that update automatically when new content is added. That's the theory, anyway, and the only way I can really test that is to add some new content so here it is.
Who needs a web server anyway?
One of the strengths of HTML is that it is a simple, text based fomatting language that can be easily viewed by a web browser. It is easy to write, and easy to test. You can just create a file, write some text with a few tags included to describe the formatting, and then see what you've created by changing the file extension to .html and opening it up in a browser. As you add content to the page you can simply save the file and press reload in the browser to see how those changes appear. Developing web pages in html should be simple.
Unfortunately, my intentions for this site are a little more complex than HTML alone can manage. I will need to use server side includes, php, and javascript to get the results I want. Javascript runs within the browser, and so is similar to HTML in the ease with which it can be developed, but php and server side includes process the web pages before they are delivered to the browser. They need to run on a web server, so my first task in creating this site was to intall a web server and php environment on my pc.
It is worth pointing out at this stage that I am working on a windows pc, so my descriptions are all based around that fact. It shouldn't be too hard to figure out how to do something similar to this for whatever flavour of unix or MacOs you use, if you are one of the many people in this world who prefer to stay away from Microsoft products.
It is also worth pointing out that there are many integrated WAMP/LAMP server distributions around that you could try. LAMP stands for Linux, Apache, MySQL, PHP, which are the most common elements that go together to make up a web server. The W in WAMP stands for Windows. These packages come with Apache server, PHP, and MySQL installers plus some sort of instalation management software, and in theory installing one of these packages should sort out all the configuration of the individual components so that they work together. I decided to go it alone, to help myself get a better understanding of how these things work.
Apache
Apparently, the most common web server technology used on the web is the Apache server. Fortunately, it is free, a fact which might be connected with it's popularity. A web server is simply a program which runs in the background on a computer, waiting for requests to come in over the network, or from other programs running on the same machine, for documents. It responds to http requests (Hyper-Text Transfer Protocol), and it is one of the major components of the technology that has created the web as we know it today.
Installing an Apache web server to run on a local machine is fairly straightforward, and there are quite a few pages on the web describing how to do it. I found this one to be a useful guide. I downloaded the file httpd-2.2.22-win32-x86-openssl-0.9.8t.msi from the Apache download page, and installed it. I called my local server 'localhost' so that I will be able to look at my files served from the server by typing http://localhost/ into my browser's address bar.
Basic Apache Configuration
Once the Apache server is installed, it needs to be configured to do the job we want. The server configuration is stored in a text file, httpd.conf. Depending on which flavour of windows you have and the options you chose when installing, it will be somewhere like C:\Program Files\Apache Software Foundation\Apache2.2\conf\httpd.conf on your local machine. It can be edited directly in a text editor like notepad, or you can open it from the start menu entry for the server. For changes to take effect, you will need to restart the apache server after saving changes to the file. This can be done from the start menu or from the system tray icon which should have appeared after installation.
The first thing to do in this file is
to change the value of DocumentRoot to point to the folder you want to use as the root of your website. The folder you specify
in here will map to //localhost/ when you access files through the web browser. In my case, I commented out the original
specifier for DocumentRoot, by adding a # to the start of the line, and added the folder I wanted use on the next line:
#DocumentRoot "C:/Program Files/Apache Software Foundation/Apache2.2/htdocs"
DocumentRoot "C:/Code/Html/SiteRoot"
Just below where document root is set in the configuration file, there is a section that specifies which server features are allowed
on which folders. The default features, which are applied to all directories that don't specifically have features set, are very restrictive
and will not allow files contained in those folders to be viewed. Following the default specification, comes a specification intended for
the document root folder. So, edit this so that it applies to your chosen document root. I changed the line:
<Directory "C:/Program Files/Apache Software Foundation/Apache2.2/htdocs">
to:
#<Directory "C:/Program Files/Apache Software Foundation/Apache2.2/htdocs">
<Directory "C:/Code/Html/SiteRoot">
This change allows me to create a file called test.html in the C:/Code/Html/SiteRoot/ folder on my local hard drive, and access it
through a web browser as http://localhost/test.html.
Server Side Includes
So, that was fairly simple. The next thing we need to do is to turn on server side includes (SSI). This will allow me to get the server to add the contents of one file into another file when it is sent for viewing by a client. I plan to use this feature to easily get the same header to appear at the top of each of my pages, without having to write the required html directly into each page. This page provides instructions for activating SSI.
The first step is to tell the server to activate the includes feature on our document root directory. Earlier on, we set the specification
of the document root directory. We need to edit the 'options' specification for our directory to turn on includes. We do this by changing this line:
Options Indexes FollowSymLinks
to this:
Options Indexes FollowSymLinks Includes.
The server side includes feature is then active for any files inside our document root directory, and for any sub-directories that we might create later.
Having turned on server side includes for our document root directory, we then need to tell the server which type of files it should
process for includes. I have decided to stick to the common standard of naming server parsed html files with a .shtml extension, although
I could have stuck to .html or in fact used any extension I want. It is these commands that tell the server how I want it to behave. The
commands to tell the server how to deal with different file types are held within the
<IfModule mime_module>
section of the httpd.conf file. The commands needed to deal with .shtml files are already in place, although commented out in the default
version of the configuration file. So, simply remove the # characters from the start of these two lines:
...
</IfModule>
#AddType text/html .shtml
and the server will process .shtml files for includes before serving them up to a client.
#AddOutputFilter INCLUDES .shtml
Directory Index Files
The final bit of configuration that I want to change from the default is to specify the file that apache will serve as the directory index. If the server is asked for the contents of a directory, then without a directory index file it will return a list of all files and directories within that directory. If the directory contains a directory index file, that file is served up instead. By default, apache looks for a file called index.html to use as the directory index.
For my site, I intend to have content arranged into directories, with a fairly simple page acting as an index to those directories.
However, because I want to use server-side includes to make it easier to share content between pages on my site then I want my index
page to be stored in a file called index.shtml. The file to use as the directory index is specified in the apache configuration file
in the section that looks like this:
<IfModule dir_module>
Here, the DirectoryIndex token is followed by a list of files that will be searched for in turn to try to find a file to serve as
the directory index. To get the behaviour that I want, I could just replace index.html with index.shtml or, as I actually did,
add index.shtml as a more preferred option for the file to be used:
DirectoryIndex index.html
</IfModule>
<IfModule dir_module>
DirectoryIndex index.shtml index.html
</IfModule>