SlideShare uma empresa Scribd logo
1 de 105
Baixar para ler offline
contacto@soreygarcia.com | @soreygarcia | blog.soreygarcia.me
Escuela de Arte Bahaus - Simplicidad
Swiss Style – Experiencias comunes
Kinetic typography – Movimiento / Tipografía
11.6” 1366x768
30” 2560x1600
20” 1920x1080
13” 1400x1050
10” 1024x768
42pt

11pt

20pt

11pt

9pt

11pt
HTML5, CSS3 y JS
Diferencias de uso HTML Web y HTML Nativo
Internet Explorer

TAB

HTML Host Process

App Code
Web Platform

App Code

Web
Platform
App Container

Windows
Runtime
Running app

Windows
Runtime
Running app

Windows
Runtime
Running app
HTML App Host Process
App Code
Web Platform

App Container

Windows
Runtime
Running app
HTML App Host Process
App Code
Web Platform

App Container

Windows Runtime
App
launch

Splash
screen
¿Windows 8.1?
Accessibility

Data binding

Live tiles and
toast

Input

Controls

HTML5/CSS

XAML

Portable

Geolocation

Direct3D

Direct2D

Direct Write

Local
storage

SMS

Skydrive

Sensors

Proximity

Playback

Capture

PlayTo

Streams

Background
transfer

Bing

Canvas

SVG

Syndication

Networking

Azure
Mobile

XML and
JSON

Contracts

Xbox Live

Printing

Application
services

Threading/timers

Memory
management

Globalization

Cryptography

Authentication
Accessibility

Data binding

Live tiles and
toast

Input

Controls

HTML5/CSS

XAML

Portable

Geolocation

Direct3D

Direct2D

Direct Write

Local
storage

SMS

Skydrive

Sensors

Proximity

Playback

Capture

PlayTo

Streams

Background
transfer

Bing

Canvas

SVG

Syndication

Networking

Azure
Mobile

XML and
JSON

Contracts

Xbox Live

Printing

Application
services

Threading/timers

Memory
management

Globalization

Cryptography

Authentication
Accessibility

Data binding

Live tiles and
toast

Input

Controls

HTML5/CSS

XAML

Speech synthesis

Portable

Geolocation

Point of
service

Direct3D

Direct2D

Direct Write

Local
storage

SMS

HTTP

Skydrive

Sensors

Proximity

USB

Playback

Capture

PlayTo

Streams

Background
transfer

Contacts

Bing

HID

WiFi direct

Bluetooth

Canvas

SVG

WebGL

Syndication

Networking

Appointments

Azure
Mobile

Printing

3D
printing

Scanning

XML and
JSON

Contracts

PDF

Xbox Live

Application
services

Threading/timers

Memory
management

Globalization

Cryptography

Authentication

Diagnostics
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 Not supported.
og
window.showModeless
Dialog

Not supported.

xhr.responseBody

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.

Not supported.

http://msdn.microsoft.com/enus/library/windows/apps/hh700404.aspx
// 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/eses/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.
Local context
ms-appx:///
Trusted content
from local package

Web context
ms-appx-web:///
http://

http://

