ColdFusion Has Many Roles to Play
Finishing up my series on my idea of why I am drawn to ColdFusion is my final point - ColdFusion has many roles to play. ColdFusion doesn't force you to use only it for all layers of your web application. You can selectively choose to use ColdFusion for as much or as little of your application as you want. ColdFusion doesn't just allow this, like everything else, it makes it easy. Off the top of my head here are some uses cases for ColdFusion in your application:
- Traditional HTML generated application by ColdFusion
- Complete client layer using built in ColdFusion AJAX components
- Back end to AJAX driven front end using cfajaxproxy
- Back end to Flex application using Flash Remoting or LiveCycle Data Services ES
- Bridge between your application and messaging services (JMS, SMS, XMPP) with Event Gateways
Let's start with the traditional HTML generated application:
<cfquery name="qry" datasource="cfartgallery">
SELECT *
FROM app.artists
</cfquery>
<table>
<tr><th>Name</th><th>City</th><th>State</th></tr>
<cfoutput query="qry">
<tr><td>#firstName# #lastName#</td><td>#city#</td><td>#State#</td></tr>
</cfoutput>
</table>
Sure, I can just take a query and pass it to an HTML renderer and... instant data screen. ColdFusion can do the entire thing. But that code would provide a poor user experience. That table is pretty much just phoning it in. Instead, I can use ColdFusion's built in AJAX features to make a better UI using a datagrid.
First I have to move the query to a CFC, and run it through a simple function that formats the data for the datagrid:
<cfcomponent output="false">
<cffunction name="list" access="remote" returntype="query">
<cfset var qry = "" />
<cfquery name="qry" datasource="cfartgallery">
SELECT *
FROM app.artists
</cfquery>
<cfreturn qry />
</cffunction>
<cffunction name="listForGrid" access="remote" returntype="struct" returnformat="json">
<cfargument name="page" type="numeric" required="true">
<cfargument name="pagesize" type="numeric" required="true">
<cfargument name="sortcol" type="string" required="false">
<cfargument name="sortdir" type="string" required="false">
<cfreturn queryConvertForGrid(list(), arguments.page, arguments.pagesize) />
</cffunction>
</cfcomponent>
Once that is done, I can call that CFC from a datagrid component:
<cfform name="tableform">
<cfgrid format="html" name="grid"
bind="cfc:data.listForGrid({cfgridpage},{cfgridpagesize},{cfgridsortcolumn},{cfgridsortdirection})">
<cfgridcolumn name="firstName" header="First Name" >
<cfgridcolumn name="lastName" header="Last Name" >
<cfgridcolumn name="city" header="City" >
<cfgridcolumn name="state" header="State" >
</cfgrid>
</cfform>
Or I can instead opt out of using ColdFusion UI components, and either roll my own or use an established framework (both using cfajaxproxy):
<cfajaxproxy cfc="data" jsclassname="cfData" />
<s cript type="text/javascript" src="qtt.js" />
<div id="dataTable" />
<s cript type="text/javascript">
var cfData = new cfData();
cfData.setSyncMode();
cfData.setQueryFormat('column');
datatable = document.getElementById('dataTable');
res = cfData.list();
table = queryToTable(res);
datatable.appendChild(table);
function queryToTable(result){
table = document.createElement('table');
tbody = document.createElement('tbody');
for(i=0;i<res.ROWCOUNT;i++){
row = document.createElement('tr');
cellFname = document.createElement('td');
txtFname = document.createTextNode(res.DATA.FIRSTNAME[i]);
cellFname.appendChild(txtFname);
row.appendChild(cellFname);
cellLName = document.createElement('td');
txtLName = document.createTextNode(res.DATA.LASTNAME[i]);
cellLName.appendChild(txtLName);
row.appendChild(cellLName);
cellCity = document.createElement('td');
txtCity = document.createTextNode(res.DATA.CITY[i]);
cellCity.appendChild(txtCity);
row.appendChild(cellCity);
cellState = document.createElement('td');
txtState = document.createTextNode(res.DATA.STATE[i]);
cellState.appendChild(txtState);
row.appendChild(cellState);
tbody.appendChild(row);
}
table.appendChild(tbody);
return table;
}
</script>
If, however, I wanted to go with something other than HTML/JavaScript for the front end, I still have options. ColdFusion is perfectly suited to act as a back end for Flex. In fact that CFC above still works with Flex. To call it from Flex I just have to point an end point to it and add a datagrid:
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" applicationComplete="getList(event)">
<mx:Script>
<![CDATA[
import mx.collections.ArrayCollection;
import mx.rpc.events.ResultEvent;
[Bindable]
private var ac:ArrayCollection;
private function onResult( e : ResultEvent ) :void
{
ac = e.result as ArrayCollection;
}
private function getList( e:Event ) :void
{
ws.list.send();
}
]]>
</mx:Script>
<mx:RemoteObject id="ws" destination="ColdFusion" source="CFisEasy.roles.data">
<mx:method name="list" result="onResult(event)" />
</mx:RemoteObject>
<mx:DataGrid left="10" right="10" top="10" bottom="10" dataProvider="{ac}" />
</mx:Application>
But let's say that you instead wanted to interact with some sort of other interface like SMS, JMS, or as in the following example, an XMPP client using Gtalk:
<cffunction name="onIncomingMessage" output="false">
<cfargument name="incomingIM" type="struct" required="true" />
<cfset var outgoingIM = StructNew() />
<cfset var data = createObject("Component", "data") />
<cfset var people = data.list() />
<cfset var message ="" />
<cfloop query="people">
<cfset message = message & "#firstName# #lastName# #city# #state# #Chr(10)#" />
</cfloop>
<cfset outgoingIM.BuddyID = arguments.incomingIM.Data.sender />
<cfset outgoingIM.Message = message />
<cfreturn outgoingIM />
</cffunction>
That's a lot of mileage out of that little query. From that simple query, I've rendered a plain old HTML page, a ColdFusion AJAX display page, a custom written AJAX-driven page, a Flex display component, and a Gtalk Bot. That's what I mean by ColdFusion can play lots of roles. It can do the whole thing, or just part of it. Combine that with the concepts in my previous post, and ColdFusion can do the following:
- Act as a front end to business logic written in Java or .Net
- Act as a back end to a front end written in Flex or HTML/Javascript
- Act as a messenger from a back end written in Flex or Java to a front end written in Flex
- Act as a messenger between all of these and a messaging service
- And of course, it can be your front end, back end, and messenger all in one
The idea here is that when you use ColdFusion, you can either use it full hog, or selectively swap in technologies that better address your needs. ColdFusion doesn't lock you in; quite the opposite, it opens doors for you.
1 response so far ↓
1 charlie arehart
Very, very nice post, Terry. Not only a great apologetic for CF, but a succinct and compelling demo of functionality to help the converted appreciate the power at their fingertips. Thanks for doing it.Actually, this could make a nifty user group talk (just showing the examples, and expanding on things a little). If you may be interested, I'm always happy to have any CF speakers on my weekly Online ColdFusion Meetup (coldfusionmeetup.com), and now (in your new role) as much as before, you'd be most welcomed. If you may be interested, drop me a note: charlie at carehart dot org. If you can't do it for some reason, flat out too busy for several weeks, let me know if you'd prefer to have me put one together. It really does deserve to be highlighted. I'd even propose doing it as an Adobe Dev Center article, and again if you can't get the time to do it, I'd be willing to co-author something.
Keep up the good work.
Leave a Comment