Atlas for ASP.net v2.0

Flirting with AJAX One geek‟s view of ATLAS for ASP.net v2.0 Gary Rowntree Web Architect - Mellon http://mellon.com growntree@russellmellon.com http://garyrowntree.iblogs.com/ Agenda AJAX & ATLAS Overview What is AJAX?, doing AJAX by hand, where does ATLAS fit in? My experience of using Atlas for Server-Centric Ajax Development Demo and a chat through some other controls Client-Centric AJAX with ATLAS Quick Pointers to more info. Not my preferred route to AJAX. What is AJAX • SHOW OF HANDS: How many aware of AJAX? How many people played with AJAX? What mix of developers? • The problem with the web It’s PLONKY, CLUNKY and a SCARY place for a novice. Round-trips, navigation, click go or not! • AJAX is here to save us all The reason people do AJAX is to give a better UI, increased usability and de-clunk the web What is AJAX • AJAX - Nothing new - improve usability • used to be remote scripting - ASP and webservice behaviour in IE 3.0, MSXML, Callbacks in IE and ASP.Net, Grid in asp.net v2 • AJAX names and groups these technologies (Javascript, DHTML, DOM, XML, HTTP ) • http://www.adaptivepath.com/publications/essays/archives/0 00385.php - the definitive guide • http://www.w3schools.com/ajax/ - it is standards based • Examples; • flickr (you actually start to hate the non AJAX refreshes!) • google maps – must be in every list of AJAX sites • gollum.easycp.de – autocomplete combo! • Outlook web access – WOW! – bet it’s not all AJAX  Make a request That was AJAX • Making the web easier to use for novice users • Make the web work more like a desktop app • Un-clunkification of the web • BUT: HECK that is a lot of coding! XML, JavaScript, Server side provision of data feeds, very complex concepts – lot’s of emphasis on EXPERT coders. Ways you can improve your UI… • Stay PLONKY! But really focus on user task centric approaches • Do it yourself using A J & X http://www.dynamicajax.com/ - tutorials • Use 3rd party controls that implement internally – Infragistics, telerik, dart powerweb live controls - anyone used them? • Or pick up ATLAS and build some seriously sexy AJAX UI… What is “Atlas”? A framework for building a new generation of richer, interactive, personalized standards-based web applications High-productivity platform for AJAX-style browser applications Script component model and UI framework for browser-based web applications Rich suite of components, controls, and behaviors to make Ajax easy Seamlessly integrate with Microsoft platform and application model Easily leverages services and components hosted in ASP.NET Delivers ubiquitous reach and easy deployment Works with IE, FireFox, Safari web clients – no client install required Based on existing standards – DHTML, JScript, CSS Enable world-class tools for AJAX-style application development Will be integrated with web authoring tools for developers and designers Next release of VS will provide richer scripting toolset (debugging, tracing, etc) FOR ME - GIVES AJAX WITH ZERO CODE!!!!! I LOVE IT! “Atlas” Timeframe First public preview released September 2005 Early release to solicit feedback and comments Regular drops since then: March CTP was released Monday 20th March!! Atlas CTP Go-Live License AVAILABLE NOW Will allow production applications to be deployed “Atlas” Scenarios in three slides ATLAS GOALS Server-centric Ajax Web Development Ajax approach to add UI enrichment for key scenarios Enrich applications without lots of Javascript code required Enable you to keep core UI/Application logic on server (VB/C#) Client-centric Ajax Web Development Leverage full power of script/DHTML Provide richer and more interactive user experience Build mash-ups, gadgets and other new immersive experiences Atlas provides a great Ajax framework for both server and client centric Ajax development scenarios – I prefer server. Server-Centric Programming Model Browser Initial Rendering (UI + Behavior) JavaScript Libs & constructs Input Data Updated UI + Behavior Just the bits that changed ASP.NET Application Pages Presentation (HTML/CSS) UI Behavior (Managed Code) Atlas Script Framework Component/UI Framework, Controls, Client Application Services ASP.NET Page Framework, Server Controls Application Services Client-Centric Programming Model Browser Presentation (HTML/CSS) ASP.NET Application Initial Rendering (UI + Behavior) Pages UI Behavior (Script) “Atlas” Service Proxies Data Data Web Services Atlas Script Framework Component/UI Framework, Controls, Client Application Services ASP.NET Page Framework, Server Controls Application Services Server Centric Ajax Development with Atlas We‟ll build an AJAX app for „Flirts‟ Built with this weeks Release.  Server Controls Goal: Easily enhance any ASP.NET web application Application UI and core logic still runs on server Avoid need to master JavaScript and asynchronous programming Use AJAX techniques to reduce roundtrips Enable incremental page UI updates (avoid full page refreshes) Scenarios: data navigation and editing, form validation, auto refresh Enable richer interactivity for existing ASP.NET controls Use the same controls, object model and events you already know Extenders to add Atlas behaviors to any ASP.NET controls Examples: auto-completion, web-parts, drag-and-drop, tooltips New, richer ASP.NET server controls – GONE? Server wrappers for Atlas client controls Examples: DateTimePicker, RichTextBox, Re-Order List  control Container control that enables “updatable” regions in a page Atlas provides a XmlHttp based asynch call infrastructure Some non-updatable content and controls... This content can be dynamically updated! TimerControl Demo Control Extenders //Creating an Auto-Complete textbox… //There is a dragdrop extender too (I‟ve not tried it) Control Extender Demo Creating an auto-complete textbox… DEMO: Flirting with AJAX Building a web based CHAT solution to improve your social life… Client Centric Ajax Development with Atlas I‟ve not played with „em – Exercise for the reader ;) Client side coding features A better JavaScript and AJAX runtime… • JavaScript Runtime library • Javascript extensions. a number of new objects, functions, and data types; simulated OO constructs such as classes, namespaces, enumerations, inheritance, and interface implementation. • Base class library. classes for debugging, handling events, handling strings, web services, accessing the host environment, timers, and components. • Core UI framework. UI infrastructure for interacting with the DOM and DHTML. Behaviors; validation; data binding; client-side content templates; drag and drop; and other UI effects. • UI toolkit. client-side controls that have richer capabilities than standard HTML controls. These include many typical controls, such as: hyperlink, listview, select, dataview, button, checkbox, textbox, label, datasource, counter, and more. • Declarative Javascript XML & JSON. http://Atlas.asp.net for the low down • Hints and Tips Proxy Workbench http://www.tcpiq.com/tcpIQ/ProxyWorkbench/ Debugging Help http://atlas.asp.net/docs/Overview/debug.aspx Be careful lots of info about previous CTP (Community Technology Preview) versions of ATLAS – old concepts My Two-Penneth: Stick with the Server Controls, the most UI impact from the least changes to your code. Try adding it to your apps! Then show me  Use 3rd Party controls for the other stuff – until Microsoft integrate ATLAS into the .Net runtime & VS I don’t like having my presentation, app or business logic coders writing in JavaScript running in a browser – too complex on so many levels. Atlas Resources Official Atlas Site: http://atlas.asp.net – new site this week How to download and install – March (go-live) released this week http://atlas.asp.net/docs/overview/install.aspx A blog for updates to Atlas http://weblogs.asp.net/atlas/ Samples + Slides for this Talk: http://garyrowntree.iblogs.com/ Summary Atlas provides a GREAT Ajax programming framework - Rich built-in integration with ASP.NET and the page lifecycle - Very Easy Server Controls - A better JavaScript (if you must ) Atlas CTP Go-Live Available NOW! Go build something cool with it, and then email me.