Are you prepared for web 2.0 programming?

kgun · #1 (**permalink**) 02-06-2007, 07:37 AM

This is some thoughs after reading the following books.

1. Jason E. Sweat: "php|architect's Guide to PHP Design Patterns".

http://www.phparch.com/gpdp

You can download the code for the book there, but it may be difficult to understand without the book.

I can highly reccomend it, since knowing design patterns, is about efficiency. In addittion the book trains you in TDD (Test driven developement) that is minimalism in practice. Buy it and learn design patterns. The time you spend in this may pay many times back. Start with the "adapter pattern" and you soon understand why.

2. Stuart Langridge: DHTML Utopia: Modern Web Design Using JavaScript & DOM.

Great book. This book is web 2.0 ready. It teaches you modern DOM and client (browser) scripting. If you want to learn AJAX, you should buy this book since it teaches you about the important DOM object that is important in AJAX programming. Read the last chapter where you make an efficient RSS parser by combining DOM scripting with the DOM query language XPath. XPath are like XLink and XPoint about increasing efficiency when you work on XML documents.

3. Rachel Andrew & Dan Shafer: "HTML Utopia: Designing Without Tables Using CSS, 2nd Edition."

Great for those that will learn more on CSS. The book has sample code, that may be of value in it's own.

Today I downloaded IE 7.0 to Windows XP. Now I hope that IE 7.0 is web 2.0 ready as are Firefox and Opera. There are so many problems with IE 6.0, especially CSS bugs, that I hope that this browser is soon history. I will personally not code for it. I code for the future and not for the past.

My definition of a web 2.0 ready browser:

Option to switch CSS style sheet: View + Page Style + Style sheet. This is important for usability and accessibility.
DOM object and XMLHttpRequest object implemented according to W3C standard.

Advice: If you use PHP and JS.

Learn design patterns. Forget PHP 4.x and lower if you do not need it to understand older code or have to upgrade older code to PHP 5.x. There are so many differences in PHP 5.x.
USC various CSS style sheets for different users and uses like mobile devices.

I will write much more about this on my site Web2Logistics.com that will be implemented in some days. I wish you good web 2.0 coding.

kgun · #2 (**permalink**) 02-06-2007, 11:10 AM

By the way, here is an example of how you connect different style sheets to a page for different users / uses.

<head>
<title>Footbag Freaks</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link rel="stylesheet" type="text/css" href="fixedwidth.css" title="default layout" />
<link rel="alternate stylesheet" type="text/css" href="zoom.css" title="zoom layout" />
</head>

Source: Andrew and Shafer: Chapter 10 page 296.

Related link: Alternative Style: Working With Alternate Style Sheets

florabalance · #3 (**permalink**) 02-06-2007, 12:18 PM

Quote:

Originally Posted by kgun

This is some thoughs after reading the following books.

1. Jason E. Sweat: "php|architect's Guide to PHP Design Patterns".

This book looks interesting to me, I am just starting to use php on our sites and it could be a timesaver.

kgun · #4 (**permalink**) 02-07-2007, 09:51 AM

Yes it is. You have to download SimpleTest if you will try the code.

Now I have a question regarding how this page:

http://www.kjellbleivik.com/AJAX/Cha...ions/xml/books

is shown in your browser. Here is what I see:

Default in IE 7.0

Server, tell me your favorite books!
Default in Opera 9.1

Server, tell me your favorite books!
Default in FireFox 2.0.0.1

<response>
−
<books>
−
<book>
−
<title>

Building Reponsive Web Applications with AJAX and PHP

</title>
<isbn>
1-904811-82-5
</isbn>
</book>
−
<book>
−
<title>

Beginning PHP 5 and MySQL E-Commerce: From Novice to Professional

</title>
<isbn>
1-59059-392-8
</isbn>
</book>
</books>
</response>

Can any browser expert tell me the reason why?

florabalance · #5 (**permalink**) 02-07-2007, 11:01 AM

In Firefox 2.0.0.1 I see this at the top of the page:

"This XML file does not appear to have any style information associated with it. The document tree is shown below."

kgun · #6 (**permalink**) 02-07-2007, 11:10 AM

Yes, I saw the same. But it is the same if I choose the different options under view + page style.

In my opinion, regarding accessibilty and usability Opera 9.1 has no real competitor in January 2007 as far as I can see.

DigitalPunkt.no is good in text view in Opera. No need to make a unique style sheet for text view and low vision users.

There are three files in this directory,

Books.html shown by IE and Opera by default.
Books.xml shown by FireFox by default. Is that natural when there is no CSS style sheet?
Books.js

