TDC 2012 Goiânia: Trilha Windows Phone / Windows 8 - Desenvolvimento de apps para Windows Store do Windows 8 com HTML5, CSS3 e JavaScript

Globalcode – Open4education

Desenvolvimento de apps para Windows Store

do Windows 8 com HTML5, CSS3 e JavaScript

Trilha Windows Phone / Windows 8

Rogério Moraes de Carvalho

VITA Informática

@rogeriomc

rogeriomc.wordpress.com

http://twitter.com/rogeriomc

http://twitter.com/rogeriomc

http://rogeriomc.wordpress.com/


Agenda

Windows Cliente: Evolução

Windows 8

Microsoft Surface

Demo – Windows 8


Agenda

Windows Store apps

Linguagens suportadas

Windows Runtime (WinRT)

Ferramentas

Licença de desenvolvedor

Demo – Licença

Projetos JavaScript

Demo – Projeto JavaScript

Links úteis



Nov 1985 Windows 1.0

Dez 1987 Windows 2.0

Mai 1988 Windows 2.1

Mai 1990 Windows 3.0

Abr 1992 Windows 3.1

Ago 1993 Windows 3.11

Nov 1993 Windows 3.2



Ago 1995 Windows 95

Jun 1998 Windows 98

Abr 1999 Windows 98 SE

Fev 2000 Windows 2000 Professional

Set 2000 Windows Me

Out 2001 Windows XP

Jan 2007 Windows Vista



Jul 2009 Windows 7

26 Out 2012 Windows 8


Windows 8

Nova versão do Windows para dispositivos clientes

Desktop

Notebook, netbook e ultrabook

Tablet

Home Theater PC (HTPC) ou Media Center


Windows 8

Introdução de uma nova interface

Baseada na linguagem de estilo de design da Microsoft

Codinome da linguagem: estilo Metro

A nova interface evoluiu em diferentes produtos

1995: Microsoft Encarta 95 (Enciclopédia multimídia digital)

1996: MSN 2.0 (The Microsoft Network – Sites e serviços da Microsoft)

2001: Windows Media Center (Windows XP Media Center Edition)

2006: Zune (Tocador de mídias digitais portátil)

2007: Windows Media Center (Windows Vista Home Premium / Ultimate)

2008: Xbox 360 – Atualização do dashboard (New Xbox Experience)

2009: Windows Media Center (Windows 7, exceto Starter e Home Basic)

2010: Windows Phone 7

2012: Windows Phone 8 & Windows 8


Windows 8


Windows 8

Nova tela iniciar

Substitui o menu iniciar (Windows 95 até Windows 7)


Windows 8

Nova plataforma de apps: Windows Store apps

Otimizadas para dispositivos touchscreen

Executadas em tela cheia ou presas num lado da tela

Permitem notificações e quadros vivos na tela iniciar

Integram busca e compartilhamento com outras apps

Distribuídas primariamente pela Windows Store

Suporte mantido a aplicativos desktop tradicionais

Windows Explorer renomeado para File Explorer

Ribbon similar a do Office 2007/2010

Gerenciador de tarefas melhorado


Windows 8

Internet Explorer 10

Aplicativo desktop

Windows Store app

Integração com o Adobe Flash Player

Suporte melhorado a HTML5, CSS3 e JavaScript


Windows 8

Loja introduzida no Windows 8: Windows Store

Permite a venda de Windows Store apps pelo mundo


Windows 8

Quatro edições do Windows 8

Windows 8

Windows 8 Pro

Recursos adicionais

Windows 8 Enterprise

Recursos adicionais para ambientes corporativos

Disponível somente em licenciamento por volume

Windows RT

Pré-instalado em dispositivos baseados na arquitetura ARM

Windows Media Center

Disponível como add-on para compra no Windows 8 Pro


Microsoft Surface

O tablet da Microsoft


Microsoft Surface

Windows RT Surface

SO: Windows RT

Massa: 676 g

Espessura: 9,3 mm

Tela: 10,6” HD

Conexões: microSD, USB 2.0,

micro HD Video, antena 2x2

MIMO

Produtividade: Office Home &

Student 2013 RT

Capas: Touch Cover, Type

Cover

Capacidade: 32 GB, 64 GB

Windows 8 Pro Surface

SO: Windows 8 Pro

Massa: 903 g

Espessura: 13,5 mm

Tela: 10,6” Full HD

Conexões: microSDXC, USB

3.0, micro DisplayPort Video,

antena 2x2 MIMO

Produtividade: Office Home &

Student 2013 RT

Capas e caneta: Touch

Cover, Type Cover, Caneta

Capacidade: 64 GB, 128 GB


Microsoft Surface

Recursos/SurfaceByMicrosoft_1080p.mp4


Demo - Windows 8


Windows Store apps

Novo tipo de aplicação introduzida no Windows 8

Novo visual e comportamento

Roda numa variedade de

