Your SlideShare is downloading. ×
Windows 8 javascript apps – getting it right
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

Windows 8 javascript apps – getting it right


Published on

Published in: Technology

  • Be the first to comment

  • Be the first to like this

No Downloads
Total Views
On Slideshare
From Embeds
Number of Embeds
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

No notes for slide
  • jQuery normalizes browser quirksBut you don’t have multiple browsersSizzle adds CSS selector queriesThis is native in IE10 (and IE9)WinJS has APIs for thisMost animations can be done with CSS3
  • Transcript

    • 1. Windows 8 JavaScript Apps – getting it @brendankowitz
    • 2. 1 • Introduction • WinJs • Testing2 • TypeScript • Using C# Libraries • Debugging3 • Wrapup
    • 3. Why use WinJS?• Can still use C# libraries• Power of CSS3 and HTML5• WinJS’s bindings to native controls and also has many JS-only extensions for Win8• JavaScript was always ASYNC• Better than XAML
    • 4. Introducing “Sorty”
    • 5. Elo
    • 6. Getting started with WinJs• VS2012 (duh) – VS 2012 Web Essentials – Blend for Visual Studio• Online: Roadmap for Windows Store apps using JavaScript –
    • 7. So it’s like making a web site?…• Its HTML5, JS and CSS• Can use a large number of existing JS libs• You have some browser limitations• Watch out for DOM manipulation errors
    • 8. …but not• COM Wrapped in JavaScript• Exception driven development• You don’t have network latency to load resources• You don’t have traditional page events• Tombstoning• You don’t _need_ jQuery
    • 9. 3rd Party JS Controls• Existing JavaScript plugins _can_ – Produce problematic HTML – Break Windows 8 UX guides• Stick with shipped controls• Or build your own• Use those specifically created via a vendor (Telerik etc)
    • 10. Testing• C# code can take advantage of built-in Visual Studio Testing framework• JS can use Mocha or other JS testing libraries
    • 11. Testing demo
    • 12. Using C# Libraries• Can only reference WinMD libraries• WinMD libraries can reference portable and Windows Store libraries• Unit testing supported• WinMD libraries CAN reference other Windows Store and Portable Libraries
    • 13. Async• You will need to make use of the Promise pattern WinJS.xhr({ url:"" }).done(function (response) { updateDisplay( JSON.parse(response.responseText)); });
    • 14. Libraries• Portable libraries• WinMD libraries• Windows Store Libraries
    • 15. Consuming C# from WinJS
    • 16. Typescript for WinJs?• Yes.• Windows 8 & VS2012• Download the TypeScript plugin: 6563• VS 2012 Web Essentials: om/07d54d12-7133-4e15-becb- 6f451ea3bea6
    • 17. TypeScript in WinJS
    • 18. Storage• Local storage• Roaming storage• Offline storage – IndexDB
    • 19. Debugging• You can debug in JS• You can debug in C#• No, you can’t debug across both (yet)
    • 20. Gotchas• DEBUGGING. – If using C# Libraries with JS• WinJS adds crazy inline stuff to the DOM
    • 21. Getting it together
    • 22. Discussion• Do you currently have a WinJS app?• Would you consider writing a WinJS app?• Any other questions?
    • 23. brendan.kowitz@readify.netThank you. @brendankowitz