Tutorial-building Dynamic Websites

The end goal of this tutorial will be to create a simple website that will display news content, The news will be posted by the admin and we will be building that too.

First, we will be setting up a web server (a software meant to send pages to the browser), that will help serve pages to our users the same way the internet does

but this time, on our local computer, we wont be using the internet to develop our website because the internet will slow down our development speed as we will need to upload files to the internet every time we make changes

with the local web server, things will be very fast.

Question: Why use a web server (in this case on our local computer), why not just build our site and save it on my system and run it from there?

Reason: we need to use the same protocol used over the internet: The HTTP (Hyper Text Transfer Protocol)
This way, our pages are parsed (processed, executed, run) by the web server before reaching the user.

we have many free HTTP servers but we will be focusing on the Apache HTTP server,
so just like 9ice, let's go there

http://httpd.apache.org/

Images
1. follow that link
2. make sure you download the binary version if you are not a pro
3. you should have something that looks like that

If you see the small icon in the image in your system tray

Then congrats, you have successfully installed the Apache HTTP server on your local computer

you should then open your web browser and type http://localhost/

you should see the second image

if you don't see that in your browser, click on the icon on the system tray to start the server
if any of these steps fails, start all over.


NEXT, we will look at how we can run our pages and where we need to store our pages so that all works fine.
see you tomorrow.

pls explain how to use apache in deploying web devt projects on a local server ie connecting to apache from other systems

@Webdezzi, thanks for the good work, I really appreciate it.

Kehers has answered it all.

@abes

Yes, you can use wamp, in fact i personally use wampserver 2.0 but it will be very bad for newbies to use wamp.
It will make them feel that is all they need to know.

Infact, i should be showing them how to install the files from source but if i try that, we will spend forever building the website as there would be many questions.

Now back to today's class

@abes
I was patiently waiting for webdezzi to conclude talks on installing Apache, mysql and php before I chip in the boundled softwares - softwares that have mysql, php and apache together so that u just install everything at a go. Being honest, Iv never installed the 3 seperately (I actually use AppServ). But then, this is an opportunity to learn how to do it one by one.
You see, those softwares - appserv, wamp, easyphp and co have their disadvantages. For one, they come with settings that the author thinks is best which is not in all cases correct. For example, there are some extensions (think of this as additional functionalities) that I'd love the current php I run locally to come with. Examples are sqLite, ffmpeg-movie, wbxml and memcached. But since I didnt compile PHP myself, these are out.
What am I driving at? When u do things urself, you have better edge.

NEXT, we will look at how we can run our pages and where we need to store our pages so that all works fine.

If you are not new to computers, you must have noticed that files on your computer always end with an extension
e.g
.txt -Text document, opens with notepad
.jpg -Image document, opens with ms paint or other graphics program
.html -Hypertext markup file, opens with your default web browsers

Now lets focus on .html file,

copy the html code below, open notepad up and paste it in it


now save the file as .html


make sure you save it on your desktop for now

@seton, its part of what we will be accomplishing with this tutorial

Next, double click on the file from your desktop and it will open in your default web browser showing
(image 1 below)

if you look at the location of the file from the browser, it says something similar to this

file:///C:/Documents and Settings/Oluwaseun Emmanuel/Desktop/tutorial.html

That is not what we want,

we want to open the file using the HTTP protocol
so we need to put the file in a directory (directory means folder) where our Apache will be able to locate the file.
and serve it using the HTTP protocol (i know that is tautology, but we need it here)

where is that directory?

it is somewhere in your apache installation directory (folder)
Let's go there

open My computer, double click on the Local Disk (C:)
from there, open Program Files > Apache Software Foundation > Apache2.2 > htdocs

by default, Apache looks inside htdocs and attempts to serve files inside it,
As far as apache is concerned, if your file is not in that folder
it doesn't exist

he would just say 404 (thats an error code for file not found)

before we relocate our tutorial.html, let us look at the index.html in that directory
when you type http://localhost without specifying the filename

Apache tries to complete the rest for you by look out for an index.html file
if index.html is present, it loads it, if absent, it displays the content of the directory

confirm this by renaming index.html in the htdocs directory to something else, e.g renamed.html

now from your web browser, try http://localhost

and see what happened

This little logic is what you will use to tell apache what your homepage is
for instance, tutorial.html is what we want as our homepage, so we will just rename it to index.html (don't do that yet) and apache will load it once we type http://localhost/

so if we were to be on the web, typing http://www.dealersnest.com will load the index file placed in the folder of that website

Now, for this tutorial
we will be creating a new folder inside the htdocs folder and we will name the folder "tutorial"
then copy the tutorial.html and paste it inside the tutorial folder

Now, you should have the tutorial.html file inside the tutorial folder, and the tutorial folder should be inside the htdocs folder

to access the tutorial.html file, just type, http://localhost/tutorial/tutorial.html
(you should begin to get a picture of what is going on)
make sure you use a forward slash "/" when using localhost to access a file

So lets say we have another website to design, we will create another folder inside the htdocs folder for that website
 and access it typing http://localhost/newsite

That helps keep things organized

@webdezzi

For you to make out time to add values to the life of others, without any form of compensation, you deserve more than a pat at the back. All I can say is "May God Bless You". Thanks we all appreciate your kind gesture

@ kehers

thats wot i meant.

The problem wld b the NL part in http://localhost/NL
and ports to use

id love to deploy php for biz apps

@webguru

I think it will be better if you don't confused port with IP,
they are separate terms, and you should not be talking about port here

and i forgot to mention that typing http://127.0.0.1 will also point you to http://localhost

well, i changed my mind, you can go ahead and set the colors to your preferred color, i will go ahead and reset mine

to reset colors,
follow image 1

Image 2 - you select that language, then change colors for each item under style
(newbies may find it hard to do this, dont worry, leave it as it is and exit the configurator, you will catch up later)

image 3 - thats where you need to select the language, in our case, it is PHP

and we are on our way to programming.


But before then, we need to understand the basics of what we are about to do.

Nice one webdezzi. . . . .  you're a GEM 


Pls i have a couple of questions:

1. can i use this PHP/MySQL/Apache combo on a window XP proffessional system that already has IIS running?
2. can i use this PHP/MySQL/Apache combo on a window XP Home Edition system?


Thanks for the education man!

@ruudie

yes, but you have to stop one for the other

So if you want to write asp, you might want to stop apache HTTP, from the system tray.
please note that if you prefer IIS, then forget about Apache, so we will be installing PHP on IIS

and yes again, you can use the 3 on windows xp home edition

@kehers,
yes, i assume everyone is on windows, if you are on linux, please go ahead and figure things out (you are definitely not new to installations)

Sorry, tutorials continue tomorrow

Lets install our PHP, (it really does not matter which one you install first, mysql or php)

However, you will need to install a web server before php, because without the web server, php can not work
see for yourself when installing php

It will ask what web server you want to use,
so for those asking if you can install php on iis, look at the picture and see where you have to do that.

Note: you will need to stop all running webservers for installation to be successful

For mysql, you can install it even before installing a webserver, thats because it is a service that can run independently

If you have problems with installing these guys, make a post and you will get help.

follow the procedures below for MySQL installation.