JSConfCo: Desarrollo de Aplicaciones para Windows Store con HTML5 y Javascript

Preview:

Citation preview

contacto@soreygarcia.com | @soreygarcia | blog.soreygarcia.me

Escuela de Arte Bahaus - Simplicidad

Swiss Style – Experiencias comunes

Kinetic typography – Movimiento / Tipografía

10” 1024x76813” 1400x105020” 1920x108030” 2560x160011.6” 1366x768

42pt

20pt

11pt

11pt

11pt

9pt

HTML5, CSS3 y JS

Diferencias de uso HTML Web y HTML Nativo

App Container

HTML Host Process

Internet Explorer

Web

Platform

TAB

App Code

Web Platform

Windows

Runtime

App Code

Running app

Windows

Runtime

Running app

Windows

Runtime

App Container

App Code

Web Platform

HTML App Host Process

Running app

Windows

Runtime

App Container

App Code

Web Platform

HTML App Host Process

Running app

Windows Runtime

App

launch

Splash

screen

¿Windows 8.1?

Geo-location

Proximity

Direct3D Direct2D Direct Write

PlayTo

Contracts

Bing

Azure Mobile

HTML5/CSS XAMLInput Controls

Authentication

Portable

Sensors Playback Capture

Printing

SVGCanvas

Local storage

SMS

StreamsBackground

transfer

Syndication Networking

XML and JSON

Skydrive

Live tiles and toast

Accessibility Data binding

Application services

Threading/timersMemory

managementGlobalization Cryptography

Xbox Live

Geo-location

Proximity

Direct3D Direct2D Direct Write

PlayTo

Contracts

Bing

Azure Mobile

HTML5/CSS XAMLInput Controls

Authentication

Portable

Sensors Playback Capture

Printing

SVGCanvas

Local storage

SMS

StreamsBackground

transfer

Syndication Networking

XML and JSON

Skydrive

Live tiles and toast

Accessibility Data binding

Application services

Threading/timersMemory

managementGlobalization Cryptography

Xbox Live

Geo-location

Proximity

Direct3D Direct2D Direct Write

PlayTo

Contracts

Bing

Azure Mobile

HTML5/CSS XAMLInput Controls

Authentication

Bluetooth

USB

HID WiFi direct

Point of service

3Dprinting

Scanning

WebGL

HTTP

Contacts

Appoint-ments

PDF

Speech synthesis

Diagnostics

Portable

Sensors Playback Capture

Printing

SVGCanvas

Local storage

SMS

StreamsBackground

transfer

Syndication Networking

XML and JSON

Skydrive

Live tiles and toast

Accessibility Data binding

Application services

Threading/timersMemory

managementGlobalization Cryptography

Xbox Live

http://msdn.microsoft.com/en-us/library/windows/apps/hh700404.aspx

window.returnValue Not supported.

window.sessionStorage This property appears to

work, but data is lost

when the app is

terminated. Do not use

this property to store

app state.

window.showHelp Not supported.

window.showModalDial

og

Not supported.

window.showModeless

Dialog

Not supported.

xhr.responseBody Not supported.

En general, las API de HTML y DOM

funcionan del mismo modo que lo harían

en Windows Internet Explorer en modo

estándar. Pero hay algunas diferencias.

Algunas de ellas se producen por

ejecutarse dentro del shell de Windows,

que controla qué tipos de ventanas puedes

abrir. Otras diferencias son el resultado de

la aplicación de la Tienda Windows con el

modelo de seguridad de JavaScript.

// Omitted code

Hace que sea más sencillo evitar conflictos

de nomenclatura o situaciones donde

accidentalmente modifiques un valor que

no tenías intención de modificar.

Además, mantiene a los identificadores

innecesarios lejos del espacio de nombres

global, lo que ayuda al rendimiento.

http://msdn.microsoft.com/es-

es/library/windows/apps/br230269.aspx

Puedes dividir la aplicación en varios

archivos; pero en lugar de desplazarse de

página a página, la aplicación carga otros

documentos en la página principal. Dado

que la página principal de la aplicación

nunca se descarga, los scripts tampoco lo

hacen y eso facilita la administración del

estado, las transiciones y las animaciones.

Para ayudar a crear aplicaciones que usan

el modelo de navegación de una página, la

biblioteca de Windows para JavaScript

proporciona el objeto

WinJS.UI.Pages.PageControl.

Trusted content

from local package

Untrusted content from

web or must interact with such

http://

Local context Web context

http://ms-appx:/// ms-appx-web:///

@media (min-width: 500px) and (max-width: 1023px) {/* CSS styles to change layout based on window width */

}@media (min-width: 1024px) {

/* CSS styles to change layout based on window width */}

Azure Mobile Services

Windows Store iOS

Android

Windows Phone 8

iOS

Android

HTML 5/JS

SDKs

Server-Side

Scripts

&

Scheduler

Además de miles de tutoriales y todo el contenidoen MSDN, se encuentra esteeBook gratuito que puede serdescargado en Mobi, EPUB, PDF y desde la tienda de Amazon Gratis.

http://blogs.msdn.com/b/microsoft_p

ress/archive/2012/10/29/free-ebook-

programming-windows-8-apps-with-

html-css-and-javascript.aspx

Gracias@soreygarcia

Recommended