SlideShare une entreprise Scribd logo
1  sur  29
Télécharger pour lire hors ligne
HTML5 & JavaScript
= App Mobile
HTML5 & JavaScript
= App Mobile
Velocidade
Produtividade
Legibilidade
E
Q
uem
Sou
Eu?
Miller Augusto
#JavaScript
#J2EE
#HTML5
#DOM3
#MySQL
#CSS3
Tópicos Abordados
- HTML5
- dataset
- localStorage
- sessionStorage
- prototype
- registerElement
O HTML5 de cada Dia!
- HTML + novas tags
- CSS3
- JavaScript / DOM3
HTML + novas tags
O delimitador: <!DOCTYPE HTML>
https://developer.mozilla.org/pt-BR/docs/HTML/HTML5/HTML5_element_list
E o que mais...
DATASET
prototype
Os Datasets:
DOMStringMap {fone: "12345", name: "Maria"}
Um pouco ++++...
Um pouco ++++...
prototype
(-) prototype
(+) prototype
X
<> prototype
X
<> prototype
MÉTODOS SÃO
DUPLICADOS E NÃO
PODEM SER
REAPROVEITADOS.
PROTOTYPE SÃO
ESTÁTICOS E PODEM
SER REAPROVEITADOS,
OCUPANDO UMA SÓ
POSIÇÃO DE MEMÓRIA.
Herança .
Herança ..
Herança ...
Coisa de Louco!
Sinta a força que
existe no prototype !
Coisa de Louco!
Calma aí, Controller ?!?!?
Mais isto é um MVC completo
meu pai?
*&%#$ PQP *&%#$
localStorage // sessionStorage
<> CASO REAL
Exemplo de caso de uso documentado no
Developer Mozilla
eveloperM
ozilla
.'. E porque não ir mais além?
Object.create(HTMLElement.prototype)
Vamos criar nossos
próprios elementos
HTML5 usando uma
interface de prototype!
Que tal uma biblioteca
WWVale?
Preparação do prototype
Utilizamos a interface HTMLElement
HTML5 +
CSS3 +
DOM3 +
Metas(format-detection, handheldfriendly & viewport) =
Mobile APP
Final Feliz!!!
HTML5 + CSS3 + DOM3 +
Metas(format-detection, handheldfriendly &
viewport) = Mobile APP
http://clevercode.com.br/
miller@clevercode.com.br
+MillerAugusto

Contenu connexe

En vedette

Tudo começou no clube das insónias
Tudo começou no clube das insóniasTudo começou no clube das insónias
Tudo começou no clube das insóniasHelder Carvalho
 
Unidad i financiera
Unidad i financieraUnidad i financiera
Unidad i financieraProf. Prof.
 
Samsung - Câmera Digital - PL120 - 14.2 Megapixels - Duplo LCD - LCD Frontal ...
Samsung - Câmera Digital - PL120 - 14.2 Megapixels - Duplo LCD - LCD Frontal ...Samsung - Câmera Digital - PL120 - 14.2 Megapixels - Duplo LCD - LCD Frontal ...
Samsung - Câmera Digital - PL120 - 14.2 Megapixels - Duplo LCD - LCD Frontal ...moriainformatica
 
Portando sua aplicação web para iphone
Portando sua aplicação web para iphonePortando sua aplicação web para iphone
Portando sua aplicação web para iphoneRenato Nitta
 
Enhancing Pilot Ability to Perform Continuous Descent Approach with Descript...
Enhancing Pilot Ability to Perform Continuous Descent Approach with  Descript...Enhancing Pilot Ability to Perform Continuous Descent Approach with  Descript...
Enhancing Pilot Ability to Perform Continuous Descent Approach with Descript...Michael LaMarr
 
Produkte und services für das corporate treasury
Produkte und services für das corporate treasuryProdukte und services für das corporate treasury
Produkte und services für das corporate treasuryfranck_brision
 
Rapport de l'UEFA sur les finances des clubs de football européens
Rapport de l'UEFA sur les finances des clubs de football européensRapport de l'UEFA sur les finances des clubs de football européens
Rapport de l'UEFA sur les finances des clubs de football européensjeremylepaulbinet
 
Analisando pacotes for fun and packet - Conceito de Network Security Monitori...
Analisando pacotes for fun and packet - Conceito de Network Security Monitori...Analisando pacotes for fun and packet - Conceito de Network Security Monitori...
Analisando pacotes for fun and packet - Conceito de Network Security Monitori...Rodrigo Montoro
 
Apresentaçaõ de redes atual
Apresentaçaõ de redes atualApresentaçaõ de redes atual
Apresentaçaõ de redes atualMilena Rebouças
 
