Jim Jackson - HTML5 for .NET Developers

For online information and ordering of this and other Manning books, please visit www.manning.com. The publisher offers discounts on this book when ordered in quantity. For more information, please contact

Special Sales Department Manning Publications Co. 20 Baldwin Road PO Box 261 Shelter Island, NY 11964 Email: orders@manning.com

2013 by Manning Publications Co. All rights reserved.

No part of this publication may be reproduced, stored in a retrieval system, or transmitted, in any form or by means electronic, mechanical, photocopying, or otherwise, without prior written permission of the publisher.

Many of the designations used by manufacturers and sellers to distinguish their products are claimed as trademarks. Where those designations appear in the book, and Manning Publications was aware of a trademark claim, the designations have been printed in initial caps or all caps.

Recognizing the importance of preserving what has been written, it is Mannings policy to have the books we publish printed on acid-free paper, and we exert our best efforts to that end. Recognizing also our responsibility to conserve the resources of our planet, Manning books are printed on paper that is at least 15 percent recycled and processed without the use of elemental chlorine.

Manning Publications Co.20 Baldwin RoadPO Box 261Shelter Island, NY 11964

Development editor: Renae GregoireTechnical proofreader: Roland CivetCopyeditor: Andy CarrollProofreader: Melody DolabTypesetter: Dennis DalinnikIllustrator: Gerry ArringtonCover designer: Marija Tudor

Printed in the United States of America

1 2 3 4 5 6 7 8 9 10 MAL 18 17 16 15 14 13 12

To my lovely bride, Michelle, and my beautiful daughters, Norah and Mary. Thank you for your help, support, patience, and understanding.

J.J.

To Christina and Caitlyn, my amazing wife-and-daughter team.

I.G.

HTML5 is taking over the world. Oh no!

.NET is dead! Java is dead!

Everything is dead and HTML5 is the only technology left standing!

Wait, none of the above is true at all. It turns out that HTML5 is a wonderful tool in our toolbox, one that makes our other tools even better. In fact, learning HTML5 is one of the best things a .NET developer can do today..NET on the server and HTML5 in a new browser on the client are a killer combination.

Jim and Ian have written about HTML5 in a voice that speaks directly to the interests and concerns of the .NET developer. The samples are clear and useful but also coded from the perspective of an ASP.NET programmer who wants to get things done. This is hugely helpful for existing ASP.NET and .NET coders who want to get up to speed on HTML5.

HTML5 is a collection of new tags and bits of markup, but the term HTML5 is overloaded. It also encapsulates CSS3 and new JavaScript APIs, like GeoLocation and LocalStorage. But HTML5 is more than these new toolsit is more than a specification; its a new way to think about writing web applications; its an assumption that your clients browser has capabilities and processing power that we couldnt dream up three years ago.

A few years ago, if you wanted a chart in a browser youd either use Flash or dynamically generate an image on the server side. Today, you can send the browser all the data a chart needs via JSON and then let the user not only see a chart generated with HTML5 Canvas, but also interact with or even change the data on the client. A few years ago, your server was the only computer with the wherewithal to sort, query, and manipulate interesting cubes of data. Today, youve got a tiny database and a powerful JITed virtual machine inside your clients web browser.

Fortunately for us all, you can write HTML5 today with ASP.NET; and with the release of ASP.NET 4.5, we see additional support for HTML5. The latest Visual Studio also adds improvements in JavaScript and CSS3 editing. All of HTML5 and its wondrous bits and pieces are ready for you in Web Forms, Web Pages, and MVC. Your ASP.NET applications can generate HTML5 that still works in older browsers thanks to the Modernizr feature detection library. You can use HTML5 and JavaScript on the client to call ASP.NET Web APIs on the server. HTML5 is a technology that makes the .NET developers life more interesting!

There are many books that talk about HTML5 as if it were an island, disconnected from any server technology. This is not the case with HTML5 for .NET Developers by Jim and Ian. If youre a longtime ASP.NET developer looking to bone up on new techniques in web development, or if youre just getting started with ASP.NET and you want to make sure youre attacking new problems in the most modern and progressive way, this is the book for you.

S COTT H ANSELMAN
W EB C OMMUNITY A RCHITECT
M ICROSOFT

In early 2010, I had just finished up a workflow proof-of-concept project and was poking around other projects at Applied Information Sciences, looking for what was next in my software career. Since I had some Silverlight experience and wanted to expand it further, I requested a role on a project to enhance a magazine viewer originally produced by Vertigo (vertigo.com) for Bondi Digital (BondiDigital.com). I ended up rebuilding the processing software that imported the source images and data into the viewer format. This was fortuitous because it was a project role that would continue while many others rotated in and out over the next two years.

When the processing solution was complete, I got involved in the Silverlight area of the application, and it was about this time that Apples new toy, the iPad, took off. It seemed to the project stakeholders that an HTML-only version of our viewer would be appropriate, so we got to work. For a traditional ASP.NET and Silverlight developer like me, this was new ground, and it took a number of months and hundreds of dollars in books for me to get my footing with JavaScript and to unlearn all the bits and pieces of ASP.NET that hide the true nature of HTML, CSS, and JavaScript.

With a little knowledge and the help of other AIS employees who were working with Manning Publications on various book ideas, I got Mike Stephens name and called over to discuss a book proposal on Silverlight and GIS, my hobby and one of my technology passions. We were pretty close to writing up a book contract when a Microsoft employee happened to mention in an interview that they (MS) were refocusing Silverlight. This came as a shock to all of the Silverlight developers and client companies who had been investing heavily in the technology for rich client-side web solutions.

Despite some backtracking and spinning the news, this appears to have been a correct move on Microsofts part. While Silverlight is certainly not dead, it has been eclipsed by HTML5 in terms of industry hype and project work moving forward. For web consultancies, this is not such a huge problem, because ASP.NET MVC is a top-tier platform on which to build rich client-side HTML applications. Windows 8 allows HTML/CSS and JavaScript as first-class development languages for native software! Its not a panacea, but it is a great tool to have in the belt.

While all of this was happening in the industry, I became more involved in the new HTML version of the magazine viewer application. And because the Silverlight/GIS book was clearly not going to fly in the marketplace, Mike at Manning asked what other applications I was working on. I responded that we were building a rich HTML5 client, integrating ASP.NET MVC and deploying it to SQL Azure and Azure Web Roles. We could do a book about any of those things! was Mikes response. Of course, I didnt think I was nearly qualified enough to write such an authoritative tome, but Mike convinced me that I was, in fact, in the perfect position to do so. As a seasoned developer who had moved from strict ASP.NET and rich-client C# applications into JavaScript and HTML, I was in a good position to describe the technologies from a common perspective.