Transcript Powerpoint version

EFFICIENT CODING
WITH CFBUILDER 2
by
Kris Korsmo
THE GOALS OF THIS PRESENTATION





Familiarize you with the IDE on a basic level
Show you a few of the more advanced features
Show you some tricks and hidden gems (thanks Charlie)
Discuss different developer workflows
Demonstrate creating a simple application
ABOUT ME








Live in Seattle area
Began coding w/ BASIC
Washington State University
Using ColdFusion since 2004
Adobe Certified CF8
Seattle CFUG member
Wife and three kids
737 Pilot when not coding
kriskorsmo.com | [email protected] | @kriskorsmo
WHO THIS IS FOR
 This presentation is geared toward




Folks with limited experience using an Eclipse-based IDE
Beginner to intermediate-level code writers
People interested in an efficient workflow
People who want to use best practices
 I will make no assumptions
 If you have questions I’ll do my best to answer as we
go, but I may need to speed along at some point
 If I don’t know the answer to your question I’ll do my
best to find it. I’d rather be honest in not knowing than
give you an answer that’s incorrect
 There should be time for more questions at the end
kriskorsmo.com | [email protected] | @kriskorsmo
WHAT IS COLDFUSION BUILDER 2?
 An Eclipse-based IDE
 Eclipse is an open-source IDE
 Not only a text editor
 IDE = Integrated Development Environment – combines a lot
of features all in one to help you write code better, faster and
easier (although everyone has different preferences)
 Tailored by Adobe specifically for CF
 Can be installed as standalone or as plugin
kriskorsmo.com | [email protected] | @kriskorsmo
VIEWS & PERSPECTIVES
 Views show a single aspect of your application – files,
data, code snippets, etc. - and can be added to any
perspective
 Perspectives are groups of related views which together
help you work efficiently on one aspect of your
application (writing code, debugging, etc.)
kriskorsmo.com | [email protected] | @kriskorsmo
PERSPECTIVES
There are many different perspectives – six in
this case – but others are available
kriskorsmo.com | [email protected] | @kriskorsmo
COLDFUSION PERSPECTIVE
kriskorsmo.com | [email protected] | @kriskorsmo
HELP VIEW
 Extremely useful if you’re just
getting started with CFB
 You can easily bookmark help
topics by right -clicking and
selecting “Add Bookmark”
 Handy HTML, JavaScript and CSS
references
 This is where the CF 10
documentation lives
kriskorsmo.com | [email protected] | @kriskorsmo
NAVIGATOR VIEW
 Shows file structure
 Arrows are Forward and Back, not
Up/Down in file structure
 Right click and choose “Go Into” to
navigate file structure
 Click
to navigate up file structure
 Click
to collapse file structure
 Click
to link a file to the editor –
keeps the file you’re working on in the
editor displayed in navigation view.
 Click
to focus on a task – this is a
Mylyn (Tasktop) feature
kriskorsmo.com | [email protected] | @kriskorsmo
RDS DATA VIEW
RDS makes it easy to visualize your data and to
add it to the code in your editor.






Click
Click
Click
Click
Click
Click
to
to
to
to
to
to
open RDS configuration dialog
refresh the selected folder
open RDS Query Viewer
go to RDS Data Home
go into selected level
go up a level
kriskorsmo.com | [email protected] | @kriskorsmo
RDS FILE VIEW
Allows you to see the files on your remote server









Click
Click
Click
Click
Click
Click
Click
Click
Click
to
to
to
to
to
to
to
to
to
open RDS configuration dialog
refresh the selected folder
create a new file
delete a file
create a new folder
delete a folder
go to RDS File View Home
go into selected level
go up a level
kriskorsmo.com | [email protected] | @kriskorsmo
SNIPPETS VIEW
Allows you to store frequently-used bits of code in an
organized fashion.








Click
to refresh snippets view
Click
to insert the selected snippet
Click
to create a new snippet
Click
to edit the selected snippet
Click
to delete the selected snippet
Click
to create a new package
Click
to delete the selected package
You can use system variables to
automatically populate values such as
the current date and filename
kriskorsmo.com | [email protected] | @kriskorsmo
SNIPPETS SYSTEM VARIABLES















