an introduction to xfb 1 xfb there's a fine line between genius and insanity. i have erased...
Post on 16-Jan-2016
235 Views
Preview:
TRANSCRIPT
An Introduction to XFB 1
XFB
There's a fine line between genius and insanity. I have erased this line.Oscar Levant
An Introduction to XFB 2
Origins of XFB
XFB (Extended Fusebox) grew out of a desire to tip the scale of project success.
XFB combines technical innovations (XFAs, query sims, nested circuits, nested layouts, integrated security, etc.) with project management features.
An Introduction to XFB 3
70% Failure
An Introduction to XFB 4
Req
uire
men
tsD
esig
n
Cod
ing
Test
ing
Del
iver
y
Time Expended
Nike Method
Arc
hite
ctur
e
An Introduction to XFB 5
Req
uire
men
ts/D
esig
n
Arc
hite
ctur
e
Test
ing
Del
iver
y
Time Expended
Extended Fusebox Method
Cod
ing
An Introduction to XFB 6
Main Points of XFB
Project Management– wireframes– prototypes– devnotes
Technical– xfas– fusedocs– nested circuits– nested layouts– query sims– security– assertions
An Introduction to XFB 7
Wireframe
An Introduction to XFB 8
Wireframe
Wireframes provide a "booster rocket" to help us escape the gravitational pull of our prejudices and assumptions about what clients want.
An Introduction to XFB 9
Wireframe
The wireframe is a skeleton-model of an application.
It is meant to help clients and developers discuss what an application should do.
An Introduction to XFB 10
Wireframe
An Introduction to XFB 11
Wireframe
An Introduction to XFB 12
Wireframe
Download available at www.bjork.net
An Introduction to XFB 13
Prototype w/DevNotes
An Introduction to XFB 14
Why a prototype?
"Requirements gathering" doesn't work The Musee d'Orsay in Paris wants to hire you
to reproduce a famous painting: Arrangement in Black and Grey No. 1
Specification: "The work shall be oil on canvas, 56-1/4" x 63-1/4"..."
An Introduction to XFB 15
Is this what they want?
An Introduction to XFB 16
Is this what they want?
An Introduction to XFB 17
Is this what they want?
An Introduction to XFB 18
Is this what they want?
An Introduction to XFB 19
Is this what they want?
An Introduction to XFB 20
THIS is what they want!
An Introduction to XFB 21
Why the prototype?
Clients can only tell you what they want after they see it
An Introduction to XFB 22
What is the prototype?
An Introduction to XFB 23
Leaving no "wiggle room"
The prototype The deployed application
An Introduction to XFB 24
An iterative process
The wireframe forms the basis for the first cut of the prototype
Prototypes have minimal code—and are often best handled by non-programmers
The prototype is refined through interaction with client and developer using DevNotes
An Introduction to XFB 25
What is DevNotes?
DevNotes is a simple, threaded message system that sits below each individual prototype page.
All issues related to the application are recorded as DevNotes
An Introduction to XFB 26
What are DevNotes used for?
Client direction: "Move the buttons to the left/Make the blue a little more like cornflower and less like slate"
Developer questions: "Where will the product information come from?/Is there an existing database or file with authorized users?"
Client answers: "I think the IT people have a spreadsheet or something with users."
An Introduction to XFB 27
What are DevNotes used for?
Developer self-notes: "Use JavaScript for client processing of this procedure"
An Introduction to XFB 28
Prototype freeze
We are done with the prototype when both client and developer are confident that – all questions regarding functionality have been
resolved– all content has been received from client– graphical interface/look and feel has been approved– any changes occurring after this point will either
become a new release or will be exorbitantly expensive
An Introduction to XFB 29
Fusebox architecture
An Introduction to XFB 30
Unplanned program flow
Module A
Module B
Module D
Module E
Module F
Module C
An Introduction to XFB 31
Architected program flow
Module A Module BModule D
Module EModule F Module C
An Introduction to XFB 32
A Fusebox request
Fusebox
loginUser
validateLogin
newUser
qryValidateLogin.cfm
validateLogin
actValidateLogin.cfm
the fuseaction
the fusebox
fuseactions
fuses
An Introduction to XFB 33
Fuses always make requests of the fusebox
<form action=“index.cfm” method=“post”><input type=“hidden”name=“fuseaction”value=“validateUser”>
<input type=“text” name=“username”><input type=“password” name=“password”><input type=“submit”>
</form> Fusebox
the fuseboxa fuse
An Introduction to XFB 34
The fusebox copies all URL and form variables into attributes scope
url.productID = 1027form.lastName = ‘Helms’
<cf_FormURL2Attributes>
attributes.productID = 1027attributes.lastName = ‘Helms’
An Introduction to XFB 35
The fusebox
The fusebox
<cfswitch expression = “#attributes.fuseaction#”>
<cfcase value=“loginUser”><cfinclude template=“dspLoginUser.cfm”>
</cfcase>…<cfcase value=“validateLogin”><cfinclude template=“qryValidateLogin.cfm”><cfinclude template=“actValidateLogin.cfm”>
</cfcase>
</cfswitch>
An Introduction to XFB 36
Fuseactions
The fuseaction is the motivating force in an application.
Suggestion: use name is form of verbNounPhrase such as:– addItemToCart– getUserInfo– showProductInfo
An Introduction to XFB 37
The fusebox
The fusebox
<cfswitch expression = “#attributes.fuseaction#”>
<cfcase value=“doSomething”><cfinclude template=“aFuse.cfm”>
</cfcase>….<cfcase value=“doSomethingElse”>
<cfmodule template=“anotherFuse.cfm”></cfcase>
</cfswitch>
An Introduction to XFB 38
Including a fuse
The fusebox
<cfswitch expression = “#attributes.fuseaction#”>
<cfcase value=“doSomething”><cfinclude template=“aFuse.cfm”>
</cfcase>….<cfcase value=“doSomethingElse”>
<cfmodule template=“anotherFuse.cfm”></cfcase>
</cfswitch>
anotherFuse.cfm
yetAnotherFuse.cfm
aFuse.cfm
“doSomething”
The fuseaction
The fuses
An Introduction to XFB 39
Nested circuits
An Introduction to XFB 40
Benefits of nested circuits
More and easier code reuse Independent, concurrent development of code
modules Descendant modules inherit variables from
parents Variables from parents are inherited by children Layout files can be nested Exceptions bubble upwards
An Introduction to XFB 41
XFB nested circuits
An Introduction to XFB 42
Conflicting circuit names
An Introduction to XFB 43
Resolving circuit naming conflicts
Create a Circuits.cfm file Alias name conflicts
bpcf/completed/circuits.cfm
An Introduction to XFB 44
FB3: nested circuits
Fusebox 2 worked with the concept of a federation of circuits,each having to know of the existence of each other
Fusebox 3 works with the concept of interchangeable circuits that can be reused in different applications
An Introduction to XFB 45
Inheritance
<cfset dsn = "OurApplication">
<cfquery datasource=#dsn#>
An Introduction to XFB 46
Bubbling exceptions
Lets architect determine where certain exception types will be handled
Lets coder write fuses without worrying about handling certain classes of exceptions
An Introduction to XFB 47
<!-- index.cfm --><cftry>
<cfcatch type=“UserAlert”><script>
alert(</script>
</cfcatch></cftry>
<!-- index.cfm -->
Example: Bubbling exceptions
<!-- aFuse.cfm --> <cftry> <cfinclude template=“myPage.cfm”> <cfcatch> <cf_LogException
message=“#cfcatch.message#”><cfthrow type=“UserAlert”></cfcatch>
</cftry>
An Introduction to XFB 48
XFAs
An Introduction to XFB 49
XFAs
A typical Fusebox 2 page has fuseactions hardcoded in place.
Examples:– <form action="index.cfm?
fuseaction=updateProductInfo">– <a href="index.cfm?fuseaction=showUserMenu">– <cflocation url="index.cfm?
fuseaction=showMainPage">
An Introduction to XFB 50
XFAs
XFAs are variables that lets fuseactions be resolved at run time
Examples– <form action="index.cfm?
fuseaction=#XFA.submitForm#">– <a href="index.cfm?fuseaction=#XFA.next#">– <cflocation url="index.cfm?
fuseaction=#XFA.home#">
An Introduction to XFB 51
Identifying XFAs
Mark up the prototype for any exit points – any point at which the user or the system can make another fuseaction request
An Introduction to XFB 52
Identifying XFAs
An Introduction to XFB 53
Assigning values to XFAs
Login XFA.submitForm validateUserLogin Login Validation XFA.success showMainCatalogPage Product Detail XFA.buyItem addItemToCart Cart XFA.adjust quantities adjustCartQuantities Cart XFA.removeItem removeItemFromCart Registered User XFA.editInfo editUserInfo Registered User XFA.saveInfoUpdate saveUser Admin Page XFA.newUser newUser
Identifying common nouns
An Introduction to XFB 54
Identifying circuit and fuseaction
An Introduction to XFB 55
Identifying needed fuses
An Introduction to XFB 56
Fusedoc
An Introduction to XFB 57
Fusedocs
Provide documentation/PDL (program design language) for each fuse
Tells coder what they need to know to write a fuse without knowledge of the application
XML-based with DTD for validation
An Introduction to XFB 58
Nested layouts
An Introduction to XFB 59
<cf_bodycontent> tag
Used to capture the output of code and save as a request-scoped variable
Replaced in ColdFusion release 5 with <cfsavecontent>
An Introduction to XFB 60
Example <cf_bodycontent>
<cf_bodyContent name="me"><cfset reverseColor = RandRange( 0, 1 )>
<table border="2"> <tr> <td>I am the left side</td> <td>I am the right side</td> </tr> </table></cf_bodyContent>
<cfinclude template="layout.cfm">
An Introduction to XFB 61
Example <cf_bodycontent>
<cfoutput><cfset thebg = "white"><cfset thefg = "black">
<cfif reversecolor><cfset thebg = "black"><cfset thefg = "white">
</cfif>
<style>td{ background-color : #thebg#; color : #thefg#; }</style>
<p>#request.me#</p></cfoutput>
XMLSpy/FD4validateLogin.cfm
An Introduction to XFB 62
Nested layouts
Nested circuits
Parent
Child
GrandChild
UKDAXF/SampleFB3/
An Introduction to XFB 63
Post-processing decision making
Because the child is returned to the parent as a variable (rather than simply output onto the screen), the parent can make decisions based on the results of the child's processing
An Introduction to XFB 64
Implementing nested layouts
Wrap the code in index.cfm with <cfsavecontent> (version 5) or <cf_bodycontent> (version 4) using the circuit's alias as the name of the variable
(Illustration next)
An Introduction to XFB 65
Implementing nested layouts
<cfsavecontent variable="Users"> <cfinclude template="app_locals.cfm"><!--- Peel off the first layer and determine whether to delegate the fuseaction. ---><cfif ListLen( attributes.fuseaction, '.' ) GT 1> <cfinclude template="#ListFirst( attributes.fuseaction, '.' )#/index.cfm"><cfelse><!--- I'm going to get one (and only one) fuseaction at a time. Fuseactions correspond to methods or messages in OO languages. ---> <cfswitch expression = "#attributes.fuseaction#"> <cfcase value="home">
<cfinclude template="UserInfo.cfm"> </cfcase> <cfdefaultcase>
<cfoutput> I am the #GetDirectoryFromPath( GetCurrentTemplatePath())# fusebox and I received a fuseaction called <B><FONT
COLOR="000066">"#attributes.fuseaction#"</FONT></B> that I don't have a handler for.
</cfoutput> </cfdefaultcase> </cfswitch></cfif> </cfsavecontent>
An Introduction to XFB 66
Implementing nested layouts
If the child is to display something, call the layout file after the <cfsavecontent> tag
<cfinclude template="dsp_layout32a.cfm">
An Introduction to XFB 67
Query sims
An Introduction to XFB 68
Query sims
Provides a simulated query to work with code Allows code architecture to be done before all
database decisions have been finalized Provides instruction to SQL coders on what
information is needed Lets architect determine data variable names
test/QSimSample
An Introduction to XFB 69
Test harnesses
Provides an easy-to-implement way of unit-testing fuses
Should accompany all completed fuses
An Introduction to XFB 70
Example: test harness
<cfset self=“TestMe.cfm”><cfset XFA.submitForm = “”><cfset XFA.cancelForm = “”><cfset attributes.userID = “101”>
<cfinclude template=“dspEditUser.cfm”>
An Introduction to XFB 71
Proving the concept
We all agree that your theory is crazy, but is it crazy enough?Niels Bohr
An Introduction to XFB 72
top related