Main Content

Using server side and client side programming together

Archive - Originally posted on "The Horse's Mouth" - 2008-08-11 17:06:14 - Graham Ellis

I was back for first principles this morning for a delegate who - though very much an experienced programmer - is new to web work and HTML, and I put together a series of demonstrations using various web components ...

1. A straightforward HTML page, including document definition, a head and a body section, all carefully formed using Transitional XHTML. In separate windows - run the code and view source

2. Adding in some server side programming - in the form of PHP - to make the XHTML sent to the browser change depending on a calculation. The calculation of our example is simply to work out the date and time (including day of the week) and include them in the page. In separate windows - run the code and view source

3. For regular reporting and monitoring applications, you'll want a web page that's regularly updated - and the next step was for us to add in a refresh capability so that the page is updated automatically once a minute. In separate windows - run the code and view source

4. So far, our web page looks fairly basic - but it can look far smarter if we apply style / cascading style sheets, which we did in the next example. In separate windows - run the code and view source

5. A picture paints a thousand words, so let's add a graphic (.jpg) to our web page. In separate windows - run the code and view source

6. Finally, we used a Javascript program running in the browser to resize the image to fit the width of the window, and to resize it again if our user resizes the window once the page has loaded too. In separate windows - run the code and view source

There you are, then - XHTML, Server side programming (PHP), Client pull refresh, Style sheets (CSS), Images (JPG) and client side programming (Javascript) all in the one example - a mini "HOWTO" showing you how the various elements can be used together.