$${DATE}
$ $ { M ON T H }
$${TIME}
$${DATETIME}
$ $ { C UR R E N T FI L E } – C u r r e n t f i l e n a m e (j u s t t h e f i l e )
$ $ { C UR R E N T F OL D E R } – C u r r e n t f o l d e r (T h e p a t h t o t h e c o nt a i ni ng f o l d e r )
$ $ { C UR R E N T PA T H } – C u r r e n t p a t h (f u l l f i l e n a m e )
$ $ { C UR R E N T PR JPA T H } – J u s t t h e f o l d e r
$ $ { US E R N A ME } – C u r r e n t u s e r
$ $ { M ON T H N UM BE R } – M o n t h a s a n u m b e r
$ $ { D A YO FM O N T H } – D a y o f m o n t h a s a n u m b e r
$ $ { D A YO F WE E KN UM BE R } – D a y o f w e e k (t h e w e e k s t a r t s o n S u n d a y )
$ $ { D A T E T I M E 2 4 } – D a t e T i m e 2 4 – a 2 4 h o u r c l oc k v e r si o n o f d a t e t i m e .
$ $ { YE A R } – C u r r e n t y e a r .
$ $ { YE A R 2 DI G I T } – C u r r e n t t w o d i g i t y e a r
kriskorsmo.com | [email protected] | @kriskorsmo
TASKS VIEW


S h o w s t h e d e s c ri p ti o n o f t h e t a s k , t h e r e s o u rc e , p a t h & l o ca ti o n
D o ub l e - cl i cki ng t h e t a s k o p e n s t h e r e s o ur c e i n t h e e d i to r , a n d h i g hl ig ht s
t h e l i ne (s ) o f c o d e t h a t n e e d t o b e a d d r e s s e d
kriskorsmo.com | [email protected] | @kriskorsmo
OUTLINE VIEW
 Makes it very easy to find code
 Most useful when working on CFCs
because it makes it simple to locate
functions by name
 Clicking a section of code (such as
the function shown here) will move the
cursor to that function in the editor
 You can expand and collapse
individual items or use the buttons at
the top to expand or collapse all
 Clicking the alphabetical sort is very
useful because it groups functions by
name, essentially eliminating
comments
 Click
to hide private functions
kriskorsmo.com | [email protected] | @kriskorsmo
TAIL VIEW
 Displays the contents of your log files without having
to log into the ColdFusion Administrator
kriskorsmo.com | [email protected] | @kriskorsmo
SERVICES VIEW
 Shows functions, arguments, data type, etc. and allows
you to right click to insert cfinvoke or createObject();
kriskorsmo.com | [email protected] | @kriskorsmo
SERVER VIEW
• Add, stop, start, restart or delete a server
• Launch the Server Monitor
• Launch the ColdFusion Administrator
INOP
DELETE
RESTART
START
NEW
kriskorsmo.com | [email protected] | @kriskorsmo
GIT REPOSITORIES VIEW
Basic Functionality:
www.eclipse.org/egit/
•
•
•
•
•
•
•
•
•
•
•
Collapse All
Link to Editor
Add Local Repository
Clone Repo and Add to View
Create New Repository
Refresh View
Link to Selection
Hierarchical Branch Layout
Display Latest Branch Commit
Branch
Merge




Doesn’t ship with CFBuilder
Not comprehensive
Will do what most of us need
Not supported by Adobe
kriskorsmo.com | [email protected] | @kriskorsmo
GIT HISTORY
kriskorsmo.com | [email protected] | @kriskorsmo
CUSTOMIZING CFBUILDER
 Can be done by navigating to Window > Preferences
kriskorsmo.com | [email protected] | @kriskorsmo
CODE FORMATTING
 Type “formatter” in the filter text
kriskorsmo.com | [email protected] | @kriskorsmo
CODE LIBRARIES
 Y o u c a n c r e a t e a c u s t o m C F M L d i c t i o n a r y (X M L f i l e ) a n d m a k e i t a v a i l a b l e t o
u s e f o r C o d e A s s i s t a n d Ta g wi z a r d wi t h i n C o l d F u s i o n B u i l d e r .
 Wi t h i n t h e C o l d F u s i o n B u i l d e r i n s t a l l a t i o n , n a v i g a t e t o t h e f o l l o wi n g l o c a t i o n :
 \plugins\com.adobe.ide.coldfusion.dictionary_ XXX\dictionary
 C r e a t e a f o l d e r c a l l e d " C u s t o m " wi t h i n t h e D i c t i o n a r y d i r e c t o r y .
 Create an XML file to describe the custom tags and functions .
 For example, in the XML file, you describe each tag
