I attended SuperHappyDevHouse #40 at the Microsoft Silicon Valley campus last Saturday(Sept 18, 2010). It is the largest SuperHappyDevHouse ever with over 500 developers/hackers/entrepreneurs showed up throughout the day from 1 pm to 1 am. Here are some pictures to share with you.
I presented at the Lighting talk of SuperHappyDevHouse. There were about 11 speakers and each would have only no more than 5 minutes. This talk is inspired by Stephen Walther’s blog. My original plan was to demonstrate developing a Netlfix Movie search and play application leveraging the technology of jQuery, OData, JSONP, and Netflix API in a simple HTML file in 5 minutes. However, because of the logistic reason, I can only using slides so I have shared my slide deck with you below. The presentation covers the architecture, OData detail, key steps in developing this application and step by step code.
The architecture of this application is illustrated in the slide below. Everything is developed using one simple HTML. A startup page allows you to enter the movie name to lookup through Netflix site. During the look up, it will send a Netflix OData query via a JSONP Ajax call to the Netfllix OData Provider. JSONP is used here for resolving the cross domain issue. As a response, the Netflix will return the matching movie in JSON format. Then using jQuery template approach to display the result. Microsoft has contributed jQuery template jquery.tmpl.js to jQuery project and it will be part of core jQuery 1.5 in the next release. Once you get a list of movies, you can click play button to play the movie in Netflix player. Two things you need to get before you can run this application:
- You need to download jquery.tmpl.js from http://github.com/jquery/jquery-tmpl. Put this file under a separate directory called Scripts
- You need to apply a Netflix Developer API account for the API key as well as a Netflix account to play the movies.
The code in HTML is also illustrated below: