Part 3 Of 5 - Under The Web 2.0 Hood!

Today we will review the technologies that are empowering these inspirational websites throughout the web 2.0 universe. We won’t be covering every single one but we will cover the technologies that most sites are running under the hood.

Ajax

The first of these technologies is Ajax or AJAX. Ajax is short for Asynchronous Javascript and XML and is the most talked about language when discussing web 2.0. Ajax is a combination of technologies put together. XHTML and CSS are used for the markup, as the World Wide Consortium recommends. DOM scripting is part of the Ajax philosophy, too. XML is used to format and store data that’s transferred between client and server. Finally, and most importantly, Ajax scripts make use of the XMLHttpRequest object. This is a programming object developed by Microsoft (now validated by the W3C) that enables client-side scripts to communicate with server-side data.

Ajax isn’t something you can learn about overnight. Heres a site you can use if you want to pursue learning Ajax http://www.ajaxpatterns.com Ajaxpatterns comes in handy, with explanations of Ajax technologies, examples and templates for frequently deployed functionality. Pay attention to the section on frameworks. These are prefabricated code libraries, like Prototype http://prototype.conio.net that make developing Ajax easier.

Dom Scripting

The second technology is DOM Scripting. A distant cousin to DHTML, DOM Scripting is the unsung hero of Web 2.0. Ajax takes all the plaudits, while a lot of web 2.0 scripting is actually DOM scripting. DOM Scripting is using embedded markup or client-side scripting to access and change the Document Object Model. Simply put, the DOM is the structure of your web page. This structure is hierarchical, similar to the nested directories and folders of a file system. Each element, or node, in a document can be described and located buy its position in this structure.

For example, an ‘img‘ inside a CSS div block is the ‘child‘ of the div element. In turn, both are children of the body element. An easy way to look at the Document Object Model of a page is by using Firefox or Mozilla. Go to TOOLS>DOM INSPECTOR (you may need to install your browser again to choose this option). You’ll see a branch representation of the document structure.

If you know the structure of a page, you can target any element within it. You can make scripting even easier for yourself by giving page element a unique ID. In this case, you can refer to any element using ‘getElementById‘ using Javascript. You can even update elements without refreshing the original page.

Ruby On Rails

The third technology we’ll cover today is Ruby On Rails. While Ajax is a collection of technologies aimed at making web pages more responsive and interactive, Ruby is a full-blown programming language. Its intuitive syntax and rapid development environment have made it popular among web application developers. Rails is a web-based framework for deploying Ruby-built applications.

There are plenty of sites that already run on Rails, many of them exemplars of Web 2.0 technologies. There’s Ta-Da List www.tadalist.com an online ‘to do’ facility; YubNub http://yubnub.org a social networking service; and Shopify http://shopify.com an online shop builder. There are web development active sites that run on Rails, too such as A List Apart www.alistapart.com.

The hub for Rails itself is www.rubyonrails.com a slick, heavily documented site that acts as an ideal starting point for anyone new to Ruby On Rails (or new to programming in general). There’s a free download of the Ruby on Rails framework, lots of on line documentation and, for a few, full books documenting Ruby in more detail.