Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.
IntroductionTo….
WHO AM I?
• Luis Majano
• Computer Engineer
• Born in El Salvador ->Texas
• CEO of Ortus Solutions
• Adobe Community Profe...
What is MVC
Benefits of MVC
What is ColdBox
How it works
Demo
What is MVC?
• One of the most common UI design patterns
• Separates logic into three tiers or layers
• Model
• View
• Con...
What’s the problem?
CFMTemplate
Queries
If statements
URL/Form
Cleanups
CFC calls
HTML/JS/CSS
Embedded CFC
calls
Embedded
...
What is the problem?
• CFM page for each URL in the application
• Pages execute from top to bottom
• Typically 100's of li...
Spaghetti Apps
Spaghetti Fun Comments
<!—- Do not remove the following lines or things break —>
<!— Dont’ know what this variable does, b...
Downsides
• Hard to maintain, especially as application evolves
• Hard to distribute work to teams
• Code duplication
• Vi...
Benefits of MVC
• Separation of Concerns
• Same model – different views (GUIs)
• Increase Maintainability
• IncreaseTestabi...
A
FUNDAMENTAL
CHANGE IN
APPROACH OR
UNDERLYING
ASSUMPTIONS.
PARADIGM SHIFT:
MODERNIZE…
WHAT IS COLDBOX
• HMVC = Hierarchical MVC
• Conventions Based Framework
• Non-intrusive
• Includes:
• Modules
• REST
• Dep...
TRUSTED BY INDUSTRY LEADERS
Since 2006
MVC CONCEPTS
Event

Handlers
(C)
Request
Context
(Form, Url,
Request)
Layouts 

& 

