windows 8 loves web developers
DESCRIPTION
Windows 8 Loves Web Developers. Lauri Svan, SC5 | 5.3.2013. #td2013fi. A Word on Lauri. An experienced developer and dreamer; that makes me an architect. I craft apps that run on several platforms (desktop and mobile ) and help our teams in SC5 to do the same. - PowerPoint PPT PresentationTRANSCRIPT
Windows 8 Loves Web DevelopersLauri Svan, SC5 | 5.3.2013#td2013fi
©2012 Microsoft Corporation. All rights reserved.
A Word on Lauri An experienced developer and dreamer; that makes me an architect.I craft apps that run on several platforms (desktop and mobile) and help our teams in SC5 to do the same.I try to stay neutral on technology choices; I want to minimize my and my customers’ costs and vendor lock-in.My choice has lately been HTML5.I am not a “web designer” or “Windows 8 expert”; the bulk of my career is about building Java and C++ frameworks.
What Windows 8 Means for Me?• Fast, HTML5 compliant browser engine• Growing and potentially huge ecosystem
of consumer and enterprise users• Access to system services like a native
app
• New conventions I need to learn and live with#td2013fi
HTML5 and Windows 8 – Best of the Both Worlds?
A huge selection of open, extensible libraries
The widest developer base
Reusing of existing know-how
A wide selection of system APIs
The widest user base?
Platform-wide conventions
HTML5 / JavaScript Windows 8 / WinRT
Windows 8 & HTML5The same style, different tools
Windows 8 – a Holistic Developer Offering• It feels a bit overwhelming at start• But you will soon start seeing familiar
patterns• It is HTML5, CSS and JavaScript after all
• Your skills will transfer• But your existing coding patterns might
not#td2013fi
RégisLaurentDirector of Operations, Global KnowledgeCompetencies include:Gold LearningSilver System Management
Demo: Hacking a bit with Visual Studio & Blender
#td2013fi
Anatomy of a Windows 8 HTML5 AppA Sample HTML5 App
Windows 8 HTML5 App
Browser RuntimejQuery
Backbone.js
Tem
plat
es
Mode
ls
View
s
Misc
. Cod
e
Utilit
y Lib
rarie
s
WinJS API
WinJS.UI
Data
So
urce
sPa
ges
Page
Sp
ecifi
cLo
gic
Utilit
y Lib
rarie
s
What do I Mean by Different? Tools.Windows 8 Elsewhere
Package Manager NuGet Bower, NPM
Native “wrapper” WinRT Cordova (ex. PhoneGap)
Version Control Git (soon integrated into Visual Studio) Git
IDE Visual Studio + Expression Blend Eclipse
Test Server Node.js (+ CygWin) Node.jsOperating System Windows 8 on Parallels on OS/X OS/X
What do I Mean by Different? Frameworks.
Windows 8 ElsewhereUI Widgets WinJS UI Bootstrap, jQuery Mobile
MVC Framework WinJS.UI Backbone.js
Responsive Grid -ms-grid styles Semantic.gs
Feature Detection none (not needed) ModernizrDOM
manipulation none (a lot of need) jQuery
Modularization none (no need yet) Require.js
Native Access WinJS APIs (HTML5?) HTML5 APIs, Cordova API
Write your first app with MS stack – there is a lot of love put into it.Then see what you can reuse from your own toolbox.
Windows 8 Specific vs. Common
WinJS.UIIt is silly to reinvent the wheel if it already worksGrid – it is better than the one you are used toYour existing CSS code will likely be wastedPackagingYou will need to learn the conventions of packaging Windows 8 apps, including splash screens, tiles etc.WinJS APIA good list of alternatives when you cannot use the 3rd party libraries
Server APIs and BindingsXHRs work both normal way and with WinJSImplement WinJS UI specific interfaces/adapters for your API (some reuse possible!)Project layout, builds, infraNothing stops you adding a Windows 8 subproject into your project.e.g. RequireJS and Grunt, Git work all fineSome 3rd party librariesAs long as they don’t break the security sandbox, they should be fine.
to Learn to Keep
My App in Windows 8 - It the Same Anymore?• Your application will be a separate entity,
not a result of a build parametrization• You will have a separate UI skeleton with
different HTML, and CSS
• You may share non-UI (and some UI) libraries
#td2013fi
RégisLaurentDirector of Operations, Global KnowledgeCompetencies include:Gold LearningSilver System Management
Demo: Using RequireJS, jQuery and D3 Libraries in Windows 8 App
#td2013fi
The biggest step is“stop worrying and love WinJS”
t Q&A
© 2013 Microsoft Corporation. All rights reserved. Microsoft, Windows, Windows Vista and other product names are or may be registered trademarks and/or trademarks in the U.S. and/or other countries. The information herein is for informational purposes only and represents the current view of Microsoft Corporation as of the date of this presentations. Because Microsoft must respond to changing market conditions, it should not be interpreted to be a commitment on the part of Microsoft, and Microsoft cannot guarantee the accuracy of any information provided after the date of this presentation. MICROSOFT MAKES NO WARRANTIES, EXPRESS, IMPLIED OR STATUTORY, AS TO THE INFORMATION IN THIS PRESENTATION.
Thank you for coming!Feedback can be given via mobile or laptop through techdays.fi seminar schedule.
Example
#td2013fi