Untrusted content from
web or must interact with such
@media
/*
}
@media
/*
}

(min-width: 500px) and (max-width: 1023px) {
CSS styles to change layout based on window width */
(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

ServerSide
Scripts
&
Scheduler
 Además de miles de

tutoriales y todo el contenido
en MSDN, se encuentra este
eBook gratuito que puede ser
descargado en Mobi, EPUB,
PDF y desde la tienda de
Amazon Gratis.
http://blogs.msdn.com/b/microsoft_p
ress/archive/2012/10/29/free-ebookprogramming-windows-8-apps-withhtml-css-and-javascript.aspx
Gracias
@soreygarcia

Mais conteúdo relacionado

Mais procurados

Tendencias de movilidad en el mercado masivo y empresarial
Tendencias de movilidad en el mercado masivo y empresarialTendencias de movilidad en el mercado masivo y empresarial
Tendencias de movilidad en el mercado masivo y empresarialSorey García
 
Estrategias para desarrollo crossplatform en Windows Phone 8 y Windows 8
Estrategias para desarrollo crossplatform en Windows Phone 8 y Windows 8Estrategias para desarrollo crossplatform en Windows Phone 8 y Windows 8
Estrategias para desarrollo crossplatform en Windows Phone 8 y Windows 8Sorey García
 
Windows Phone 8: Tips de Diseño para Desarrolladores
Windows Phone 8: Tips de Diseño para DesarrolladoresWindows Phone 8: Tips de Diseño para Desarrolladores
Windows Phone 8: Tips de Diseño para DesarrolladoresSorey García
 
WinObjC: Windows Bridge para iOS
WinObjC: Windows Bridge para iOSWinObjC: Windows Bridge para iOS
WinObjC: Windows Bridge para iOSJavier Suárez Ruiz
 
[Evento WPSUG] Universal Windows Platform Bridges
[Evento WPSUG] Universal Windows Platform Bridges[Evento WPSUG] Universal Windows Platform Bridges
[Evento WPSUG] Universal Windows Platform BridgesJavier Suárez Ruiz
 
Xamarin Dev Days Málaga 2017 - Apps conectadas con Azure
Xamarin Dev Days Málaga 2017 - Apps conectadas con AzureXamarin Dev Days Málaga 2017 - Apps conectadas con Azure
Xamarin Dev Days Málaga 2017 - Apps conectadas con AzureJavier Suárez Ruiz
 
Introducción a Xamarin utilizando MVVMCross
Introducción a Xamarin utilizando MVVMCrossIntroducción a Xamarin utilizando MVVMCross
Introducción a Xamarin utilizando MVVMCrossJavier Suárez Ruiz
 
Back2Learn MSFT UCuenca - Desarrollo de apps móviles multiplataforma con Xam...
Back2Learn MSFT UCuenca - Desarrollo de apps móviles multiplataforma con Xam...Back2Learn MSFT UCuenca - Desarrollo de apps móviles multiplataforma con Xam...
Back2Learn MSFT UCuenca - Desarrollo de apps móviles multiplataforma con Xam...Luis Beltran
 
Herramientas para el desarrollo de Apps Universales
Herramientas para el desarrollo de Apps UniversalesHerramientas para el desarrollo de Apps Universales
Herramientas para el desarrollo de Apps UniversalesJavier Suárez Ruiz
 
Taller MVVM Imagine Camp Medellín (Intermedio)
Taller MVVM Imagine Camp Medellín (Intermedio)Taller MVVM Imagine Camp Medellín (Intermedio)
Taller MVVM Imagine Camp Medellín (Intermedio)Sorey García
 
Adaptando Apps Xamarin.Forms a tabletas
Adaptando Apps Xamarin.Forms a tabletasAdaptando Apps Xamarin.Forms a tabletas
Adaptando Apps Xamarin.Forms a tabletasJavier Suárez Ruiz
 
Interfaces nativas Cross-Platform con Xamarin.Forms
Interfaces nativas Cross-Platform con Xamarin.FormsInterfaces nativas Cross-Platform con Xamarin.Forms
Interfaces nativas Cross-Platform con Xamarin.FormsJavier Suárez Ruiz
 
Microsoft Tech Summit - Taller Xamarin
Microsoft Tech Summit - Taller XamarinMicrosoft Tech Summit - Taller Xamarin
Microsoft Tech Summit - Taller XamarinJavier Suárez Ruiz
 
Desarrollo para Microsoft Band con Xamarin
Desarrollo para Microsoft Band con XamarinDesarrollo para Microsoft Band con Xamarin
Desarrollo para Microsoft Band con XamarinJavier Suárez Ruiz
 
Talks4Kids 2015 - Consejos Heisenberg para conseguir Apps Windows 10 con 99% ...
Talks4Kids 2015 - Consejos Heisenberg para conseguir Apps Windows 10 con 99% ...Talks4Kids 2015 - Consejos Heisenberg para conseguir Apps Windows 10 con 99% ...
Talks4Kids 2015 - Consejos Heisenberg para conseguir Apps Windows 10 con 99% ...Javier Suárez Ruiz
 
Universal Windows Platform Bridges
Universal Windows Platform BridgesUniversal Windows Platform Bridges
Universal Windows Platform BridgesJavier Suárez Ruiz
 

Mais procurados (20)

Tendencias de movilidad en el mercado masivo y empresarial
Tendencias de movilidad en el mercado masivo y empresarialTendencias de movilidad en el mercado masivo y empresarial
Tendencias de movilidad en el mercado masivo y empresarial
 
Estrategias para desarrollo crossplatform en Windows Phone 8 y Windows 8
Estrategias para desarrollo crossplatform en Windows Phone 8 y Windows 8Estrategias para desarrollo crossplatform en Windows Phone 8 y Windows 8
Estrategias para desarrollo crossplatform en Windows Phone 8 y Windows 8
 
Windows Phone 8: Tips de Diseño para Desarrolladores
Windows Phone 8: Tips de Diseño para DesarrolladoresWindows Phone 8: Tips de Diseño para Desarrolladores
Windows Phone 8: Tips de Diseño para Desarrolladores
 
WinObjC: Windows Bridge para iOS
WinObjC: Windows Bridge para iOSWinObjC: Windows Bridge para iOS
WinObjC: Windows Bridge para iOS
 
[Evento WPSUG] Universal Windows Platform Bridges
[Evento WPSUG] Universal Windows Platform Bridges[Evento WPSUG] Universal Windows Platform Bridges
[Evento WPSUG] Universal Windows Platform Bridges
 
Extendiendo Xamarin.Forms
Extendiendo Xamarin.FormsExtendiendo Xamarin.Forms
Extendiendo Xamarin.Forms
 
Xamarin Dev Days Málaga 2017 - Apps conectadas con Azure
Xamarin Dev Days Málaga 2017 - Apps conectadas con AzureXamarin Dev Days Málaga 2017 - Apps conectadas con Azure
Xamarin Dev Days Málaga 2017 - Apps conectadas con Azure
 
Introducción a Xamarin utilizando MVVMCross
Introducción a Xamarin utilizando MVVMCrossIntroducción a Xamarin utilizando MVVMCross
Introducción a Xamarin utilizando MVVMCross
 
Back2Learn MSFT UCuenca - Desarrollo de apps móviles multiplataforma con Xam...
Back2Learn MSFT UCuenca - Desarrollo de apps móviles multiplataforma con Xam...Back2Learn MSFT UCuenca - Desarrollo de apps móviles multiplataforma con Xam...
Back2Learn MSFT UCuenca - Desarrollo de apps móviles multiplataforma con Xam...
 
Herramientas para el desarrollo de Apps Universales
Herramientas para el desarrollo de Apps UniversalesHerramientas para el desarrollo de Apps Universales
Herramientas para el desarrollo de Apps Universales
 
Taller MVVM Imagine Camp Medellín (Intermedio)
Taller MVVM Imagine Camp Medellín (Intermedio)Taller MVVM Imagine Camp Medellín (Intermedio)
Taller MVVM Imagine Camp Medellín (Intermedio)
 
Adaptando Apps Xamarin.Forms a tabletas
Adaptando Apps Xamarin.Forms a tabletasAdaptando Apps Xamarin.Forms a tabletas
Adaptando Apps Xamarin.Forms a tabletas
 
Reconnect(); Sevilla - Keynote
Reconnect(); Sevilla - KeynoteReconnect(); Sevilla - Keynote
Reconnect(); Sevilla - Keynote
 
Interfaces nativas Cross-Platform con Xamarin.Forms
Interfaces nativas Cross-Platform con Xamarin.FormsInterfaces nativas Cross-Platform con Xamarin.Forms
Interfaces nativas Cross-Platform con Xamarin.Forms
 
Microsoft Tech Summit - Taller Xamarin
Microsoft Tech Summit - Taller XamarinMicrosoft Tech Summit - Taller Xamarin
Microsoft Tech Summit - Taller Xamarin
 
Desarrollo para Microsoft Band con Xamarin
Desarrollo para Microsoft Band con XamarinDesarrollo para Microsoft Band con Xamarin
Desarrollo para Microsoft Band con Xamarin
 
Desktop App Converter
Desktop App ConverterDesktop App Converter
Desktop App Converter
 
Talks4Kids 2015 - Consejos Heisenberg para conseguir Apps Windows 10 con 99% ...
Talks4Kids 2015 - Consejos Heisenberg para conseguir Apps Windows 10 con 99% ...Talks4Kids 2015 - Consejos Heisenberg para conseguir Apps Windows 10 con 99% ...
Talks4Kids 2015 - Consejos Heisenberg para conseguir Apps Windows 10 con 99% ...
 
Novedades de Xamarin 4
Novedades de Xamarin 4Novedades de Xamarin 4
Novedades de Xamarin 4
 
Universal Windows Platform Bridges
Universal Windows Platform BridgesUniversal Windows Platform Bridges
Universal Windows Platform Bridges
 

Destaque

Windows 8: Tips de diseño, contratos y tiles
Windows 8: Tips de diseño, contratos y tilesWindows 8: Tips de diseño, contratos y tiles
Windows 8: Tips de diseño, contratos y tilesSorey García
 
Windows 8: Empaquetamiento y publicación
Windows 8: Empaquetamiento y publicaciónWindows 8: Empaquetamiento y publicación
Windows 8: Empaquetamiento y publicaciónSorey García
 
Introducción a XAML y MVVM
Introducción a XAML y MVVMIntroducción a XAML y MVVM
Introducción a XAML y MVVMSorey García
 
Conociendo el ecosistema de Windows Phone 8 y Windows 8
Conociendo el ecosistema de Windows Phone 8 y Windows 8Conociendo el ecosistema de Windows Phone 8 y Windows 8
Conociendo el ecosistema de Windows Phone 8 y Windows 8Sorey García
 
Hands on Lab: Almacenamiento local con base de datos, launchers y choosers
Hands on Lab: Almacenamiento local con base de datos, launchers y choosersHands on Lab: Almacenamiento local con base de datos, launchers y choosers
Hands on Lab: Almacenamiento local con base de datos, launchers y choosersSorey García
 
Hands on Lab: Usando el servicio de localización y mapas de Bing
Hands on Lab: Usando el servicio de localización y mapas de BingHands on Lab: Usando el servicio de localización y mapas de Bing
Hands on Lab: Usando el servicio de localización y mapas de BingSorey García
 
Hands on Lab: Construyendo un lector RSS desde Visual Studio y Expression Blend
Hands on Lab: Construyendo un lector RSS desde Visual Studio y Expression BlendHands on Lab: Construyendo un lector RSS desde Visual Studio y Expression Blend
Hands on Lab: Construyendo un lector RSS desde Visual Studio y Expression BlendSorey García
 
#0 - Hackers & Developers Magazine
#0 - Hackers & Developers Magazine#0 - Hackers & Developers Magazine
#0 - Hackers & Developers MagazineSorey García
 
#1 - Hackers & Developers Magazine
#1 - Hackers & Developers Magazine#1 - Hackers & Developers Magazine
#1 - Hackers & Developers MagazineSorey García
 
Gestión de configuración con Github para Windows en las aulas de clase
Gestión de configuración con Github para Windows en las aulas de claseGestión de configuración con Github para Windows en las aulas de clase
Gestión de configuración con Github para Windows en las aulas de claseSorey García
 
Nuevos actores de la ingenieria de software
Nuevos actores de la ingenieria de softwareNuevos actores de la ingenieria de software
Nuevos actores de la ingenieria de softwareSorey García
 
Internet de las Cosas y Netduino
Internet de las Cosas y NetduinoInternet de las Cosas y Netduino
Internet de las Cosas y NetduinoSorey García
 
[Avanet] Fiesta del Libro y la Cultura Medellín
[Avanet] Fiesta del Libro y la Cultura Medellín[Avanet] Fiesta del Libro y la Cultura Medellín
[Avanet] Fiesta del Libro y la Cultura MedellínSorey García
 
Desconferencia BarCamp Medellín 2009 - Aplicaciones Móviles
Desconferencia BarCamp Medellín 2009 - Aplicaciones MóvilesDesconferencia BarCamp Medellín 2009 - Aplicaciones Móviles
Desconferencia BarCamp Medellín 2009 - Aplicaciones MóvilesSorey García
 
Barcamp cucuta 2010 - Aplicaciones Móviles
Barcamp cucuta 2010 - Aplicaciones MóvilesBarcamp cucuta 2010 - Aplicaciones Móviles
Barcamp cucuta 2010 - Aplicaciones MóvilesSorey García
 
Similitudes y deferencias en UX para Windows Phone y Windows
Similitudes y deferencias en UX para Windows Phone y WindowsSimilitudes y deferencias en UX para Windows Phone y Windows
Similitudes y deferencias en UX para Windows Phone y WindowsSorey García
 
Metro Style - Mobile Monday Medellín 2012
Metro Style - Mobile Monday Medellín 2012Metro Style - Mobile Monday Medellín 2012
Metro Style - Mobile Monday Medellín 2012Sorey García
 
Windows 8 - BarCamp Medellín
Windows 8 - BarCamp MedellínWindows 8 - BarCamp Medellín
Windows 8 - BarCamp MedellínSorey García
 

Destaque (20)

Windows 8: Tips de diseño, contratos y tiles
Windows 8: Tips de diseño, contratos y tilesWindows 8: Tips de diseño, contratos y tiles
Windows 8: Tips de diseño, contratos y tiles
 
Windows 8: Empaquetamiento y publicación
Windows 8: Empaquetamiento y publicaciónWindows 8: Empaquetamiento y publicación
Windows 8: Empaquetamiento y publicación
 
Introducción a XAML y MVVM
Introducción a XAML y MVVMIntroducción a XAML y MVVM
Introducción a XAML y MVVM
 
Conociendo el ecosistema de Windows Phone 8 y Windows 8
Conociendo el ecosistema de Windows Phone 8 y Windows 8Conociendo el ecosistema de Windows Phone 8 y Windows 8
Conociendo el ecosistema de Windows Phone 8 y Windows 8
 
El Liderazgo
El LiderazgoEl Liderazgo
El Liderazgo
 
Hands on Lab: Almacenamiento local con base de datos, launchers y choosers
Hands on Lab: Almacenamiento local con base de datos, launchers y choosersHands on Lab: Almacenamiento local con base de datos, launchers y choosers
Hands on Lab: Almacenamiento local con base de datos, launchers y choosers
 
Hands on Lab: Usando el servicio de localización y mapas de Bing
Hands on Lab: Usando el servicio de localización y mapas de BingHands on Lab: Usando el servicio de localización y mapas de Bing
Hands on Lab: Usando el servicio de localización y mapas de Bing
 
Hands on Lab: Construyendo un lector RSS desde Visual Studio y Expression Blend
Hands on Lab: Construyendo un lector RSS desde Visual Studio y Expression BlendHands on Lab: Construyendo un lector RSS desde Visual Studio y Expression Blend
Hands on Lab: Construyendo un lector RSS desde Visual Studio y Expression Blend
 
#0 - Hackers & Developers Magazine
#0 - Hackers & Developers Magazine#0 - Hackers & Developers Magazine
#0 - Hackers & Developers Magazine
 
#1 - Hackers & Developers Magazine
#1 - Hackers & Developers Magazine#1 - Hackers & Developers Magazine
#1 - Hackers & Developers Magazine
 
Gestión de configuración con Github para Windows en las aulas de clase
Gestión de configuración con Github para Windows en las aulas de claseGestión de configuración con Github para Windows en las aulas de clase
Gestión de configuración con Github para Windows en las aulas de clase
 
Nuevos actores de la ingenieria de software
Nuevos actores de la ingenieria de softwareNuevos actores de la ingenieria de software
Nuevos actores de la ingenieria de software
 
Internet de las Cosas y Netduino
Internet de las Cosas y NetduinoInternet de las Cosas y Netduino
Internet de las Cosas y Netduino
 
[Avanet] Fiesta del Libro y la Cultura Medellín
[Avanet] Fiesta del Libro y la Cultura Medellín[Avanet] Fiesta del Libro y la Cultura Medellín
[Avanet] Fiesta del Libro y la Cultura Medellín
 
Desconferencia BarCamp Medellín 2009 - Aplicaciones Móviles
Desconferencia BarCamp Medellín 2009 - Aplicaciones MóvilesDesconferencia BarCamp Medellín 2009 - Aplicaciones Móviles
Desconferencia BarCamp Medellín 2009 - Aplicaciones Móviles
 
Barcamp cucuta 2010 - Aplicaciones Móviles
Barcamp cucuta 2010 - Aplicaciones MóvilesBarcamp cucuta 2010 - Aplicaciones Móviles
Barcamp cucuta 2010 - Aplicaciones Móviles
 
Similitudes y deferencias en UX para Windows Phone y Windows
Similitudes y deferencias en UX para Windows Phone y WindowsSimilitudes y deferencias en UX para Windows Phone y Windows
Similitudes y deferencias en UX para Windows Phone y Windows
 
Metro Style - Mobile Monday Medellín 2012
Metro Style - Mobile Monday Medellín 2012Metro Style - Mobile Monday Medellín 2012
Metro Style - Mobile Monday Medellín 2012
 
Windows 8 - BarCamp Medellín
Windows 8 - BarCamp MedellínWindows 8 - BarCamp Medellín
Windows 8 - BarCamp Medellín
 
Codies.Launch()
Codies.Launch()Codies.Launch()
Codies.Launch()
 

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

Programacion web-Lenguajes del lado del servidor
Programacion web-Lenguajes del lado del servidorProgramacion web-Lenguajes del lado del servidor
Programacion web-Lenguajes del lado del servidorJose Felix Moran Agusto
 
Programacion de aplicaciones Web con ASP.NET
Programacion de aplicaciones Web con ASP.NETProgramacion de aplicaciones Web con ASP.NET
Programacion de aplicaciones Web con ASP.NETJavier Roig
 
Diseño Web: Qué necesitamos para empezar?
Diseño Web: Qué necesitamos para empezar?Diseño Web: Qué necesitamos para empezar?
Diseño Web: Qué necesitamos para empezar?Karla Arosemena
 
Asp.net lendry Barrientos
Asp.net lendry BarrientosAsp.net lendry Barrientos
Asp.net lendry BarrientosLeandryDe
 
EQUIPO 2,2A PARTE DE REVISION DE TECNOLOGIAS WEB
EQUIPO 2,2A PARTE DE REVISION DE TECNOLOGIAS WEBEQUIPO 2,2A PARTE DE REVISION DE TECNOLOGIAS WEB
EQUIPO 2,2A PARTE DE REVISION DE TECNOLOGIAS WEBUNIV DE CIENCIAS Y ARTES
 
EQUIPO 2,2A PARTE DE REVISION DE TECNOLOGIAS WEB
EQUIPO 2,2A PARTE DE REVISION DE TECNOLOGIAS WEBEQUIPO 2,2A PARTE DE REVISION DE TECNOLOGIAS WEB
EQUIPO 2,2A PARTE DE REVISION DE TECNOLOGIAS WEBUNIV DE CIENCIAS Y ARTES
 
Arquitectura de la plataforma de desarrollo de windows phone 7
Arquitectura de la plataforma de desarrollo de windows phone 7Arquitectura de la plataforma de desarrollo de windows phone 7
Arquitectura de la plataforma de desarrollo de windows phone 7videos
 
Azure Storage, Cognitive Services y Xamarin - Tepic Nayarit
Azure Storage, Cognitive Services y Xamarin - Tepic NayaritAzure Storage, Cognitive Services y Xamarin - Tepic Nayarit
Azure Storage, Cognitive Services y Xamarin - Tepic Nayaritenriqueaguilar
 
CDI power point
CDI power pointCDI power point
CDI power pointertio
 
Trabajo cdi power point
Trabajo cdi power pointTrabajo cdi power point
Trabajo cdi power pointertio
 
Riglo
RigloRiglo
Rigloriglo
 
Castro
CastroCastro
Castroekaro
 

Semelhante a JSConfCo: Desarrollo de Aplicaciones para Windows Store con HTML5 y Javascript (20)

INVESTIGACION
INVESTIGACIONINVESTIGACION
INVESTIGACION
 
Programacion web-Lenguajes del lado del servidor
Programacion web-Lenguajes del lado del servidorProgramacion web-Lenguajes del lado del servidor
Programacion web-Lenguajes del lado del servidor
 
Programacion de aplicaciones Web con ASP.NET
Programacion de aplicaciones Web con ASP.NETProgramacion de aplicaciones Web con ASP.NET
Programacion de aplicaciones Web con ASP.NET
 
Diseño Web: Qué necesitamos para empezar?
Diseño Web: Qué necesitamos para empezar?Diseño Web: Qué necesitamos para empezar?
Diseño Web: Qué necesitamos para empezar?
 
Asp.net lendry Barrientos
Asp.net lendry BarrientosAsp.net lendry Barrientos
Asp.net lendry Barrientos
 
EQUIPO 2,2A PARTE DE LAS AGUILAS
EQUIPO 2,2A PARTE DE LAS AGUILASEQUIPO 2,2A PARTE DE LAS AGUILAS
EQUIPO 2,2A PARTE DE LAS AGUILAS
 
EQUIPO 2,2A PARTE DE REVISION DE TECNOLOGIAS WEB
EQUIPO 2,2A PARTE DE REVISION DE TECNOLOGIAS WEBEQUIPO 2,2A PARTE DE REVISION DE TECNOLOGIAS WEB
EQUIPO 2,2A PARTE DE REVISION DE TECNOLOGIAS WEB
 
EQUIPO 2,2A PARTE DE REVISION DE TECNOLOGIAS WEB
EQUIPO 2,2A PARTE DE REVISION DE TECNOLOGIAS WEBEQUIPO 2,2A PARTE DE REVISION DE TECNOLOGIAS WEB
EQUIPO 2,2A PARTE DE REVISION DE TECNOLOGIAS WEB
 
Arquitectura de la plataforma de desarrollo de windows phone 7
Arquitectura de la plataforma de desarrollo de windows phone 7Arquitectura de la plataforma de desarrollo de windows phone 7
Arquitectura de la plataforma de desarrollo de windows phone 7
 
Juegos html5
Juegos html5Juegos html5
Juegos html5
 
Azure Storage, Cognitive Services y Xamarin - Tepic Nayarit
Azure Storage, Cognitive Services y Xamarin - Tepic NayaritAzure Storage, Cognitive Services y Xamarin - Tepic Nayarit
Azure Storage, Cognitive Services y Xamarin - Tepic Nayarit
 
CDI power point
CDI power pointCDI power point
CDI power point
 
Trabajo cdi power point
Trabajo cdi power pointTrabajo cdi power point
Trabajo cdi power point
 
Riglo
RigloRiglo
Riglo
 
(25.03) RUN 09 - Sesiones Desarrollo - SI 2.0
(25.03) RUN 09 - Sesiones Desarrollo - SI 2.0(25.03) RUN 09 - Sesiones Desarrollo - SI 2.0
(25.03) RUN 09 - Sesiones Desarrollo - SI 2.0
 
Dreamweaver
DreamweaverDreamweaver
Dreamweaver
 
Dreamweaver
DreamweaverDreamweaver
Dreamweaver
 
Html5 para móviles
Html5 para móvilesHtml5 para móviles
Html5 para móviles
 
Castro
CastroCastro
Castro
 
Charla internet
Charla internetCharla internet
Charla internet
 

Mais de Sorey García

Mision inspiración para docentes
Mision inspiración para docentesMision inspiración para docentes
Mision inspiración para docentesSorey García
 
WIE: El poder de transformar al mundo con tecnología
WIE: El poder de transformar al mundo con tecnologíaWIE: El poder de transformar al mundo con tecnología
WIE: El poder de transformar al mundo con tecnologíaSorey García
 
Misión: Inspiración
Misión: InspiraciónMisión: Inspiración
Misión: InspiraciónSorey García
 
MVP Open Day - Best Practices/Experiences
MVP Open Day - Best Practices/Experiences MVP Open Day - Best Practices/Experiences
MVP Open Day - Best Practices/Experiences Sorey García
 
Sensibilización en Metodologías Ágiles
Sensibilización en Metodologías ÁgilesSensibilización en Metodologías Ágiles
Sensibilización en Metodologías ÁgilesSorey García
 
Gestión de conocimiento
Gestión de conocimientoGestión de conocimiento
Gestión de conocimientoSorey García
 

Mais de Sorey García (7)

Mision inspiración para docentes
Mision inspiración para docentesMision inspiración para docentes
Mision inspiración para docentes
 
WIE: El poder de transformar al mundo con tecnología
WIE: El poder de transformar al mundo con tecnologíaWIE: El poder de transformar al mundo con tecnología
WIE: El poder de transformar al mundo con tecnología
 
Misión: Inspiración
Misión: InspiraciónMisión: Inspiración
Misión: Inspiración
 
MVP Open Day - Best Practices/Experiences
MVP Open Day - Best Practices/Experiences MVP Open Day - Best Practices/Experiences
MVP Open Day - Best Practices/Experiences
 
Sensibilización en Metodologías Ágiles
Sensibilización en Metodologías ÁgilesSensibilización en Metodologías Ágiles
Sensibilización en Metodologías Ágiles
 
Gestión de conocimiento
Gestión de conocimientoGestión de conocimiento
Gestión de conocimiento
 
Introducción a UML
Introducción a UMLIntroducción a UML
Introducción a UML
 

Último

Crear un recurso multimedia. Maricela_Ponce_DomingoM1S3AI6-1.pptx
Crear un recurso multimedia. Maricela_Ponce_DomingoM1S3AI6-1.pptxCrear un recurso multimedia. Maricela_Ponce_DomingoM1S3AI6-1.pptx
Crear un recurso multimedia. Maricela_Ponce_DomingoM1S3AI6-1.pptxNombre Apellidos
 
definicion segun autores de matemáticas educativa
definicion segun autores de matemáticas  educativadefinicion segun autores de matemáticas  educativa
definicion segun autores de matemáticas educativaAdrianaMartnez618894
 
tics en la vida cotidiana prepa en linea modulo 1.pptx
tics en la vida cotidiana prepa en linea modulo 1.pptxtics en la vida cotidiana prepa en linea modulo 1.pptx
tics en la vida cotidiana prepa en linea modulo 1.pptxazmysanros90
 
dokumen.tips_36274588-sistema-heui-eui.ppt
dokumen.tips_36274588-sistema-heui-eui.pptdokumen.tips_36274588-sistema-heui-eui.ppt
dokumen.tips_36274588-sistema-heui-eui.pptMiguelAtencio10
 
GonzalezGonzalez_Karina_M1S3AI6... .pptx
GonzalezGonzalez_Karina_M1S3AI6... .pptxGonzalezGonzalez_Karina_M1S3AI6... .pptx
GonzalezGonzalez_Karina_M1S3AI6... .pptx241523733
 
Plan Sarmiento - Netbook del GCBA 2019..
Plan Sarmiento - Netbook del GCBA 2019..Plan Sarmiento - Netbook del GCBA 2019..
Plan Sarmiento - Netbook del GCBA 2019..RobertoGumucio2
 
Medidas de formas, coeficiente de asimetría y coeficiente de curtosis.pptx
Medidas de formas, coeficiente de asimetría y coeficiente de curtosis.pptxMedidas de formas, coeficiente de asimetría y coeficiente de curtosis.pptx
Medidas de formas, coeficiente de asimetría y coeficiente de curtosis.pptxaylincamaho
 
Google-Meet-como-herramienta-para-realizar-reuniones-virtuales.pptx
Google-Meet-como-herramienta-para-realizar-reuniones-virtuales.pptxGoogle-Meet-como-herramienta-para-realizar-reuniones-virtuales.pptx
Google-Meet-como-herramienta-para-realizar-reuniones-virtuales.pptxAlexander López
 
PARTES DE UN OSCILOSCOPIO ANALOGICO .pdf
PARTES DE UN OSCILOSCOPIO ANALOGICO .pdfPARTES DE UN OSCILOSCOPIO ANALOGICO .pdf
PARTES DE UN OSCILOSCOPIO ANALOGICO .pdfSergioMendoza354770
 
R1600G CAT Variables de cargadores en mina
R1600G CAT Variables de cargadores en minaR1600G CAT Variables de cargadores en mina
R1600G CAT Variables de cargadores en minaarkananubis
 
Segunda ley de la termodinámica TERMODINAMICA.pptx
Segunda ley de la termodinámica TERMODINAMICA.pptxSegunda ley de la termodinámica TERMODINAMICA.pptx
Segunda ley de la termodinámica TERMODINAMICA.pptxMariaBurgos55
 
El uso delas tic en la vida cotidiana MFEL
El uso delas tic en la vida cotidiana MFELEl uso delas tic en la vida cotidiana MFEL
El uso delas tic en la vida cotidiana MFELmaryfer27m
 
Actividad integradora 6 CREAR UN RECURSO MULTIMEDIA
Actividad integradora 6    CREAR UN RECURSO MULTIMEDIAActividad integradora 6    CREAR UN RECURSO MULTIMEDIA
Actividad integradora 6 CREAR UN RECURSO MULTIMEDIA241531640
 
La era de la educación digital y sus desafios
La era de la educación digital y sus desafiosLa era de la educación digital y sus desafios
La era de la educación digital y sus desafiosFundación YOD YOD
 
Mapa-conceptual-del-Origen-del-Universo-3.pptx
Mapa-conceptual-del-Origen-del-Universo-3.pptxMapa-conceptual-del-Origen-del-Universo-3.pptx
Mapa-conceptual-del-Origen-del-Universo-3.pptxMidwarHenryLOZAFLORE
 
Presentación inteligencia artificial en la actualidad
Presentación inteligencia artificial en la actualidadPresentación inteligencia artificial en la actualidad
Presentación inteligencia artificial en la actualidadMiguelAngelVillanuev48
 
LAS_TIC_COMO_HERRAMIENTAS_EN_LA_INVESTIGACIÓN.pptx
LAS_TIC_COMO_HERRAMIENTAS_EN_LA_INVESTIGACIÓN.pptxLAS_TIC_COMO_HERRAMIENTAS_EN_LA_INVESTIGACIÓN.pptx
LAS_TIC_COMO_HERRAMIENTAS_EN_LA_INVESTIGACIÓN.pptxAlexander López
 
Arenas Camacho-Practica tarea Sesión 12.pptx
Arenas Camacho-Practica tarea Sesión 12.pptxArenas Camacho-Practica tarea Sesión 12.pptx
Arenas Camacho-Practica tarea Sesión 12.pptxJOSEFERNANDOARENASCA
 
El uso de las TIC's en la vida cotidiana.
El uso de las TIC's en la vida cotidiana.El uso de las TIC's en la vida cotidiana.
El uso de las TIC's en la vida cotidiana.241514949
 
Hernandez_Hernandez_Practica web de la sesion 11.pptx
Hernandez_Hernandez_Practica web de la sesion 11.pptxHernandez_Hernandez_Practica web de la sesion 11.pptx
Hernandez_Hernandez_Practica web de la sesion 11.pptxJOSEMANUELHERNANDEZH11
 

Último (20)

Crear un recurso multimedia. Maricela_Ponce_DomingoM1S3AI6-1.pptx
Crear un recurso multimedia. Maricela_Ponce_DomingoM1S3AI6-1.pptxCrear un recurso multimedia. Maricela_Ponce_DomingoM1S3AI6-1.pptx
Crear un recurso multimedia. Maricela_Ponce_DomingoM1S3AI6-1.pptx
 
definicion segun autores de matemáticas educativa
definicion segun autores de matemáticas  educativadefinicion segun autores de matemáticas  educativa
definicion segun autores de matemáticas educativa
 
tics en la vida cotidiana prepa en linea modulo 1.pptx
tics en la vida cotidiana prepa en linea modulo 1.pptxtics en la vida cotidiana prepa en linea modulo 1.pptx
tics en la vida cotidiana prepa en linea modulo 1.pptx
 
dokumen.tips_36274588-sistema-heui-eui.ppt
dokumen.tips_36274588-sistema-heui-eui.pptdokumen.tips_36274588-sistema-heui-eui.ppt
dokumen.tips_36274588-sistema-heui-eui.ppt
 
GonzalezGonzalez_Karina_M1S3AI6... .pptx
GonzalezGonzalez_Karina_M1S3AI6... .pptxGonzalezGonzalez_Karina_M1S3AI6... .pptx
GonzalezGonzalez_Karina_M1S3AI6... .pptx
 
Plan Sarmiento - Netbook del GCBA 2019..
Plan Sarmiento - Netbook del GCBA 2019..Plan Sarmiento - Netbook del GCBA 2019..
Plan Sarmiento - Netbook del GCBA 2019..
 
Medidas de formas, coeficiente de asimetría y coeficiente de curtosis.pptx
Medidas de formas, coeficiente de asimetría y coeficiente de curtosis.pptxMedidas de formas, coeficiente de asimetría y coeficiente de curtosis.pptx
Medidas de formas, coeficiente de asimetría y coeficiente de curtosis.pptx
 
Google-Meet-como-herramienta-para-realizar-reuniones-virtuales.pptx
Google-Meet-como-herramienta-para-realizar-reuniones-virtuales.pptxGoogle-Meet-como-herramienta-para-realizar-reuniones-virtuales.pptx
Google-Meet-como-herramienta-para-realizar-reuniones-virtuales.pptx
 
PARTES DE UN OSCILOSCOPIO ANALOGICO .pdf
PARTES DE UN OSCILOSCOPIO ANALOGICO .pdfPARTES DE UN OSCILOSCOPIO ANALOGICO .pdf
PARTES DE UN OSCILOSCOPIO ANALOGICO .pdf
 
R1600G CAT Variables de cargadores en mina
R1600G CAT Variables de cargadores en minaR1600G CAT Variables de cargadores en mina
R1600G CAT Variables de cargadores en mina
 
Segunda ley de la termodinámica TERMODINAMICA.pptx
Segunda ley de la termodinámica TERMODINAMICA.pptxSegunda ley de la termodinámica TERMODINAMICA.pptx
Segunda ley de la termodinámica TERMODINAMICA.pptx
 
El uso delas tic en la vida cotidiana MFEL
El uso delas tic en la vida cotidiana MFELEl uso delas tic en la vida cotidiana MFEL
El uso delas tic en la vida cotidiana MFEL
 
Actividad integradora 6 CREAR UN RECURSO MULTIMEDIA
Actividad integradora 6    CREAR UN RECURSO MULTIMEDIAActividad integradora 6    CREAR UN RECURSO MULTIMEDIA
Actividad integradora 6 CREAR UN RECURSO MULTIMEDIA
 
La era de la educación digital y sus desafios
La era de la educación digital y sus desafiosLa era de la educación digital y sus desafios
La era de la educación digital y sus desafios
 
Mapa-conceptual-del-Origen-del-Universo-3.pptx
Mapa-conceptual-del-Origen-del-Universo-3.pptxMapa-conceptual-del-Origen-del-Universo-3.pptx
Mapa-conceptual-del-Origen-del-Universo-3.pptx
 
Presentación inteligencia artificial en la actualidad
Presentación inteligencia artificial en la actualidadPresentación inteligencia artificial en la actualidad
Presentación inteligencia artificial en la actualidad
 
LAS_TIC_COMO_HERRAMIENTAS_EN_LA_INVESTIGACIÓN.pptx
LAS_TIC_COMO_HERRAMIENTAS_EN_LA_INVESTIGACIÓN.pptxLAS_TIC_COMO_HERRAMIENTAS_EN_LA_INVESTIGACIÓN.pptx
LAS_TIC_COMO_HERRAMIENTAS_EN_LA_INVESTIGACIÓN.pptx
 
Arenas Camacho-Practica tarea Sesión 12.pptx
Arenas Camacho-Practica tarea Sesión 12.pptxArenas Camacho-Practica tarea Sesión 12.pptx
Arenas Camacho-Practica tarea Sesión 12.pptx
 
El uso de las TIC's en la vida cotidiana.
El uso de las TIC's en la vida cotidiana.El uso de las TIC's en la vida cotidiana.
El uso de las TIC's en la vida cotidiana.
 
Hernandez_Hernandez_Practica web de la sesion 11.pptx
Hernandez_Hernandez_Practica web de la sesion 11.pptxHernandez_Hernandez_Practica web de la sesion 11.pptx
Hernandez_Hernandez_Practica web de la sesion 11.pptx
 

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

  • 2.
  • 3.
  • 4.
  • 5.
  • 6. Escuela de Arte Bahaus - Simplicidad
  • 7. Swiss Style – Experiencias comunes
  • 8. Kinetic typography – Movimiento / Tipografía
  • 9.
  • 10.
  • 11.
  • 12.
  • 13.
  • 14.
  • 15.
  • 16.
  • 17.
  • 18.
  • 19. 11.6” 1366x768 30” 2560x1600 20” 1920x1080 13” 1400x1050 10” 1024x768
  • 20.
  • 21.
  • 22.
  • 23.
  • 24.
  • 25.
  • 26.
  • 28.
  • 29.
  • 30.
  • 31.
  • 32.
  • 33.
  • 34.
  • 35.
  • 36.
  • 37.
  • 38.
  • 39.
  • 40.
  • 41.
  • 42.
  • 43.
  • 44.
  • 45.
  • 46.
  • 47.
  • 48.
  • 49.
  • 50.
  • 51.
  • 52.
  • 53.
  • 54.
  • 55.
  • 56.
  • 57.
  • 59.
  • 60.
  • 61.
  • 62.
  • 63. Diferencias de uso HTML Web y HTML Nativo Internet Explorer TAB HTML Host Process App Code Web Platform App Code Web Platform App Container Windows Runtime
  • 66. Running app HTML App Host Process App Code Web Platform App Container Windows Runtime
  • 67. Running app HTML App Host Process App Code Web Platform App Container Windows Runtime
  • 69.
  • 71. Accessibility Data binding Live tiles and toast Input Controls HTML5/CSS XAML Portable Geolocation Direct3D Direct2D Direct Write Local storage SMS Skydrive Sensors Proximity Playback Capture PlayTo Streams Background transfer Bing Canvas SVG Syndication Networking Azure Mobile XML and JSON Contracts Xbox Live Printing Application services Threading/timers Memory management Globalization Cryptography Authentication
  • 72. Accessibility Data binding Live tiles and toast Input Controls HTML5/CSS XAML Portable Geolocation Direct3D Direct2D Direct Write Local storage SMS Skydrive Sensors Proximity Playback Capture PlayTo Streams Background transfer Bing Canvas SVG Syndication Networking Azure Mobile XML and JSON Contracts Xbox Live Printing Application services Threading/timers Memory management Globalization Cryptography Authentication
  • 73. Accessibility Data binding Live tiles and toast Input Controls HTML5/CSS XAML Speech synthesis Portable Geolocation Point of service Direct3D Direct2D Direct Write Local storage SMS HTTP Skydrive Sensors Proximity USB Playback Capture PlayTo Streams Background transfer Contacts Bing HID WiFi direct Bluetooth Canvas SVG WebGL Syndication Networking Appointments Azure Mobile Printing 3D printing Scanning XML and JSON Contracts PDF Xbox Live Application services Threading/timers Memory management Globalization Cryptography Authentication Diagnostics
  • 74.
  • 75.
  • 76.
  • 77.
  • 78.
  • 79. 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 Not supported. og window.showModeless Dialog Not supported. xhr.responseBody 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. Not supported. http://msdn.microsoft.com/enus/library/windows/apps/hh700404.aspx
  • 80.
  • 81. // 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/eses/library/windows/apps/br230269.aspx
  • 82.
  • 83.
  • 84.
  • 85.
  • 86.
  • 87.
  • 88. 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.
  • 89.
  • 90.
  • 91.
  • 92.
  • 93.
  • 94.
  • 95.
  • 96.
  • 97. Local context ms-appx:/// Trusted content from local package Web context ms-appx-web:/// http:// http:// Untrusted content from web or must interact with such
  • 98.
  • 99. @media /* } @media /* } (min-width: 500px) and (max-width: 1023px) { CSS styles to change layout based on window width */ (min-width: 1024px) { CSS styles to change layout based on window width */
  • 100.
  • 102. Windows Store iOS Android Windows Phone 8 iOS Android HTML 5/JS SDKs ServerSide Scripts & Scheduler
  • 103.
  • 104.  Además de miles de tutoriales y todo el contenido en MSDN, se encuentra este eBook gratuito que puede ser descargado en Mobi, EPUB, PDF y desde la tienda de Amazon Gratis. http://blogs.msdn.com/b/microsoft_p ress/archive/2012/10/29/free-ebookprogramming-windows-8-apps-withhtml-css-and-javascript.aspx

Notas do Editor

  1. Devices fodder:A recent survey found that in 88% of companies, employees were using their own technology at work. (Avanade, 2012)Information workers “report using an average of 4 consumer devices and multiple third-party applications, such as social networking sites, in the course of their day.” (Unisys/IDC)The technology adoption curves for the enterprise are being re-written by the usersServices fodder:Any interesting client experience these days has a service on the back end – even gamesCloud compute usage, across the industry, is doubling every 6 months. (MSFT – azure insights/internal)Cloud spending will reach $60B in 2012, growing at 26% (IDC) – roughly 4x the rate of growth for IT overallOver 80% of new apps will be distributed/deployed on clouds (IDC)
  2. Use the default stylesheetto get the styling in a pre-defined type ramp with the Segoe UI font A Typographic ramp is used to establish a sense of hierarchy for the content.Only a fixed set of sizes (4) to convey hierarchical information – and each level is proportionally larger than the previous (42pt = 80px, 20pt = 40px). The proportions allow users to really easily establish an understanding of the structure of the content. Beyond this size granularity, users will not be able to differentiate where a piece of content fits within the overall hierarchy
  3. HeaderSubheaderBody copyItem titleItem subtitleItem body