call:0141 881 8915

Our Work

  • click to learn more about MCM-Hotels project
  • click to learn more about Ocean-Village-Reviews project
  • click to learn more about Find-that-Hotel project
  • click to learn more about Thomson-Ships project
  • click to learn more about Ninja-Battle project
  • click to learn more about Jolly-Soft-Toys project
  • click to learn more about J-%26-S-Painters project
  • click to learn more about MIG-Contracts project

Web Development Basics Part 2: Setting Up a Webserver

Last week in Web Development Basics: Part 1, I explained what the kinds of tools required to begin developing websites that can respond to a user action.  This week the topic is how to set up a web server on your computer so your computer can execute programs and scripts as though it was a live website.

The software we will use is XAMPP which is Apache, MySQL, PHP and Perl is a nice little bundle for you;  it is relatively easy to install.   This example will be installing XAMPP on a Windows Machine, but using the link provided you can download the same software for multiple Operating Systems.

Step 1. Download XAMPP and open the file.

The installer will now ask you where you want install the web server; choose a location then click install

xampp install location


Step 2. When the installation completes setup will run automatically

First prompt asks if you want a desktop shortcut – always handy, press y for yes and n for know and hit return to confim.

xampp setup screen 1


If you get the following prompt do not panic just press y hit return

XAMPP setup screen 2



The third prompt asks if you want XAMPP to be portable; this is useful for storing it on a flash drive or media you intend to carry around and use on multiple machines.  If you will be using only the installation on one machine for web development you can press n and continue .

XAMPP drive letter selection



Then XAMPP will configure itself and all you have to do is hit return:

XAMPP setup 4 complete

It will then configure the timezones – it should hopefully get this right (if not I will show you how to correct this after the install is complete).

xampp timezones setup


Finally you will be prompted with a number of options that you can use to start XAMPP

XAMMP options final


Right now we are only interested in starting the server and to do this we will have to access the XAMPP Control Panel (there should be a shortcut on your desktop by now but we want to feel manly/womanly right now and do  things through the command-line), press 1 and then press return.  The XAMPP control panel looks like this:

XAMMP Control Panel Start



Our first task after starting up XAMPP control panel is to start the Apache and Mysql web services, we do this by clicking the start buttons next to the words Apache & MySql under the word modules.  Now XAMPP should look like the screenshot below.

Xampp start 2


Now the server is running it’s time to get it to execute some code.  The web server specifies the  folder where the website or application will be served from this is in the htdocs folder of where you installed XAMPP; a shortcut is to click the Explore button in the XAMPP control panel:

The xampp directory




Inside the htdocs folder create a new folder and name it “test”

Inside the test folder right click and go to the New option and select Text Document rename the document index.php (make sure you get rid of the .txt extention)

Open this document in Notepad and insert the following (this is simple PHP code to check if the server works)

A php excerpt

The echo command puts things on the screen, the server will not print anything on the webpage unless explicitly asked to do so.  The 1st example simply places the text hello world on the page the 2nd adds 2 numbers together and prints the total on the webpage for people to see.

output php page

This is the complete page the web server has placed the text hello world on the page and added the numbers 1 + 5 to get 6 and then printed 6 on the page, so web servers generate a page based on the commands within the page.  This allows us to output a different page depending on what the user does or what the user needs.

Changing the timezone in php

If during setup php guessed the time wrong, you can rectify this by navigating to your xampp installation then to the php folder; open the php.ini file(in notepad or other program).  Around line 1015 you should see

php ini screen timezone

Replace the timezone (seen here as Europe/London) with any of the timezones below

List of timezones

NOTE: it is very important that the timezone you choose is in “quotes”.

That concludes Part 2.  The next article will be about the PHP programming language and how it works with a web server.

September 15th, 2011 by | Leave a comment

Leave a Reply


Testimonials testimonials icon

More Click Marketing provided a really professional service and I was kept up to date with the progress of my design.

J&S Painters

Fast service. I was using my website in two weeks and a week after that I received my first order for work. Websites look very clean, fresh and professional. I recommend MoreClick Marketing to everyone.

MIG Contracts

Twitter Updates twitter icon