With all of the new options for developing client-centric applications it can be hard to get your feet wet. Let’s jump in head first and build a app in JavaScript. We will be using ASP.NET for data access and web services accompanied by jQuery and for client-side coding. We will also touch base with the cool new AJAX 4.0 features and how easy they make AJAX development. The bottom line is we want to walk away from this session ready to test the waters in client-side development. Everyone is talking about it, Microsoft has embraced it, now we just need to do it!

1. jQueryFirestarter Chris Bannon http://twitter.com/b4nn0n chrisb@componentone.com

2. Product Manager @ComponentOne ASP.NET AJAX Controls ASP.NET iPhone/Mobile Controls Mobile Web Advocate iPhone Dev Con Speaker jQuery Advocate jQuery Conference Speaker About Me Hi!

3. HTML/XHTML Semantic markup Valid markup Microformats JavaScript jQuery Document Object Model (DOM) Event Model CSS Back to basics… !Important

4. ASP.NET AJAX Mimics server-side code Object Model Driven C# like syntax Namespace driven AJAX Control Toolkit No JavaScript experience needed Built-in server-side callbacks Client-side in ASP.NET 2.0-3.5

6. jQuery CSS Selectors Lightweight model Common utilities/functions Abstracts browser-specific JavaScript jQueryTemplating/DataBinding Formerly AJAX 4 Templating/DataBinding Uses HTML Templates with Binding syntax Supports DataBinding in JavaScript Client-side in ASP.NET 4.0

7. ComponentOne Studio for ASP.NET AJAX } { +

8. $(“code”).show();

9. A Great One-liner Sample Popping Up the Toast function showToast(msg) { if ($("#toaster").length == 0) { $("<div id='toaster'></div>").appendTo("body"); } $("<div class='toast'><span></span></div>") .find("span") .html(msg) .end() .appendTo("#toaster") .show("slide", { direction: "down", easing: "easeOutQuad" }) .delay(4000) .hide("slide", { direction: "down", easing: "easeOutQuad" }); }

10. Any Questions?

11. jQueryhttp://jquery.com/ jQuery UIhttp://jqueryui.com/ Studio for ASP.NET AJAXhttp://www.componentone.com/SuperProducts/StudioASPNET/ Chinook (iTunes) Sample Databasehttp://chinookdatabase.codeplex.com/ MS AJAX Announcementhttp://stephenwalther.com/blog/archive/2010/03/16/microsoft-jquery-and-templating.aspx Code from this session http://helpcentral.componentone.com/CS/blogs/webdev/archive/2010/03/23/popular-ui-volume-2-itunes.aspx Resources

12. $(this).end(); Chris Bannon http://twitter.com/b4nn0n chrisb@componentone.com