Service Oriented UI Architecture  in the world of web, desktop and mobile applications  How the web has gone beyond the browser and we’re headed back to Client/Server Jeff Haynie
JEFF HAYNIE CEO, Appcelerator Open Source Developer Twitter:  jhaynie Blog:   blog.jeffhaynie.us
How the web has gone beyond the browser and we’re headed back to Client/Server
Compared even to the development of the phone or TV, the Web developed very quickly.  Sir Tim Berners-Lee Inventor, World Wide Web
The web was built for information retrieval URLs are for identification Search engines are for location of content Web sites help us produce & consume content
Search is king
Web content has been controlled by web servers Java has become the de-facto Enterprise platform (.NET is pretty compelling too)
We have turned our web servers into application platforms We want more interactivity with our users Content is dynamic Our apps use MVC on the server side
Our infrastructure is optimized for applications to be controlled by the server We call this “server-assisted” MVC Each page request is dynamically generated Sessions are maintained on the server Client is response for display and input
We couple our application and service logic We try not to do it, but it still happens Levels of indirection to make it less painful Mix metaphors and cross concerns
Server-side programming has become too complex (and it doesn’t have to be)
Great for the tech book publishers We have one, too!
J2EE hearts XML
Applications are distinctly different than services Different use cases Different technologies Different skill sets
The Browser has been our modern dumb terminal
Applications today are coupled at the server tier Still same development effort Web services in enterprise suffer the same fate Rapid iteration difficult, if not impossible
Web 2.0 Remix the web with services
We’ve started thinking about platforms that provide services
Services are separate from applications
Web 2.0 (accidently) introduced separation of concerns Services were designed to be separated Mashups allowed consumption and production Clients independently developed from backend
We call this Web 2.0 Facebook Flickr Google Maps Twitter
Social Communites Sharing RSS  Blogging Microformats Social bookmarking Tagging
Web 2.0 is the divorce of services from applications. The Applications are back in control Applications can be built with no backend of their own
We’re going back in time
We call this Service Oriented UI Services are distinctly separated from the UI No assumptions need to be made about the UI UI can consume different, varied services
It’s the application stupid. Services are important. The “platform” Services should be lightweight Applications control services
We used to call this Client / Server. The web is a client server architecture We lost our way along the way Things became tightly coupled
The web is becoming more than a website The “web” can describe any number of ways of consuming and producing bits, on any number of devices, at multiple locations
We’re going into new territory
Phone is no longer a “phone”
The Web is in our back pocket
The Web is in our living room
The Web is in your PC bios
Web is coming (in) to a desktop near you
We have no choice anymore about applications and services
The web has become the ultimate application platform Flexibility of distribution Available of technologies and collaboration Global marketplace and workplace
SOUI attributes Separation of application from services Rapid prototyping of application without backend No throwaway code Ability to iterate with different constituents
SOUI is about the application User experience through usability
 
