Publishing dynamic content on your website in a format that you can style with CSS has gotten a whole lot easier with Google’s simple JSON based Javascript API’s. The two I’ve found myself playing with lately are the Google Ajax Feed API for publishing RSS and Atom feeds and the Google Spreadsheet API
for publishing little snippets of text that should be easily editable.

Say you want a simple headline on your homepage that you can change daily. Here’s how you’d do it with the Google Spreadsheet API:

1. Create a spreadsheet making the first row the column headers (important because you’ll refer to the cell by the column header):

2. Go to the publish tab and publish the spreadsheet: http://spreadsheets.google.com/pub?key=pouqRkV5D_eZT_VdOKu7CQA. Note in this example the key is pouqRkV5D_eZT_VdOKu7CQA

3. Use a simple container div and some javascript to display the field:

<div id="headline"></div>

<script type="text/javascript">

function displayContent(json) { document.getElementById('headline').innerHTML = json.feed.entry[0].gsx$html.$t; }

</script>

<script type="text/javascript" 

src="http://spreadsheets.google.com/feeds/list/<b>pouqRkV5D_eZT_VdOKu7CQA</b>/od6/public/values?alt=json-in-script&amp;callback=displayContent"&gt;

&lt;/script&gt;

Note: the spreadsheet key in the URL that needs to be replaced. Also, entry[0] refers to row 2 in the spreadsheet (because row 1 contains the column headers and is not considered an entry):

4. The text appears dynamically on the page:

Palm releases Linux based Foleo

5. When it’s time to update, make your changes to the spreadsheet, go the publish tab, and republish it and the changes will appear on your site!

The only real downside I can think of with this simple approach is that it’s not SEO friendly so if you want all search engine crawlers to follow those links you publish, you’re better off with a non-javascript solution. The Spreadsheets API google group is a good resource and Pamela Fox has some examples to look at.

Let’s take a look at what it takes to put a simple unordered list on a page with a refresh button to refresh the list without doing and page reload and then we’ll spruce it up a bit:

1. First we’ll need a URL that should return the content of the list and say we’re working in a crusty old CGI environment so we’ll call it /cgi-bin/friends_online.cgi and say it returns the list of your friends that are online:

<ul>
<li>Mr Bigglesworth</li>
<li>Austin Powers</li>
</ul>

2. Now on the page where we want to include the list of our friends that are online we’ll need to include prototype.js in the head section of the page:

<script src="/js/prototype.js" type="text/javascript"></script>

3. Let’s look at how simple this can be:

<div id="friends_online">
... friends online ...
</div>
<a href="javascript:var x=new Ajax.Updater('friends_online','/cgi-bin/friends_online.cgi')">Refresh</a>

When you hit the refresh button the contents of the friends_online div will be replaced with the output from friends_online.cgi, it’s that easy! Now let’s spruce it up a bit.

4. Since we’re not concerned with server load in this example we’ll populate the dynamic list using Ajax the first time the page loads as well. While we’re at it let’s also hide the Refresh button and friends_online div while the refresh is happening and display an animated loading gif. Here’s what that would look like:

<div id="friends_online"></div>
<img id="loading" src="loading.gif" alt="Loading"/>
<a id="refresh" href="javascript:friendsOnline()">Refresh</a>

<script type="text/javascript">
function friendsOnline() {
	$('friends_online').style.display = 'none';
	$('refresh').style.display = 'none';
	$('loading').style.display = 'inline';
	new Ajax.Updater('friends_online', '/cgi-bin/friends_online.cgi', {
		parameters: 'key=value&key2=value2',
		method: 'get',
		onComplete: function () {
			$('friends_online').style.display = 'block';
			$('refresh').style.display = 'inline';
			$('loading').style.display = 'none';
		}
	});
}
Event.observe(window, 'load', friendsOnline, false); // This calls friendsOnline on page load
</script>

I put in the parameters just to illustrate how to pass parameters with the URL. If I were to take this one step further I’d put the Javascript into a separate .js file and use Script.aculo.us Effects.js BlindUp and BlindDown to animate hiding and un-hiding the friends_online div. Hopefully you can see how much power Prototype gives you and how easy it can be to Ajax enable a legacy web application!

1. Rails is a one stop shop with a web MVC framework that has AJAX support, an OR Mapping framework, logging framework, default directory structure, unit testing, functional testing, etc… Bottom line is that it’s much easier for someone to get productive quickly in RoR learning good practices such as TDD than in any equivalent Java setup. Heck, at work we still don’t have a good functional web testing framework for the programmers to use because after some tinkering I still couldn’t get it to start Tomcat, deploy, and run the HttpUnit tests reliably. The first time I tried Rails, the logging, mvc framework, OR Mapping, web services integration, functional tests, unit tests, etc… just worked, wow!
2. Rails let’s you learn things when you’re ready to whereas in Java, just to get my projects off the ground, I have to understand the build system, Hibernate configuration files, web.xml, log4j configuration, my MVC configuration, etc… I still don’t know the first thing about Rake (the build system) even though I’ve built a couple small web projects in RoR and you know what, that’s a real testament to how well it does it’s job. I’m focusing on solving my business problem now, not on learning a build system! Similarly there are massive black holes in my knowledge around ActiveController, ActiveRecord, Rails’ AJAX support, etc… but it hasn’t stopped me from using those features and being productive! I hope to learn the ins and outs of these components eventually but that’s in direct contrast to Java where you have to front-load tons of knowledge to be productive!
3. Rails recognizes that in the real world there are differences between your dev, test, and production environment whereas I’ve always had to roll my own solution in Java whether it’s through JNDI or the creative use of property files. The key here is that in Rails you have all of those settings in your project under source control making it easy to lookup how a setting differs between test and production, with JNDI that information is stored on the server but it’s irrelevant because everyone does it differently anyhow.
4. The Rails community recognized the need for a production deployment solution and came out with Capistrana (ex SwitchTower) whereas in Java with Tomcat we had to write our own from scratch that goes to our 10 application servers, takes each one out of production, deploys the WAR, performs a test, and then brings it back into production before moving onto the next server.
5. Jumping in on an existing Rails project should be easy because there are strong conventions whereas in Java every project does almost everything a little differently. You have to learn the Ant targets, the project source layout, how dependencies are managed, how they deploy into Tomcat, and so on. Maven certainly helps address this issue in the Java space but it’s adoption rate is low compared to Ant.

That said, there are still things I really like about Java. For starters I’m an Emacs to IDE convert and nothing compares to the refactoring and code analysis capabilities of JetBrains Idea. Since Ruby is dynamically typed, no IDE will ever support the degree of refactoring we enjoy in Java. Also, once you have your Java environment setup and everything integrated and working, developing new web pages is fast. For example when I develop in Idea I can change a class or a web page and hit refresh in my browser just like I do in Ruby. Since we use JSPX and TAGX files, IDEA tells me if my XHTML is not well-formed XML… I could go on and on.

Suffice it to say that I still like Java but I’m loving that there’s some fierce competition on the block and I hope someday to have the opportunity to develop a large software project in Rails. If you still have your doubts about Ruby on Rails, read Agile Web Development with Rails, it’s a great book that will knock your socks off!

Related reading: Keith Pitty looks at Java versus Ruby on Rails