Community Code: Xero
Upcoming SlideShare
Loading in...5

Community Code: Xero



Craig Walker is Chief Technology Officer and co-founder of small business accounting software provider Xero. Xero has over 50,000 customers in over 100 countries and Craig has recently relocated to ...

Craig Walker is Chief Technology Officer and co-founder of small business accounting software provider Xero. Xero has over 50,000 customers in over 100 countries and Craig has recently relocated to San Francisco to start the US based office.

Craig currently leads Xero’s software development technology strategy. He has a morbid obsession with JavaScript and not having to use any other language for development (much to the amusement of his colleagues).

Craig and Xero have been keen evangelists of Sencha products having utilized Sencha JavaScript libraries across Xero’s entire product line. Craig’s most recent fun project was building Xero Touch, a Sencha Touch-based mobile version of Xero released for the web and into the Apple App Store (and soon to be launched for Android).



Total Views
Views on SlideShare
Embed Views



2 Embeds 137 130 7



Upload Details

Uploaded via as Adobe PDF

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
Post Comment
Edit your comment

Community Code: Xero Community Code: Xero Presentation Transcript

  • Sencha @ XeroWednesday, November 2, 2011
  • @storminwalkerWednesday, November 2, 2011
  • Who is Xero? • Started in 2006, IPO in June 2007 • Over 150 staff in 7 locations • Over 50,000 customers in 100 countries •A global business run from New ZealandWednesday, November 2, 2011 View slide
  • Beautiful accounting softwareWednesday, November 2, 2011 View slide
  • Xero BusinessWednesday, November 2, 2011
  • The Xero Framework • Pure end-to-end SaaS development framework designed from the ground up to be the platform for Xero HTML,  JavaScript ASP.NET 4.0/XSLT/ XSLT ExtJS ASP.NET Business  event  (transac$on)  engine C#/WCF Mul$-­‐dimensional  general  ledger Object  rela$onal  model LLBLGen Pro Mul$-­‐tenanted   data  model SQL Server 2008Wednesday, November 2, 2011
  • XSLT & ASP.NET • MVC-like pattern using ASP.NET as a platform and XSLT as the view engine • Allows our designers to incorporate their designs into the application without needing to be programmers • It’s all about painting screensWednesday, November 2, 2011
  • So where’s the ExtJS?Wednesday, November 2, 2011
  • Quick ExtJS architecture revision…Wednesday, November 2, 2011
  • The single page app… ExtJS J S O N ServerWednesday, November 2, 2011
  • Progressive EnhancementWednesday, November 2, 2011
  • Wednesday, November 2, 2011
  • HTML ExtJS J H S T O M N L HTTPHandler HTTPModule (authentication) ASP.NETWednesday, November 2, 2011
  • Why ExtJS?Wednesday, November 2, 2011
  • The Invoice GridWednesday, November 2, 2011
  • What we liked • The grid! • Pretty out-of-the-box • Ability to theme using pure CSS • Impressive component library • Object-oriented • Event subsystem • PerformanceWednesday, November 2, 2011
  • What we didn’t • Wicked learning curve • Generated HTML was pretty ugly (heavy DOM) • Theming was harder than expected • Lack of a distribution builder • Maintainability – very easy to write very bad code • PerformanceWednesday, November 2, 2011
  • Why not a single page app? • Hybrid approach has performance benefits • Minimizes that learning curve • Server side rendering for heavy pages (such as reporting) • Worked better across our large team • Unconstrained by the layout engineWednesday, November 2, 2011
  • Code!Wednesday, November 2, 2011
  • Code management •Namespaces following a folder structure •Coding for reusability: extend, componentize, encapsulate •Code broken into as small files as possible (both JS and CSS)Wednesday, November 2, 2011
  • Performance •Sonic (concatenate, minify, compress) •PreloadingWednesday, November 2, 2011
  • ThemingWednesday, November 2, 2011
  • Take ext-css & override the shit out of itWednesday, November 2, 2011
  • Xero TouchWednesday, November 2, 2011
  • Sencha Touch J S O N HTTPModule (authentication) ASP.NET MVCWednesday, November 2, 2011
  • Why Sencha Touch? • Cross-platform • Looks native, feels native • Faster, cheaper, easier to build with • CSS3 awesomeness using SASS & Compass • Ability to go nativeWednesday, November 2, 2011
  • Focus on performance •Destroy often – keep the DOM light •Raw HTML to the rescue •ALWAYS test on a real device!Wednesday, November 2, 2011
  • going nativeWednesday, November 2, 2011
  • •Native Xero Touch for iOS & Android (coming soon) •18,000 app installs •All Sencha Touch source disconnected from PhoneGap project •Access to native APIs: camera &Wednesday, November 2, 2011
  • The move to ExtJS 4.0 & Sencha Touch 2?Wednesday, November 2, 2011
  • Any questions? www.xero.comWednesday, November 2, 2011
  • We’re hiring!Wednesday, November 2, 2011