Current model of development is tightly coupled Each phase has impact on both sides Server dominates UI Dev cycle is elongated because of server-side
SOUI enables Interactive Use Cases User-driven development through use cases Technology enabled Agile Because functional requirements suck
If I had asked my customers what they wanted, they would have told me ‘a faster horse‘.  Henry Ford
IUCs fulfillment of agile dev Client application can be fully developed with little to no backend Fast iteration of front-end application Mock-out of backend-services
Where are SOUI principles applied? Lots of Web 2.0 applications Adobe Flex and Flash Microsoft Silverlight
SOUI architecture Client is the application and controls state, logic Services are stateless Services provide well-known API
Appcelerator is a SOUI architecture SDK provides building client-applications Services tier cleanly separated 7 major programming languages, major frameworks
Appcelerator Java support Java support out of the box Rapid service prototyping with Jetty Clean, simple development Java 5 annotation, POJO driven
Appcelerator for building client Declarative AJAX, Web Expression Language Integrated services Message Oriented
Appcelerator cleanly separates
Appcelerator Web SDK Web Expression Language - DSL Message Broker Unified UI Widgets on [event] then [action]
Appcelerator Services Intentionally thin
Application Web Server HTTP Application makes request for files Application Web Server HTTP Web server returns static files
Application Page Application “compiles” page Elements Widgets Scripts Message Broker Services Services Services
AJAX Asynchronous Javascript
Appcelerator client example
Appcelerator Services are lightweight Simple annotation style POJO development Works well with other frameworks like Spring Makes no assumptions about backend
Appcelerator Services example
Appcelerator Java EE Deployable to any Java EE app server, OSGI Integration with Jetty for development POJO auto mapping for services
Web 3.0
Reuse Remix Refactor
Applications are moving beyond the browser Rich desktop applications are going mainstream Same development model with SOUI Same tools, services, skills
Appcelerator on the desktop, mobile
Rich Desktop applications Support for Win32, OSX and Linux Web technologies to build rich desktop apps Javascript API for desktop, file, network, menus, custom windows, etc.
Appcelerator is cross platform, cross browser Mac OSX, Win32, Linux Modern browsers: IE6/7, FF, Safari, Chrome, Opera Mobile browsers: iPhone, Android, Skyfire *
Appcelerator is open source Apache Public License Active Developer Community Hosted on GitHub http://community.appcelerator.org
Early access Available today on Manning website In print in Spring
Download Appcelerator today Let’s us know if you’d like to get involved IRC #appcelerator on freenode Twitter @appcelerator http://getappcelerator.com
Flickr Photo Shoutouts http://flickr.com/shutterhack http://flickr.com/psd http://flickr.com/cayusa http://flickr.com/sigalakos http://flickr.com/two-wrongs http://flickr.com/chavals http://flickr.com/stewf http://flickr.com/actiondatsun http://flickr.com/tyrussmalley http://flickr.com/clompers http://flickr.com/trucolorsfly http://flickr.com/markknol http://flickr.com/dan_h http://flickr.com/cvanfleteren http://flickr.com/stevenerat http://flickr.com/carrierdetect http://flickr.com/jazzmasterson http://flickr.com/re-ality http://flickr.com/bluesmuse http://flickr.com/niallkennedy