dispositivos

Desktops

Notebooks, netbooks e ultrabooks

Tablets

Vendidas pela Windows Store

Loja virtual da Microsoft introduzida no Windows 8


Windows Store apps

Uma janela simples que ocupa a tela inteira

Suporte a diferentes layouts e visualizações


Windows Store apps

Suporte a múltiplos dispositivos de entrada

Touchscreen

Caneta

Mouse

Teclado

Apps podem comunicar entre si

Contratos para procurar e compartilhar entre apps


Windows Store apps

Nova interface com o usuário

e novos controles

A app bar

Navegação

Comandos

Ferramentas

A charms

Busca

Compartilhamento

Iniciar

Dispositivos

Configurações


Windows Store apps

Apps usam quadros ao invés de ícones

Apps podem apresentar

conteúdo no seu quadro

Quadros vivos (live tiles)


Linguagens suportadas

Desenvolvimento de Windows Store apps

HTML5, CSS3 e JavaScript

XAML com C# / Visual Basic / C++

DirectX com C++

Sistema operacional suportado

Windows 8

Sistemas operacionais não suportados

Windows 7

Windows Server 2012


Windows Runtime (WinRT)

Novo conjunto de APIs: Windows Runtime (WinRT)

Suporta nativamente arquiteturas x86 e ARM

Não gerenciado, diferente do .NET Framework

Roda em um ambiente de sandbox

Ambiente controlado para fornecer segurança e estabilidade

Aplicativos desenvolvidos usando WinRT

Windows Store apps


Ferramentas

Windows 8

Windows Store apps rodam apenas no Windows 8

Existe uma versão de avaliação para desenvolvedores

Windows 8 Enterprise 32-bit / 64-bit (avaliação de 90 dias)

Ferramentas de desenvolvimento

Visual Studio Express 2012 for Windows 8

Codificação, depuração, localização,

empacotamento e distribuição de Windows Store apps

Inclui o Blend for Microsoft Visual Studio 2012

Ferramenta de autoria visual de interfaces XAML e HTML5/CSS3

Windows 8 Software Development Kit (SDK)



A licença de desenvolvedor do Windows 8 permite:

instalar,

desenvolver,

testar e

avaliar Windows Store apps

Preço da licença de desenvolvedor do Windows 8

Gratuita e associada com uma conta da Microsoft

A conta na Windows Store tem preço anual de $99.00

Windows Store apps precisam ser certificadas

Apps devem ser aprovadas pela Microsoft para serem

aceitas na Windows Store



Visual Studio 2012 (qualquer edição comercial)

PROJECT > Store > Acquire Developer License...

Visual Studio Express 2012 for Windows 8

STORE > Acquire Developer License...

Windows PowerShell

Show-WindowsDeveloperLicenseRegistration

Get-WindowsDeveloperLicense ExpirationTime IsValid

-------------- -------

11/01/2013 22:45:00 True

Unregister-WindowsDeveloperLicense


Demo – Licença


Projetos JavaScript

Modelos de projetos JavaScript para Windows

Store apps

Blank App

Grid App

Split App

Fixed Layout App

Navigation App


JavaScript Blank App

Templates > JavaScript > Windows Store

Blank App

Projeto mínimo de Windows Store app JavaScript que compila e

executa

Não tem controles de interface com o usuário e nem dados


JavaScript Blank App


JavaScript Grid App

Templates > JavaScript > Windows Store

Grid App

Projeto baseado em três páginas

Página principal com uma lista de grupos em grade

Página com detalhes de um grupo selecionado na página principal

Página com detalhes de um item selecionado dentro de um grupo


JavaScript Grid App


Projeto JS Grid App

Projeto JavaScript – Grid App

Baseado em três páginas

Página principal com uma lista de grupos em grade

Página com detalhes de um grupo selecionado na página

principal

Página com detalhes de um item selecionado dentro de um

grupo


Demo – Projeto JavaScript


Links úteis

MSDN Evaluation Center

Windows 8 evaluation for developers

Visual Studio Express 2012

http://msdn.microsoft.com/express

Desenvolvimento de Windows Store apps

Webcasts gratuitos em português brasileiro (Apps 4 Win)

Post no blog do MVP Lead do Brasil JP Clementi

Assista aos webcasts gratuitos e publique sua Windows App!

Building Windows 8 (Blog oficial da Microsoft sobre Windows 8)

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

http://msdn.microsoft.com/en-US/evalcenter/jj554510.aspx?wt.mc_id=MEC_132_1_4

http://msdn.microsoft.com/express

http://blogs.msdn.com/b/jpclementi/archive/2012/10/10/assista-aos-webcasts-gratuitos-e-publique-sua-windows-app.aspx





Technology

TDC 2012 Goiânia: Trilha Windows Phone / Windows 8 - Desenvolvimento de apps para Windows Store do Windows 8 com HTML5, CSS3 e JavaScript