Views
(V)
Models
(M)
Config
(App,Router...
HOW IT WORKS?
• Single page index.cfm (front controller)
• Executions via form/url with param called event
• Request Conte...
REQUEST CONTEXT
Request Collection (RC)
REMOTE
URL
FORM
• FORM/URL/Remote = RC
• FORM variables take precedence
• Private ...
COLDBOX MVC LAYERS
Domain Model
Layer
ANATOMY OF A ROUTED URL
• Package = A Directory in the handlers folder
• Handler = A handler CFC in the handlers folder
• ...
App Structure
handlers
layouts
models
modules
views
config
modules_app
Tracked by
CommandBox
Custom
ColdBox.cfc
Router.cfc
...
HANDLER CODE
component name=“users”{
property name=“myService” inject=“MyService”;
    function index( event, rc, prc ){
 ...
MODEL CODE
component
extends="cborm.models.VirtualEntityService" singleton{
    function init(){
super.init( entityName="U...
LAYOUT CODE
<cfoutput>
#html.doctype()#
<body>
<div id=“header”>#renderView(‘header’)#</div>
<div id=“content”>#renderView...
RENDERING ENGINE
Event, RC, PRC, HTML
Footer
Header
Content
Layouts
VIEW CODE
<cfoutput>
#html.startForm(action=“user.login”)#
<h1>Login: #encodeForHTML( rc.name )#</h1>
#prc.messages#
#html...
DemoTime
Let’s build a Contacts API
Intro to ColdBox MVC at Japan CFUG
Intro to ColdBox MVC at Japan CFUG
Intro to ColdBox MVC at Japan CFUG
You’ve finished this document.
Download and read it offline.
Upcoming SlideShare
What to Upload to SlideShare
Next
Upcoming SlideShare
What to Upload to SlideShare
Next
Download to read offline and view in fullscreen.

0

Share

Intro to ColdBox MVC at Japan CFUG

Download to read offline

A presentation on the basics of ColdBox MVC given at the Japan ColdFusion User Group

Related Books

Free with a 30 day trial from Scribd

See all

Related Audiobooks

Free with a 30 day trial from Scribd

See all
  • Be the first to like this

Intro to ColdBox MVC at Japan CFUG

  1. 1. IntroductionTo….
  2. 2. WHO AM I? • Luis Majano • Computer Engineer • Born in El Salvador ->Texas • CEO of Ortus Solutions • Adobe Community Professional • ColdFusion (CFML) Advocate • Adobe Advisory Committee • Lucee Language Committee • Sandals -> ESRI -> Ortus @lmajano @ortussolutions
  3. 3. What is MVC Benefits of MVC What is ColdBox How it works Demo
  4. 4. What is MVC? • One of the most common UI design patterns • Separates logic into three tiers or layers • Model • View • Controller • Separation of concerns is KEY • Time to evolve your spaghetti code M C V
  5. 5. What’s the problem? CFMTemplate Queries If statements URL/Form Cleanups CFC calls HTML/JS/CSS Embedded CFC calls Embedded Queries Tags More Queries More CFC calls Includes?Includes Spaghetti Hell
  6. 6. What is the problem? • CFM page for each URL in the application • Pages execute from top to bottom • Typically 100's of lines of code per page • I have seen 1000’s • Mix of business logic and display code • Maybe some code reuse via <cfinclude> or custom tags or basic CFCs CFMTemplate Queries If statements URL/Form Cleanups CFC calls HTML/JS/CSS Embedded CFC calls Embedded Queries Tags More Queries More CFC calls Includes?Includes
  7. 7. Spaghetti Apps
  8. 8. Spaghetti Fun Comments <!—- Do not remove the following lines or things break —> <!— Dont’ know what this variable does, but don’t touch it —-> <!—- Remove at your own risk —-> <!—- I have no idea where this variable is set —>
  9. 9. Downsides • Hard to maintain, especially as application evolves • Hard to distribute work to teams • Code duplication • Violates the D.R.Y. principle • Can't build an API from the business logic • Can't perform automated tests on the business logic • At the end: it costs time -> money!
  10. 10. Benefits of MVC • Separation of Concerns • Same model – different views (GUIs) • Increase Maintainability • IncreaseTestability • Increase Decoupling • Better Abstractions
  11. 11. A FUNDAMENTAL CHANGE IN APPROACH OR UNDERLYING ASSUMPTIONS. PARADIGM SHIFT: MODERNIZE…
  12. 12. WHAT IS COLDBOX • HMVC = Hierarchical MVC • Conventions Based Framework • Non-intrusive • Includes: • Modules • REST • Dependency Injection • Caching • Logging • IntegrationTesting • Addresses most infrastructure concerns when doing web applications
  13. 13. TRUSTED BY INDUSTRY LEADERS Since 2006
  14. 14. MVC CONCEPTS Event
 Handlers (C) Request Context (Form, Url, Request) Layouts 
 & 
 Views (V) Models (M) Config (App,Router) Interceptors (Event 
 Driven Programming)
  15. 15. HOW IT WORKS? • Single page index.cfm (front controller) • Executions via form/url with param called event • Request Context (Simulates Client Request) • form/url » RC • PRC » Private Struct • Handlers Controls what happens next? • Layout/View • Relocation • Data http://localhost/index.cfm?event=users.index http://localhost/users/index Traditional *Routing ColdBox Event: users.index
  16. 16. REQUEST CONTEXT Request Collection (RC) REMOTE URL FORM • FORM/URL/Remote = RC • FORM variables take precedence • Private Request Collection (PRC) = request scope • Abstractions • Best practice to separate what’s client and what’s your app • Live inside the Request Context Object • coldbox.system.web.context.RequestContext • This object lives in the REQUEST scope • Used for REST, Headers, Sending Files, and much more
  17. 17. COLDBOX MVC LAYERS Domain Model Layer
  18. 18. ANATOMY OF A ROUTED URL • Package = A Directory in the handlers folder • Handler = A handler CFC in the handlers folder • Action =The method to execute in the handler, defaults to index • This combination is called a ColdBox Event http: //localhost/{package}/{handler}/{action}?querystring event=package.handler.action Event Route
  19. 19. App Structure handlers layouts models modules views config modules_app Tracked by CommandBox Custom ColdBox.cfc Router.cfc includes css,js,images,etc
  20. 20. HANDLER CODE component name=“users”{ property name=“myService” inject=“MyService”;     function index( event, rc, prc ){         return “Hello from ColdBox Land”;     }     function login( event, rc, prc ){         prc.data = myService.getData();         event.setView( view=“handler/login”, layout=“login” ); }     function list( event, rc, prc ){ var data = getModel( “myService” ).list(); return data; }     function create( event, rc, prc){         var oUser = populateModel( myService.new() );        myService.save( oUser );         relocate( “user.index” );     } } models/MyService.cfc variables.myService Every action has 3 arguments: Request Context + Struct References Handlers can return HTML natively Set a view + layout for rendering Get Models instead of injection Complex data returns as JSON by default Objects can be populated from FORM/URL automatically
  21. 21. MODEL CODE component extends="cborm.models.VirtualEntityService" singleton{     function init(){ super.init( entityName="User" );         return this;     } function list(){ return queryExecute( "select * from users order by lname" );     } array function getTopVisitedContent( numeric max=5 ){         return newCriteria() .list( max = arguments.max, sortOrder = "hits desc", asQuery = false );     } } WireBox Persistence
  22. 22. LAYOUT CODE <cfoutput> #html.doctype()# <body> <div id=“header”>#renderView(‘header’)#</div> <div id=“content”>#renderView()#</div> <div id=“footer”>#renderView(‘footer’)#</div> </body> </cfoutput> HTML Helper object Render NamedViews RenderView set by Handler
  23. 23. RENDERING ENGINE Event, RC, PRC, HTML Footer Header Content Layouts
  24. 24. VIEW CODE <cfoutput> #html.startForm(action=“user.login”)# <h1>Login: #encodeForHTML( rc.name )#</h1> #prc.messages# #html.textfield( name=“username”, label=“Username:”, wrapper=“div” )# #html.passwordField( name=“password”, label=“Password:”, wrapper=“div” )# #html.submitButton(value=“Log In”)# #html.endForm()# </cfoutput> Helper Forms are easier! Access to RC scope Access to PRC scope
  25. 25. DemoTime Let’s build a Contacts API

A presentation on the basics of ColdBox MVC given at the Japan ColdFusion User Group

Views

Total views

227

On Slideshare

0

From embeds

0

Number of embeds

0

Actions

Downloads

6

Shares

0

Comments

0

Likes

0

×