// holds an instance of XMLHttpRequest
var xmlHttp = createXmlHttpRequestObject();

// creates an XMLHttpRequest instance
function createXmlHttpRequestObject()
{
// will store the reference to the XMLHttpRequest object
var xmlHttp;
// this should work for all browsers except IE6 and older
try
{
// try to create XMLHttpRequest object
xmlHttp = new XMLHttpRequest();
}
catch(e)
{
// assume IE6 or older
var XmlHttpVersions = new Array('MSXML2.XMLHTTP.6.0',
'MSXML2.XMLHTTP.5.0',
'MSXML2.XMLHTTP.4.0',
'MSXML2.XMLHTTP.3.0',
'MSXML2.XMLHTTP',
'Microsoft.XMLHTTP');
// try every prog id until one works
for (var i=0; i<XmlHttpVersions.length && !xmlHttp; i++)
{
try

{
// try to create XMLHttpRequest object
xmlHttp = new ActiveXObject(XmlHttpVersions[i]);
}
catch (e) {}
}
}
// return the created object or display an error message
if (!xmlHttp)
alert("Error creating the XMLHttpRequest object.");
else
return xmlHttp;
}

// read a file from the server
function process()
{
// only continue if xmlHttp isn't void
if (xmlHttp)
{
// try to connect to the server
try
{
// initiate reading a file from the server
xmlHttp.open("GET", "books.xml", true);
xmlHttp.onreadystatechange = handleRequestStateChange;
xmlHttp.send(null);
}
// display the error in case of failure
catch (e)
{
alert("Can't connect to server:\n" + e.toString());
}
}
}

// function called when the state of the HTTP request changes
function handleRequestStateChange()
{
// when readyState is 4, we are ready to read the server response
if (xmlHttp.readyState == 4)
{
// continue only if HTTP status is "OK"
if (xmlHttp.status == 200)
{
try
{
// do something with the response from the server
handleServerResponse();
}
catch(e)
{
// display error message
alert("Error reading the response: " + e.toString());
}
}
else
{
// display status message
alert("There was a problem retrieving the data:\n" +
xmlHttp.statusText);
}
}
}

// handles the response received from the server
function handleServerResponse()
{
// read the message from the server
var xmlResponse = xmlHttp.responseXML;
// obtain the XML's document element
xmlRoot = xmlResponse.documentElement;
// obtain arrays with book titles and ISBNs
titleArray = xmlRoot.getElementsByTagName("title");
isbnArray = xmlRoot.getElementsByTagName("isbn");
// generate HTML output
var html = "";
// iterate through the arrays and create an HTML structure
for (var i=0; i<titleArray.length; i++)
html += titleArray.item(i).firstChild.data +
", " + isbnArray.item(i).firstChild.data + "
";
// obtain a reference to the <div> element on the page
myDiv = document.getElementById("myDivElement");
// display the HTML output
myDiv.innerHTML = "Server says:
" + html;
}

kgun · #7 (**permalink**) 02-07-2007, 01:02 PM

To confuse even more: View

http://www.kjellbleivik.com/AJAX/Cha.../xml/books.xml

in IE and in Opera. In IE, you see the xml source file:

<?xml version="1.0" encoding="UTF-8" standalone="yes" ?>
- <response>
- <books>
- <book>
<title>Building Reponsive Web Applications with AJAX and PHP</title>
<isbn>1-904811-82-5</isbn>
</book>
- <book>
<title>Beginning PHP 5 and MySQL E-Commerce: From Novice to Professional</title>
<isbn>1-59059-392-8</isbn>
</book>
</books>
</response>

In Opera you se the parsed file:

Building Reponsive Web Applications with AJAX and PHP 1-904811-82-5 Beginning PHP 5 and MySQL E-Commerce: From Novice to Professional 1-59059-392-8

A new divergence for the major browsers?

I just downloaded the last versions of all three, so I assume that this is the default settings.

Of course, if you explicitely view the .html file

http://www.kjellbleivik.com/AJAX/Cha...xml/books.html

All three agree. Why not on default settings for

http://www.kjellbleivik.com/AJAX/Cha...ions/xml/books

or am I missing something?

kgun · #8 (**permalink**) 03-05-2007, 11:01 AM

There is a related thread here:

Whats new in web2.0 ?

Note that example links to my pages in this post are deleted because of reorganizing the site.

Thread Tools
Show Printable Version Email this Page
Display Modes
Linear Mode Switch to Hybrid Mode Switch to Threaded Mode