Empfohlen
Weitere ähnliche Inhalte
Was ist angesagt?
Was ist angesagt? (20)
Andere mochten auch
Andere mochten auch (20)
Ähnlich wie Microsoft and jQuery: A true love story - templating and other contributions
Ähnlich wie Microsoft and jQuery: A true love story - templating and other contributions (20)
Kürzlich hochgeladen
Kürzlich hochgeladen (20)
Microsoft and jQuery: A true love story - templating and other contributions
- 1. James Senior - Microsoft Web Evangelist@jsenior - www.jamessenior.com
- 3. Microsoft & jQuery: A True Love Story
- 4. A few months ago…
- 7. Once upon a time… 1997: Classic ASP 1, 2, 3 2002: ASP.NET 1.0 and WebForms Ajax Control Toolkit 2003 to 2007: ASP.NET 1.1, 2, 3, 3.5 2008: Visual Studio 2008 - including jQuery 2008: Official Support for jQuery 2009: ASP.NET MVC – including jQuery 2009: ASP.NET Ajax Library 2009: jQuery on the Microsoft CDN 2010: ASP.NET 4 – including jQuery
- 8. Visual studio 2010(now with better Javascript support) Demo-tastic
- 9. Back in February, it was just another day at work
- 10. ASP.NET Ajax Library Open Source JavaScript Library Cool features, including Script Loader Data-Linking Observer class Templating Data Controls jQuery integration
- 11. Perfect Match jQuery ASP.NET Ajax Templating Data-Linking Script Loader WCF OData .NET RIA Selectors Plugins Animation
- 12. First Date
- 13. All good relationships… Have a clear contribution model Are open, transparent and collaborative Are in the spirit of jQuerycommunity Have specification & Proposals on jQuery Forums Have prototypes as plugins in Github jQuery Core Cool stuff ++ jQuery Core Team ASP.NET Ajax Library Cool Stuff jQuery Plugins Cool stuff Proposal, Specification, Prototype
- 14. jQueryTemplating 1stcontribution from Microsoft Proposal, Spec and Prototype online http://github.com/jquery/jquery-tmpl
- 15. The Contribution model in action…
- 16. What is Templating? Data Templating Engine DOM Template
- 17. Why client-side templates? Aren’t server side templates good enough? Couldn’t I do this before?
- 18. What is a Template? vartmpl = "<li>${ dataItem }</li>";
- 19. What is a Template? <script id=“myTemplate" type="text/html"> <li>${ dataItem }</li> </script>
- 20. What is a Template? <script id="productsTemplate" type="text/html"> <div> <imgsrc="Content/ProductImages/${Picture}" class="productImage" /> <span class="productName">${Name}</span> Price: ${formatPrice(Price)} <img data-pk="${Id}" src="Content/AddCart.png" alt="Add to Cart" class="addCart" /> </div> </script>
- 21. .render() <script id=“myTemplate" type="text/html"> <li>${ dataItem }</li> </script> $("#myTemplate") .render( dataObject) .appendTo("ul"); <ul> <li>foo</li> </ul>
- 22. .render() <script id=“myTemplate" type="text/html"> <li>${ dataItem }</li> </script> $("#myTemplate") .render( arrayOfDataObjects ) .appendTo("ul"); <ul> <li>foo_0</li> <li>foo_1</li> </ul>
- 23. jQueryTemplating Can I haz demo?
- 24. And then there was more…
- 25. jQuery Data Linking Sync data and UI
- 26. jQuery Data Linking Golden Rule - modify data using jQuery
- 27. Data linking Demo Fest
- 28. Wait a minute… What about the ASP.NET Ajax Library? It’s now RTM quality code Resides in Ajax Control Toolkit (still an open source project) Still served on the CDN We are not actively developing new features
- 29. This love story is to be continued…
- 30. More Love: Web Camps Update Free, 2 day events – Learn and Build 3000 people in 12 cities More events being announced after the summer www.webcamps.ms
- 31. How to find your love Check out the proposals, specs and prototypes Give your feedback to the community Tell a friend about what you heard today Get free tooling http://microsoft.com/web Come along to a Web Camp www.webcamps.ms Slides and demos are on my blog…
- 32. Contact Me James SeniorMicrosoft Web Evangelist @jsenior james@microsoft.com www.jamessenior.com
- 33. Thank you!