SD Forum Java SIG - Service Oriented UI Architecture

  • 1.
    Service Oriented UIArchitecture in the world of web, desktop and mobile applications How the web has gone beyond the browser and we’re headed back to Client/Server Jeff Haynie
  • 2.
    JEFF HAYNIE CEO,Appcelerator Open Source Developer Twitter: jhaynie Blog: blog.jeffhaynie.us
  • 3.
    How the webhas gone beyond the browser and we’re headed back to Client/Server
  • 4.
    Compared even tothe development of the phone or TV, the Web developed very quickly. Sir Tim Berners-Lee Inventor, World Wide Web
  • 5.
    The web wasbuilt for information retrieval URLs are for identification Search engines are for location of content Web sites help us produce & consume content
  • 6.
  • 7.
    Web content hasbeen controlled by web servers Java has become the de-facto Enterprise platform (.NET is pretty compelling too)
  • 8.
    We have turnedour web servers into application platforms We want more interactivity with our users Content is dynamic Our apps use MVC on the server side
  • 9.
    Our infrastructure isoptimized for applications to be controlled by the server We call this “server-assisted” MVC Each page request is dynamically generated Sessions are maintained on the server Client is response for display and input
  • 10.
    We couple ourapplication and service logic We try not to do it, but it still happens Levels of indirection to make it less painful Mix metaphors and cross concerns
  • 11.
    Server-side programming hasbecome too complex (and it doesn’t have to be)
  • 12.
    Great for thetech book publishers We have one, too!
  • 13.
  • 14.
    Applications are distinctlydifferent than services Different use cases Different technologies Different skill sets
  • 15.
    The Browser hasbeen our modern dumb terminal
  • 16.
    Applications today arecoupled at the server tier Still same development effort Web services in enterprise suffer the same fate Rapid iteration difficult, if not impossible
  • 17.
    Web 2.0 Remixthe web with services
  • 18.
    We’ve started thinkingabout platforms that provide services
  • 19.
    Services are separatefrom applications
  • 20.
    Web 2.0 (accidently)introduced separation of concerns Services were designed to be separated Mashups allowed consumption and production Clients independently developed from backend
  • 21.
    We call thisWeb 2.0 Facebook Flickr Google Maps Twitter
  • 22.
    Social Communites SharingRSS Blogging Microformats Social bookmarking Tagging
  • 23.
    Web 2.0 isthe divorce of services from applications. The Applications are back in control Applications can be built with no backend of their own
  • 24.
  • 25.
    We call thisService Oriented UI Services are distinctly separated from the UI No assumptions need to be made about the UI UI can consume different, varied services
  • 26.
    It’s the applicationstupid. Services are important. The “platform” Services should be lightweight Applications control services
  • 27.
    We used tocall this Client / Server. The web is a client server architecture We lost our way along the way Things became tightly coupled
  • 28.
    The web isbecoming more than a website The “web” can describe any number of ways of consuming and producing bits, on any number of devices, at multiple locations
  • 29.
    We’re going intonew territory
  • 30.
    Phone is nolonger a “phone”
  • 31.
    The Web isin our back pocket
  • 32.
    The Web isin our living room
  • 33.
    The Web isin your PC bios
  • 34.
    Web is coming(in) to a desktop near you
  • 35.
    We have nochoice anymore about applications and services
  • 36.
    The web hasbecome the ultimate application platform Flexibility of distribution Available of technologies and collaboration Global marketplace and workplace
  • 37.
    SOUI attributes Separationof application from services Rapid prototyping of application without backend No throwaway code Ability to iterate with different constituents
  • 38.
    SOUI is aboutthe application User experience through usability
  • 39.
  • 40.
    Current model ofdevelopment is tightly coupled Each phase has impact on both sides Server dominates UI Dev cycle is elongated because of server-side
  • 41.
    SOUI enables InteractiveUse Cases User-driven development through use cases Technology enabled Agile Because functional requirements suck
  • 42.
    If I hadasked my customers what they wanted, they would have told me ‘a faster horse‘. Henry Ford
  • 43.
    IUCs fulfillment ofagile dev Client application can be fully developed with little to no backend Fast iteration of front-end application Mock-out of backend-services
  • 44.
    Where are SOUIprinciples applied? Lots of Web 2.0 applications Adobe Flex and Flash Microsoft Silverlight
  • 45.
    SOUI architecture Clientis the application and controls state, logic Services are stateless Services provide well-known API
  • 46.
    Appcelerator is aSOUI architecture SDK provides building client-applications Services tier cleanly separated 7 major programming languages, major frameworks
  • 47.
    Appcelerator Java supportJava support out of the box Rapid service prototyping with Jetty Clean, simple development Java 5 annotation, POJO driven
  • 48.
    Appcelerator for buildingclient Declarative AJAX, Web Expression Language Integrated services Message Oriented
  • 49.
  • 50.
    Appcelerator Web SDKWeb Expression Language - DSL Message Broker Unified UI Widgets on [event] then [action]
  • 51.
  • 52.
    Application Web ServerHTTP Application makes request for files Application Web Server HTTP Web server returns static files
  • 53.
    Application Page Application“compiles” page Elements Widgets Scripts Message Broker Services Services Services
  • 54.
  • 55.
  • 56.
    Appcelerator Services arelightweight Simple annotation style POJO development Works well with other frameworks like Spring Makes no assumptions about backend
  • 57.
  • 58.
    Appcelerator Java EEDeployable to any Java EE app server, OSGI Integration with Jetty for development POJO auto mapping for services
  • 59.
  • 60.
  • 61.
    Applications are movingbeyond the browser Rich desktop applications are going mainstream Same development model with SOUI Same tools, services, skills
  • 62.
    Appcelerator on thedesktop, mobile
  • 63.
    Rich Desktop applicationsSupport for Win32, OSX and Linux Web technologies to build rich desktop apps Javascript API for desktop, file, network, menus, custom windows, etc.
  • 64.
    Appcelerator is crossplatform, cross browser Mac OSX, Win32, Linux Modern browsers: IE6/7, FF, Safari, Chrome, Opera Mobile browsers: iPhone, Android, Skyfire *
  • 65.
    Appcelerator is opensource Apache Public License Active Developer Community Hosted on GitHub http://community.appcelerator.org
  • 66.
    Early access Availabletoday on Manning website In print in Spring
  • 67.
    Download Appcelerator todayLet’s us know if you’d like to get involved IRC #appcelerator on freenode Twitter @appcelerator http://getappcelerator.com
  • 68.
    Flickr Photo Shoutoutshttp://flickr.com/shutterhack http://flickr.com/psd http://flickr.com/cayusa http://flickr.com/sigalakos http://flickr.com/two-wrongs http://flickr.com/chavals http://flickr.com/stewf http://flickr.com/actiondatsun http://flickr.com/tyrussmalley http://flickr.com/clompers http://flickr.com/trucolorsfly http://flickr.com/markknol http://flickr.com/dan_h http://flickr.com/cvanfleteren http://flickr.com/stevenerat http://flickr.com/carrierdetect http://flickr.com/jazzmasterson http://flickr.com/re-ality http://flickr.com/bluesmuse http://flickr.com/niallkennedy