Enhancing livelihoods of poor livestock keepers through increasing use of fod...
Enhancing livelihoods of poor livestock keepers through increasing use of fod...Enhancing livelihoods of poor livestock keepers through increasing use of fod...
Enhancing livelihoods of poor livestock keepers through increasing use of fod...ILRI
 

En vedette (13)

Tudo começou no clube das insónias
Tudo começou no clube das insóniasTudo começou no clube das insónias
Tudo começou no clube das insónias
 
Unidad i financiera
Unidad i financieraUnidad i financiera
Unidad i financiera
 
Samsung - Câmera Digital - PL120 - 14.2 Megapixels - Duplo LCD - LCD Frontal ...
Samsung - Câmera Digital - PL120 - 14.2 Megapixels - Duplo LCD - LCD Frontal ...Samsung - Câmera Digital - PL120 - 14.2 Megapixels - Duplo LCD - LCD Frontal ...
Samsung - Câmera Digital - PL120 - 14.2 Megapixels - Duplo LCD - LCD Frontal ...
 
Portando sua aplicação web para iphone
Portando sua aplicação web para iphonePortando sua aplicação web para iphone
Portando sua aplicação web para iphone
 
Enhancing Pilot Ability to Perform Continuous Descent Approach with Descript...
Enhancing Pilot Ability to Perform Continuous Descent Approach with  Descript...Enhancing Pilot Ability to Perform Continuous Descent Approach with  Descript...
Enhancing Pilot Ability to Perform Continuous Descent Approach with Descript...
 
Produkte und services für das corporate treasury
Produkte und services für das corporate treasuryProdukte und services für das corporate treasury
Produkte und services für das corporate treasury
 
Rapport de l'UEFA sur les finances des clubs de football européens
Rapport de l'UEFA sur les finances des clubs de football européensRapport de l'UEFA sur les finances des clubs de football européens
Rapport de l'UEFA sur les finances des clubs de football européens
 
Analisando pacotes for fun and packet - Conceito de Network Security Monitori...
Analisando pacotes for fun and packet - Conceito de Network Security Monitori...Analisando pacotes for fun and packet - Conceito de Network Security Monitori...
Analisando pacotes for fun and packet - Conceito de Network Security Monitori...
 
Apresentaçaõ de redes atual
Apresentaçaõ de redes atualApresentaçaõ de redes atual
Apresentaçaõ de redes atual
 
Nias oc 16 jan-5 february 2008
Nias oc 16 jan-5 february 2008Nias oc 16 jan-5 february 2008
Nias oc 16 jan-5 february 2008
 
Campos da serra catarinense
Campos da serra catarinenseCampos da serra catarinense
Campos da serra catarinense
 
Automatizando Nmap com NSE
Automatizando Nmap com NSEAutomatizando Nmap com NSE
Automatizando Nmap com NSE
 
Enhancing livelihoods of poor livestock keepers through increasing use of fod...
Enhancing livelihoods of poor livestock keepers through increasing use of fod...Enhancing livelihoods of poor livestock keepers through increasing use of fod...
Enhancing livelihoods of poor livestock keepers through increasing use of fod...
 

Similaire à Ppt ww vale

Minicurso Ajax - 5. Semana de Informática PUC Minas São Gabriel
Minicurso Ajax - 5. Semana de Informática PUC Minas São GabrielMinicurso Ajax - 5. Semana de Informática PUC Minas São Gabriel
Minicurso Ajax - 5. Semana de Informática PUC Minas São GabrielMarcelo Linhares
 
API's do HTML5 - Davidson Alencar - WebBR2013
API's do HTML5 - Davidson Alencar - WebBR2013API's do HTML5 - Davidson Alencar - WebBR2013
API's do HTML5 - Davidson Alencar - WebBR2013Davidson Alencar
 
Palestra / Efeitos Espetaculares Em Dhtml / SDD
Palestra / Efeitos Espetaculares Em Dhtml / SDDPalestra / Efeitos Espetaculares Em Dhtml / SDD
Palestra / Efeitos Espetaculares Em Dhtml / SDDhugodiasneto
 
Workshop: WebSockets com HTML 5 & PHP - Gustavo Ciello
Workshop: WebSockets com HTML 5 & PHP - Gustavo CielloWorkshop: WebSockets com HTML 5 & PHP - Gustavo Ciello
Workshop: WebSockets com HTML 5 & PHP - Gustavo CielloTchelinux
 
Tendências do Mercado de Internet
Tendências do Mercado de InternetTendências do Mercado de Internet
Tendências do Mercado de InternetVanessa Oliveira
 
Nadando em Dinheiro com jQuery
Nadando em Dinheiro com jQueryNadando em Dinheiro com jQuery
Nadando em Dinheiro com jQueryReinaldo Junior
 
O que você faz para ser Mobile? TDC2013
O que você faz para ser Mobile? TDC2013O que você faz para ser Mobile? TDC2013
O que você faz para ser Mobile? TDC2013Jackson F. de A. Mafra
 
