Your SlideShare is downloading. ×
Microsoft and jQuery: A true love story - templating and other contributions
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×

Introducing the official SlideShare app

Stunning, full-screen experience for iPhone and Android

Text the download link to your phone

Standard text messaging rates apply

Microsoft and jQuery: A true love story - templating and other contributions

2,643
views

Published on

How the Microsoft and jQuery relationship has evolved over time and how Microsoft are now contributing to the world's most popular javascript library, jQuery.

How the Microsoft and jQuery relationship has evolved over time and how Microsoft are now contributing to the world's most popular javascript library, jQuery.

Published in: Technology

0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
2,643
On Slideshare
0
From Embeds
0
Number of Embeds
1
Actions
Shares
0
Downloads
48
Comments
0
Likes
1
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
No notes for slide

Transcript

  • 1. James Senior - Microsoft Web Evangelist@jsenior - www.jamessenior.com
  • 2.
  • 3. Microsoft & jQuery: A True Love Story
  • 4. A few months ago…
  • 5.
  • 6.
  • 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: Shipping jQuery & jQuery Support
    2009: ASP.NET MVC – including jQuery
    2009: ASP.NET Ajax Library
    2009: jQuery Support and CDN
    2010: ASP.NET 4 – including jQuery
  • 8. Visual studio 2010
    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!