wi t h i n < t a g > < / t a g > e l e m e n t s , a n d e n c l o s e a l l t h e t a g e l e m e n t s
wi t h i n < d i c t i o n a r y > < / d i c t i o n a r y > e l e m e n t s a s f o l l o ws :
<dictionary>
<tags>
<!-- cfoanz beerRequired= “Boolean" -->
<tag endtagrequired="false" name="cfoanz" single="true" xmlstyle="false">
<parameter name=“beerRequired" required=“true" type=“Boolean">
<values default="true">
<value option="true"/>
<value option="false"/>
</values>
</parameter>
</tag>
</tags>
</dictionary>
kriskorsmo.com | [email protected] | @kriskorsmo
THEMING & FONTS
 http://eclipsecolorthemes.org /






Manually edit colors and fonts
Downloadable themes
Create your own theme
Plugin is available
Requires a lot of work & doesn’t look great
Only changes the editor, not the entire IDE
 Adobe Source Code Pro font
 New font designed specifically for coding
 http://sourceforge.net/projects/sourcecodepro.adobe/
 Differentiates similar characters
 O vs 0
 l vs 1
kriskorsmo.com | [email protected] | @kriskorsmo
USEFUL KEYBOARD SHORTCUTS
Function
Shortcut
<cfdump>
Ctrl + t, d
<!--- comment --->
Ctrl + t, m
<cfscript>
Ctrl + t, s
Wrap in hash marks (##)
Ctrl + t, h
<cfoutput>
Ctrl + t, o
<cftry> (both try and catch)
Ctrl + t, t
Move current line up, down
Alt + ↑, Alt + ↓
Find matching tag*
Ctrl + Alt + m
Select enclosing tags*
Ctrl + Alt + b
Move to next/previous attribute*
Ctrl + ], Ctrl + [
Format Code
Ctrl + Shift + f
See all shortcuts
Ctrl + Shift + l
* Courtesy of Charlie Arehart’s “Hidden Gems in ColdFusion Builder 2” – carehart.org
kriskorsmo.com | [email protected] | @kriskorsmo
EXTENSIONS







CFC Generator
CF Wheels
Apptacular
Model Glue
Mach II
CFLib
Build your own
kriskorsmo.com | [email protected] | @kriskorsmo
PLUGINS
 E-Git
 http://marketplace.eclipse.org/egit
 GitHub Mylyn Connector
 http://bit.ly/TW43r1
 Maven
 http://bit.ly/TW3tt6
 Cloud Bees Jenkins
 http://bit.ly/P3Wp0w
 Android Developer Tools
 http://developer.android.com/tools/sdk/eclipse-adt.html
 Eclipse Marketplace within the IDE
 Help > Eclipse Marketplace
kriskorsmo.com | [email protected] | @kriskorsmo
CFBUILDER VS. OTHER EDITORS
CFBuilder
Dreamweaver
Sublime
IntelliJ
Text Editor
Good
Good
Great
Good
Code Completion
Great
Good
Great
Good
Debugging
Built-in
In-browser
In-browser
In-browser
Database Info
Yes
Yes
No
No
Version Control
Via Plugin
Via Plugin
Via Plugin
Built-in
Console
Yes
None
Yes
Yes
Extensible
Yes
Yes
Yes
Yes
Theming / Fonts
Fair
Poor
Great
Fair
Documentation
Good
Good
Fair
Great
kriskorsmo.com | [email protected] | @kriskorsmo
DEVELOPER WORKFLOW
Typical Development Process
Write Code
Test Locally
FTP to Production
Server
Best Practices Development Process
Write Code
Unit Testing
Commit Frequently
Selenium
Push to Repository
Push to Production Server
kriskorsmo.com | [email protected] | @kriskorsmo
DEMO APPLICATION





We’ll start with only a database
Generate an application using Apptacular
Use code snippets to add grid functionality
Commit and push to repository
Run unit tests
kriskorsmo.com | [email protected] | @kriskorsmo
QUESTIONS
All CF.Objective(ANZ) attendees will receive a 20%
discount on web hosting with Ayera Technologies.
Use the Discount code CFOANZ2012 or mention my
name in the referral section.
kriskorsmo.com | [email protected] | @kriskorsmo