Front-end ENGINEER
Front-end ENGINEERFront-end ENGINEER
Front-end ENGINEERIvan Banov
 
[JS EXPERIENCE 2018] Do jQuery aos microfrontends: os desafios de manter uma ...
[JS EXPERIENCE 2018] Do jQuery aos microfrontends: os desafios de manter uma ...[JS EXPERIENCE 2018] Do jQuery aos microfrontends: os desafios de manter uma ...
[JS EXPERIENCE 2018] Do jQuery aos microfrontends: os desafios de manter uma ...iMasters
 
HTML 5 A evolução do HTML 4 para o HTML 5
HTML 5 A evolução do HTML 4 para o HTML 5HTML 5 A evolução do HTML 4 para o HTML 5
HTML 5 A evolução do HTML 4 para o HTML 5ondazul
 

Similaire à Ppt ww vale (20)

Minicurso Ajax - 5. Semana de Informática PUC Minas São Gabriel
Minicurso Ajax - 5. Semana de Informática PUC Minas São GabrielMinicurso Ajax - 5. Semana de Informática PUC Minas São Gabriel
Minicurso Ajax - 5. Semana de Informática PUC Minas São Gabriel
 
HTML5
HTML5HTML5
HTML5
 
API's do HTML5 - Davidson Alencar - WebBR2013
API's do HTML5 - Davidson Alencar - WebBR2013API's do HTML5 - Davidson Alencar - WebBR2013
API's do HTML5 - Davidson Alencar - WebBR2013
 
Curso de HTML5 CSS3 e JS
Curso de HTML5 CSS3 e JSCurso de HTML5 CSS3 e JS
Curso de HTML5 CSS3 e JS
 
Palestra / Efeitos Espetaculares Em Dhtml / SDD
Palestra / Efeitos Espetaculares Em Dhtml / SDDPalestra / Efeitos Espetaculares Em Dhtml / SDD
Palestra / Efeitos Espetaculares Em Dhtml / SDD
 
Html5
Html5Html5
Html5
 
Front end - the right way
Front end - the right wayFront end - the right way
Front end - the right way
 
Workshop: WebSockets com HTML 5 & PHP - Gustavo Ciello
Workshop: WebSockets com HTML 5 & PHP - Gustavo CielloWorkshop: WebSockets com HTML 5 & PHP - Gustavo Ciello
Workshop: WebSockets com HTML 5 & PHP - Gustavo Ciello
 
Tendências do Mercado de Internet
Tendências do Mercado de InternetTendências do Mercado de Internet
Tendências do Mercado de Internet
 
Nadando em Dinheiro com jQuery
Nadando em Dinheiro com jQueryNadando em Dinheiro com jQuery
Nadando em Dinheiro com jQuery
 
Encet 2008-ajax java
Encet 2008-ajax javaEncet 2008-ajax java
Encet 2008-ajax java
 
Mashups: Criando Valor na Web 2.0
Mashups: Criando Valor na Web 2.0Mashups: Criando Valor na Web 2.0
Mashups: Criando Valor na Web 2.0
 
Mini Curso Mashup Coreu
Mini Curso Mashup CoreuMini Curso Mashup Coreu
Mini Curso Mashup Coreu
 
O que você faz para ser Mobile? TDC2013
O que você faz para ser Mobile? TDC2013O que você faz para ser Mobile? TDC2013
O que você faz para ser Mobile? TDC2013
 
Mashups: Criando Valor na Web 2.0 (BandTec)
Mashups: Criando Valor na Web 2.0 (BandTec)Mashups: Criando Valor na Web 2.0 (BandTec)
Mashups: Criando Valor na Web 2.0 (BandTec)
 
Html5 ass
Html5 assHtml5 ass
Html5 ass
 
Front-end ENGINEER
Front-end ENGINEERFront-end ENGINEER
Front-end ENGINEER
 
Introdução a: Frameworks front end web
Introdução a: Frameworks front end webIntrodução a: Frameworks front end web
Introdução a: Frameworks front end web
 
[JS EXPERIENCE 2018] Do jQuery aos microfrontends: os desafios de manter uma ...
[JS EXPERIENCE 2018] Do jQuery aos microfrontends: os desafios de manter uma ...[JS EXPERIENCE 2018] Do jQuery aos microfrontends: os desafios de manter uma ...
[JS EXPERIENCE 2018] Do jQuery aos microfrontends: os desafios de manter uma ...
 
HTML 5 A evolução do HTML 4 para o HTML 5
HTML 5 A evolução do HTML 4 para o HTML 5HTML 5 A evolução do HTML 4 para o HTML 5
HTML 5 A evolução do HTML 4 para o HTML 5
 

Ppt ww vale