Nesta palestra, eu apresentei informações de como usar os seus conhecimentos de desenvolvimento Web para construir apps para publicação na nova Windows Store do Windows 8 usando HTML5, CSS3 e JavaScript. Eu abordei os seguintes tópicos: Windows Cliente: Evolução Windows 8 Microsoft Surface Demo – Windows 8 Windows Store apps Linguagens suportadas Windows Runtime (WinRT) Ferramentas Licença de desenvolvedor Demo – Licença Projetos JavaScript Demo – Projeto JavaScript Links úteis

1. 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
Globalcode – Open4education

2. Agenda
Windows Cliente: Evolução
Windows 8
Microsoft Surface
Demo – Windows 8
Globalcode – Open4education

3. Agenda
Windows Store apps
Linguagens suportadas
Windows Runtime (WinRT)
Ferramentas
Licença de desenvolvedor
Demo – Licença
Projetos JavaScript
Demo – Projeto JavaScript
Links úteis
Globalcode – Open4education

4. Windows Cliente: Evolução
Nov 1993 Windows 3.2
Ago 1993 Windows 3.11
Abr 1992 Windows 3.1
Mai 1990 Windows 3.0
Mai 1988 Windows 2.1
Dez 1987 Windows 2.0
Nov 1985 Windows 1.0
Globalcode – Open4education

5. Windows Cliente: Evolução
Jan 2007 Windows Vista
Out 2001 Windows XP
Set 2000 Windows Me
Fev 2000 Windows 2000 Professional
Abr 1999 Windows 98 SE
Jun 1998 Windows 98
Ago 1995 Windows 95
Globalcode – Open4education

6. Windows Cliente: Evolução
26 Out 2012 Windows 8
Jul 2009 Windows 7
Globalcode – Open4education

7. Windows 8
Nova versão do Windows para dispositivos clientes
Desktop
Notebook, netbook e ultrabook
Tablet
Home Theater PC (HTPC) ou Media Center
Globalcode – Open4education

8. 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
Globalcode – Open4education

9. Windows 8
Globalcode – Open4education

10. Windows 8
Nova tela iniciar
Substitui o menu iniciar
(Windows 95 até Windows 7)
Globalcode – Open4education

11. 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
Globalcode – Open4education

12. Windows 8
Internet Explorer 10
Aplicativo desktop
Windows Store app
Integração com o Adobe Flash Player
Suporte melhorado a HTML5, CSS3 e JavaScript
Globalcode – Open4education

13. Windows 8
Loja introduzida no Windows 8: Windows Store
Permite a venda de Windows Store apps pelo mundo
Globalcode – Open4education

14. 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
Globalcode – Open4education

15. Microsoft Surface
O tablet da Microsoft
Globalcode – Open4education

16. Microsoft Surface
Windows RT Surface Windows 8 Pro Surface
SO: Windows RT SO: Windows 8 Pro
Massa: 676 g Massa: 903 g
Espessura: 9,3 mm Espessura: 13,5 mm
Tela: 10,6” HD Tela: 10,6” Full HD
Conexões: microSD, USB 2.0, Conexões: microSDXC, USB
micro HD Video, antena 2x2 3.0, micro DisplayPort Video,
MIMO antena 2x2 MIMO
Produtividade: Office Home & Produtividade: Office Home &
Student 2013 RT Student 2013 RT
Capas: Touch Cover, Type Capas e caneta: Touch
Cover Cover, Type Cover, Caneta
Capacidade: 32 GB, 64 GB Capacidade: 64 GB, 128 GB
Globalcode – Open4education

17. Microsoft Surface
Globalcode – Open4education

18. Demo - Windows 8
Globalcode – Open4education

19. 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
Globalcode – Open4education

20. Windows Store apps
Uma janela simples que ocupa a tela inteira
Suporte a diferentes layouts e visualizações
Globalcode – Open4education

21. 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
Globalcode – Open4education

22. 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
Globalcode – Open4education

23. Windows Store apps
Apps usam quadros ao invés de ícones
Apps podem apresentar
conteúdo no seu quadro
Quadros vivos (live tiles)
Globalcode – Open4education

24. 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
Globalcode – Open4education

25. 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
Globalcode – Open4education

26. 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)
Globalcode – Open4education

27. Licença de desenvolvedor
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
Globalcode – Open4education

28. Licença de desenvolvedor
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
Globalcode – Open4education

29. Demo – Licença
Globalcode – Open4education

30. Projetos JavaScript
Modelos de projetos JavaScript para Windows
Store apps
Blank App
Grid App
Split App
Fixed Layout App
Navigation App
Globalcode – Open4education

31. 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
Globalcode – Open4education

32. JavaScript Blank App
Globalcode – Open4education

33. 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
Globalcode – Open4education

34. JavaScript Grid App
Globalcode – Open4education

35. 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
Globalcode – Open4education

36. Demo – Projeto JavaScript
Globalcode – Open4education

37. 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/
Globalcode – Open4education