ColdDuck – beautiful documentation for ColdFusion CFCs

Background

I have been a consumer of the Sencha ExtJS documentation for a while now and wanted to be able to use JSDuck for my ColdFusion CFCs. But how? While I am a JSDuck novice I figured that trying to make JSDuck produce documentation directly from ColdFusion CFCs was likely to result in tears (mine!). So, after some thought, I came up with another strategy that users of other programming languages might want to consider.

My CF to JSDuck strategy

Mark Mandel’s ColdDoc can be extended to produce different kinds of output by utilising a “strategy” cfc. It comes with one that produces the JavaDoc style HTML format. Strategies utilise the CF ComponentMetaData. So, I made my own strategy that takes ColdFusion CFCs and makes a pseudo-app in JavaScript code that is annotated using JSDuck formatting. Of course it auto-documents functions etc and picks up the ‘hint’ attributes where it finds them and uses all that to produce the raw material for rich documentation. It also works with CF ORM CFCs (although this part could be made even richer than it is at present).

Video overview

Here is a really quick video to give an overview of what ColdDuck does: http://www.screencast.com/t/5p4JqbvNR

Documentation

The ColdDuck package includes the documentation. You can also view it here http://murrah.com.au/coldduck/docs

Sample output

Here is the sample SuperBlog app documented with ColdDoc in JavaDoc format

Here is the sample SuperBlog app documented with ColdDuck in JSDuck format

A full implementation of JSDuck style documentation is here http://docs.sencha.com/extjs/4.1.3/

Almost all of that JSDuck functionality is available for you to use for your ColdFusion projects. I say “almost” because there are a few JSDuck features that are JavaScript specific (eg view JS class source).

Installation

Get it at GitHub https://github.com/murrah/ColdDuck

I hope you find this useful and fun. Please leave your comments below.

Thanks,
Murray

Ext – Adding a tree to the portal example

For a project I am working on I wanted to add a tree to a viewport. There is a portal example on the Ext web site that features an accordion control in the west panel. It took a while to figure out how to replace that accordion with a tree even though the method turned out to be quite simple.

See this post on the Ext forum for the key piece of information from another Ext user:
http://extjs.com/forum/showthread.php?t=14445

See this working version (and files to download) on my web site:
http://www.murrah.com.au/samples/ext/portal/portal.cfm

Ext JS library and Coldfusion

I am enjoying using the Ext JS 2.0 library and at the same time finding it very frustrating due to a lack of well documented examples. The library is a very comprehensive object oriented Javascript library that is aimed at building data rich web applications.

To help others (especially Coldfusion programmers like me) I have started an Ext & Coldfusion wiki page on the Ext site that will, I hope, become a central place for CF programmers to leave tips about how to integrate CF and Ext.

The wiki is at http://extjs.com/learn/Manual:Resources:ColdFusion