Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.
asp.net ajax with visual studio 2008
 
 
email  [email_address] Caleb Jenkins  Senior Consultant Training Mentor blog   developingUX.com twitter .com/calebjenkins
www.DevelopingUX.com www.ImprovingEnterprises.com http://CommunityCast.tv http://ineta.org
asp.net ajax with visual studio 2008
? business results
the ux lever offers new market opportunities differentiates product/service  provides operational efficiency and business ...
ux business results
 
limitations of  web  applications
Traditional Web Applications use costly  Postbacks  for Server operations and UI operations. No “ integrated ” way to work...
 
<ul><li>A synchronous  J avaScript  A nd  X ML </li></ul><ul><li>Not a “new” technology – It’s a specific way of using exi...
<XML DATA>
<XML DATA>
<XML DATA> JSON DATA; REST SOAP
Side Note: <ul><li>not all AJAX uses XML </li></ul><ul><li>Another popular data transfer mechanism is  JSON (Pronounced: J...
Difficulties with AJAX
Difficulties with AJAX <ul><li>Too “Close to the  wire ” </li></ul><ul><li>Heavy   DHTML plumbing required </li></ul><ul><...
<ul><li>AJAX can also refer to a “ web 2.0 ” site </li></ul><ul><li>Embodies not only AJAX data calls, but an over all adh...
ASP.NET AJAX Web Server IE Firefox Safari Browser Clients JSON Bridge Support Membership & Personalization Support ASP.NET...
<ul><li>Client Centric </li></ul>Two Basic Development Models Server Centric
<ul><li>Client Centric </li></ul>leaner on the wire smart client  architecture longer development time less IDE support UI...
Server-Centric Programming Model Browser Presentation (HTML/CSS) ASP.NET Application Services Page Framework, Server Contr...
Client-Centric Programming Model Browser Presentation (HTML/CSS) AJAX Service Proxies UI Behavior (Script) ASP.NET Applica...
AJAX Application  <ul><li>Do  not   trust client input </li></ul><ul><li>Do not  enforce business rules on the client </li...
External Services My Application  Client Bridge Proxy (Script) External Service Server Pages UI + Logic (HTML + Script) Br...
asp.net/ajax/showcase examples
asp.net/ajax/showcase examples
ajax.asp.net /downloads/
 
 
 
<ul><li>Separate download </li></ul><ul><ul><li>Library of free ASP.NET AJAX enabled controls </li></ul></ul><ul><ul><li>A...
Demo <ul><li>“ Hello World” with the UpdatePanel ScriptManager, UpdatePanel, Triggers, UpdateProgress </li></ul>
protected void  UpdatePanel1_PreRender(object sender, EventArgs e) { // This code will only be executed if the partial pos...
UpdatePanel  Events know your asp.net page life cycle  UpdatePanel Button updatepanel_ load button_ click updatepanel_ pre...
Demo <ul><li>Working with Extenders ASP.NET AJAX Control Toolkit </li></ul>
2008
Demo <ul><li>Working with Visual Studio 2008 ASP.NET 3.5 Preview, Debug, JavaScript Intellisense </li></ul>
custom  extender  controls provide framework for hooking up properties and links  between server and client  side componen...
custom  extender  controls provide framework for hooking up properties and links  between server and client  side components
ASP.NET AJAX Components types of client components
Demo <ul><li>Building Your Own Extender  Extender Walkthrough: Confirm Button Extender </li></ul>
 
<ul><li>IE7 with  Developer Toolbar </li></ul><ul><li>FireFox with  Web Developer ToolBar </li></ul><ul><li>FireFox with  ...
<ul><li>How Do I  Videos </li></ul>
<ul><li>How Do I  Videos </li></ul>
<ul><li>How Do I  Videos </li></ul>
<ul><li>“ Official ASP.NET AJAX” -  http://ajax.asp.net </li></ul><ul><li>Fiddler  http://www.fiddlertool.com/fiddler/ </l...
copyright
[all images in this presentation are the property and copyright of their owners… Most of which I just found on the Interne...
email  [email_address] Caleb Jenkins  Senior Consultant Training Mentor blog   developingUX.com twitter .com/calebjenkins
www.ImprovingEnterprises.com http://CommunityCast.tv http://ineta.org www.DevelopingUX.com
 
http://ImprovingEnterprises.com Improving… It’s what we do!
Upcoming SlideShare
Loading in …5
×

ASP.NET AJAX with Visual Studio 2008

10,001 views

Published on

Overview of Microsoft ASP.NET AJAX with Visual Studio 2008

Published in: Business, Technology
  • Login to see the comments

ASP.NET AJAX with Visual Studio 2008

  1. 1. asp.net ajax with visual studio 2008
  2. 4. email [email_address] Caleb Jenkins Senior Consultant Training Mentor blog developingUX.com twitter .com/calebjenkins
  3. 5. www.DevelopingUX.com www.ImprovingEnterprises.com http://CommunityCast.tv http://ineta.org
  4. 6. asp.net ajax with visual studio 2008
  5. 7. ? business results
  6. 8. the ux lever offers new market opportunities differentiates product/service provides operational efficiency and business insight raises the bar
  7. 9. ux business results
  8. 11. limitations of web applications
  9. 12. Traditional Web Applications use costly Postbacks for Server operations and UI operations. No “ integrated ” way to work with client side scripting
  10. 14. <ul><li>A synchronous J avaScript A nd X ML </li></ul><ul><li>Not a “new” technology – It’s a specific way of using existing technologies. </li></ul><ul><li>Used in Outlook Web Access (IE 5) </li></ul><ul><li>Transfer just the “ data ” between browser and server </li></ul><XML DATA>
  11. 15. <XML DATA>
  12. 16. <XML DATA>
  13. 17. <XML DATA> JSON DATA; REST SOAP
  14. 18. Side Note: <ul><li>not all AJAX uses XML </li></ul><ul><li>Another popular data transfer mechanism is JSON (Pronounced: Jason) </li></ul><ul><li>J ava S cript O bject N otation </li></ul><ul><li>JSON is much faster than XML for browser to process </li></ul><ul><li>not all XML is SOAP WebServices </li></ul><ul><li>another type of WebServices is a light weight REST service (popular with PHP and Ruby on Rails) </li></ul><ul><li>AJAX sounds better than AJAJ </li></ul>
  15. 19. Difficulties with AJAX
  16. 20. Difficulties with AJAX <ul><li>Too “Close to the wire ” </li></ul><ul><li>Heavy DHTML plumbing required </li></ul><ul><li>Browser compatibilities with DHTML </li></ul>
  17. 21. <ul><li>AJAX can also refer to a “ web 2.0 ” site </li></ul><ul><li>Embodies not only AJAX data calls, but an over all adherence to good User Experience ( UX ) principals. </li></ul><ul><ul><li>Usability </li></ul></ul><ul><ul><li>CSS/ (x)HTML Standards </li></ul></ul><ul><ul><li>Overall Immersive Web Experience </li></ul></ul><ul><li>ASP.NET AJAX has features to support both : AJAX Data Calls and Rich UX </li></ul>Side Note:
  18. 22. ASP.NET AJAX Web Server IE Firefox Safari Browser Clients JSON Bridge Support Membership & Personalization Support ASP.NET Server Control Integration ASP.NET AJAX Client JavaScript Libraries MicrosoftAjax.js MicrosoftAjax.en-us.js MicrosoftAjax.debug.js MicrosoftAjaxTimer.js MicrosoftAjaxWebForms.js IIS & ASP.NET Apache & PHP ColdFusion
  19. 23. <ul><li>Client Centric </li></ul>Two Basic Development Models Server Centric
  20. 24. <ul><li>Client Centric </li></ul>leaner on the wire smart client architecture longer development time less IDE support UI and Data on the wire keep viewstate intact better developer productivity ASP.NET type IDE support Server Centric
  21. 25. Server-Centric Programming Model Browser Presentation (HTML/CSS) ASP.NET Application Services Page Framework, Server Controls Client Script Framework Client Application Services Component/UI Framework, Controls ASP.NET Application Pages UI Behavior (Managed Code) Input Data Updated UI + Behavior Initial Rendering (UI + Behavior)
  22. 26. Client-Centric Programming Model Browser Presentation (HTML/CSS) AJAX Service Proxies UI Behavior (Script) ASP.NET Application Services Page Framework, Server Controls ASP.NET Application Pages Web Services Atlas Script Framework Client Application Services Component/UI Framework, Controls Initial Rendering (UI + Behavior) Data Data
  23. 27. AJAX Application <ul><li>Do not trust client input </li></ul><ul><li>Do not enforce business rules on the client </li></ul><ul><li>Do not think that this is for “Everything” </li></ul><ul><ul><li>Is it bookmark-able? </li></ul></ul><ul><ul><li>Search Engine Spiderable ( SEO )? </li></ul></ul><ul><ul><li>Do I need to be able use the back button? { consider history extender } </li></ul></ul><ul><ul><li>Consider my API and API Security </li></ul></ul>No-No’s and Gotchas!
  24. 28. External Services My Application Client Bridge Proxy (Script) External Service Server Pages UI + Logic (HTML + Script) Bridge Config Initiate Request Cache Lookup Create Service Request Invoke Service Process Service Response Update Display
  25. 29. asp.net/ajax/showcase examples
  26. 30. asp.net/ajax/showcase examples
  27. 31. ajax.asp.net /downloads/
  28. 35. <ul><li>Separate download </li></ul><ul><ul><li>Library of free ASP.NET AJAX enabled controls </li></ul></ul><ul><ul><li>ASP.NET 2.0 and .NET 3.5 (w / w/o source) available </li></ul></ul><ul><ul><li>Download from http://ajax.asp.net </li></ul></ul><ul><li>Collaborative source model </li></ul><ul><ul><li>All source freely available with modification license </li></ul></ul><ul><ul><li>Microsoft & non-Microsoft developers contribute </li></ul></ul><ul><li>Already contains 35+ really cool controls </li></ul><ul><ul><li>Goal is to get 50-100 great controls </li></ul></ul><ul><li>Biggest challenge creating new controls? </li></ul><ul><ul><li>Thinking of behaviors that aren’t already offered! </li></ul></ul>Control Toolkit
  29. 36. Demo <ul><li>“ Hello World” with the UpdatePanel ScriptManager, UpdatePanel, Triggers, UpdateProgress </li></ul>
  30. 37. protected void UpdatePanel1_PreRender(object sender, EventArgs e) { // This code will only be executed if the partial postback // was raised by a __doPostBack('UpdatePanel1', '') if (Request[&quot; __EVENTTARGET &quot;] == UpdatePanel1. ClientID ) { // Insert magic here. } } what about when you want to execute code only if a particular UpdatePanel is targeted? check the __EVENTTARGET: UpdatePanel Events use triggers check for !IsPostBack and !IsInAsyncPostBack
  31. 38. UpdatePanel Events know your asp.net page life cycle UpdatePanel Button updatepanel_ load button_ click updatepanel_ prerender
  32. 39. Demo <ul><li>Working with Extenders ASP.NET AJAX Control Toolkit </li></ul>
  33. 40. 2008
  34. 41. Demo <ul><li>Working with Visual Studio 2008 ASP.NET 3.5 Preview, Debug, JavaScript Intellisense </li></ul>
  35. 42. custom extender controls provide framework for hooking up properties and links between server and client side components provide framework for hooking up properties and links between server and client side components
  36. 43. custom extender controls provide framework for hooking up properties and links between server and client side components
  37. 44. ASP.NET AJAX Components types of client components
  38. 45. Demo <ul><li>Building Your Own Extender Extender Walkthrough: Confirm Button Extender </li></ul>
  39. 47. <ul><li>IE7 with Developer Toolbar </li></ul><ul><li>FireFox with Web Developer ToolBar </li></ul><ul><li>FireFox with FireBug </li></ul><ul><li>Nikhil’s Web Developer Helper http://projects.nikhilk.net/Projects/WebDevHelper.aspx </li></ul>Resources + Tools (!)
  40. 48. <ul><li>How Do I Videos </li></ul>
  41. 49. <ul><li>How Do I Videos </li></ul>
  42. 50. <ul><li>How Do I Videos </li></ul>
  43. 51. <ul><li>“ Official ASP.NET AJAX” - http://ajax.asp.net </li></ul><ul><li>Fiddler http://www.fiddlertool.com/fiddler/ </li></ul><ul><li>JavaScript Bible </li></ul>Resources + Tools ++
  44. 52. copyright
  45. 53. [all images in this presentation are the property and copyright of their owners… Most of which I just found on the Internet and really have no idea who that might be.] copyright
  46. 54. email [email_address] Caleb Jenkins Senior Consultant Training Mentor blog developingUX.com twitter .com/calebjenkins
  47. 55. www.ImprovingEnterprises.com http://CommunityCast.tv http://ineta.org www.DevelopingUX.com
  48. 57. http://ImprovingEnterprises.com Improving… It’s what we do!

×