![Page 1: Como fazer mais em aplicações RIA escrevendo menos](https://reader035.vdocuments.pub/reader035/viewer/2022062319/55615610d8b42a780d8b531f/html5/thumbnails/1.jpg)
Como fazer (+) em Aplicações RIA escrevendo
(-)
Jaydson Gomes & Felipe Nascimento
![Page 2: Como fazer mais em aplicações RIA escrevendo menos](https://reader035.vdocuments.pub/reader035/viewer/2022062319/55615610d8b42a780d8b531f/html5/thumbnails/2.jpg)
Apresentação
Felipe Nascimento
Entusiasta Javascript e PHP
Graduando Faculdade Senac
Analista Desenvolvedor na Agiplan Serviços Financeiros
@felipenmoura
http://felipenascimento.org
![Page 3: Como fazer mais em aplicações RIA escrevendo menos](https://reader035.vdocuments.pub/reader035/viewer/2022062319/55615610d8b42a780d8b531f/html5/thumbnails/3.jpg)
Formado pela Faculdade Senac em 2008
4 anos na FGV
Empresa atual Ag2
Entusiasta em Javascript e em tecnologias livres
Apresentação
Jaydson Gomes
@jaydson
http://jaydson.org
![Page 4: Como fazer mais em aplicações RIA escrevendo menos](https://reader035.vdocuments.pub/reader035/viewer/2022062319/55615610d8b42a780d8b531f/html5/thumbnails/4.jpg)
O que é o jQuery?
jQuery === Javascript
![Page 5: Como fazer mais em aplicações RIA escrevendo menos](https://reader035.vdocuments.pub/reader035/viewer/2022062319/55615610d8b42a780d8b531f/html5/thumbnails/5.jpg)
O que é o jQuery?
Uma biblioteca Javascript open-sourceque simplifica a interação entre o HTMLe o Javascript
![Page 6: Como fazer mais em aplicações RIA escrevendo menos](https://reader035.vdocuments.pub/reader035/viewer/2022062319/55615610d8b42a780d8b531f/html5/thumbnails/6.jpg)
Origem• Biblioteca getElementsBySelector de Simon Willison
![Page 7: Como fazer mais em aplicações RIA escrevendo menos](https://reader035.vdocuments.pub/reader035/viewer/2022062319/55615610d8b42a780d8b531f/html5/thumbnails/7.jpg)
Origem• Biblioteca CSSQuery de Dean Edwards
![Page 8: Como fazer mais em aplicações RIA escrevendo menos](https://reader035.vdocuments.pub/reader035/viewer/2022062319/55615610d8b42a780d8b531f/html5/thumbnails/8.jpg)
Origem• Biblioteca Prototype
![Page 9: Como fazer mais em aplicações RIA escrevendo menos](https://reader035.vdocuments.pub/reader035/viewer/2022062319/55615610d8b42a780d8b531f/html5/thumbnails/9.jpg)
Origem• Biblioteca moo.fx
![Page 10: Como fazer mais em aplicações RIA escrevendo menos](https://reader035.vdocuments.pub/reader035/viewer/2022062319/55615610d8b42a780d8b531f/html5/thumbnails/10.jpg)
Histórico
• Inicio em Agosto de 2005 (http://ejohn.org/blog/selectors-in-javascript)• Primeiro Release em Janeiro de 2006• Alpha Release da versão 1.0 em Junho de 2006• Anuncio do jQuery UI em Julho de 2007• 3° aniversário e versão 1.3 lançada em janeiro de 2009
• Novembro de 2009
![Page 11: Como fazer mais em aplicações RIA escrevendo menos](https://reader035.vdocuments.pub/reader035/viewer/2022062319/55615610d8b42a780d8b531f/html5/thumbnails/11.jpg)
Frameworks / Bibliotecas
![Page 12: Como fazer mais em aplicações RIA escrevendo menos](https://reader035.vdocuments.pub/reader035/viewer/2022062319/55615610d8b42a780d8b531f/html5/thumbnails/12.jpg)
Porque usar jQuery?
![Page 13: Como fazer mais em aplicações RIA escrevendo menos](https://reader035.vdocuments.pub/reader035/viewer/2022062319/55615610d8b42a780d8b531f/html5/thumbnails/13.jpg)
Porque usar jQuery?
42%
Maio 2009
![Page 14: Como fazer mais em aplicações RIA escrevendo menos](https://reader035.vdocuments.pub/reader035/viewer/2022062319/55615610d8b42a780d8b531f/html5/thumbnails/14.jpg)
The jQuery Team at the 2009 jQuery Conference
Profissionais qualificados envolvidos no core da
biblioteca
Porque usar jQuery?
![Page 15: Como fazer mais em aplicações RIA escrevendo menos](https://reader035.vdocuments.pub/reader035/viewer/2022062319/55615610d8b42a780d8b531f/html5/thumbnails/15.jpg)
Ariel FleslerGame Developer
John ResigJavaScript Tool Developer
at Mozilla Corporation
Brandon AaronSenior Technologist
at NokiaJorn Zaefferer
Consultant at maxence integration technologies
Porque usar jQuery?
![Page 16: Como fazer mais em aplicações RIA escrevendo menos](https://reader035.vdocuments.pub/reader035/viewer/2022062319/55615610d8b42a780d8b531f/html5/thumbnails/16.jpg)
Selectors
![Page 17: Como fazer mais em aplicações RIA escrevendo menos](https://reader035.vdocuments.pub/reader035/viewer/2022062319/55615610d8b42a780d8b531f/html5/thumbnails/17.jpg)
Selectors
![Page 18: Como fazer mais em aplicações RIA escrevendo menos](https://reader035.vdocuments.pub/reader035/viewer/2022062319/55615610d8b42a780d8b531f/html5/thumbnails/18.jpg)
Selectors
![Page 20: Como fazer mais em aplicações RIA escrevendo menos](https://reader035.vdocuments.pub/reader035/viewer/2022062319/55615610d8b42a780d8b531f/html5/thumbnails/20.jpg)
Traversing
![Page 23: Como fazer mais em aplicações RIA escrevendo menos](https://reader035.vdocuments.pub/reader035/viewer/2022062319/55615610d8b42a780d8b531f/html5/thumbnails/23.jpg)
Events
bind - Adiciona um ou mais Event-Handler para o elemento
unbind - Remove um ou mais Event-Handler para o elemento
trigger - É um gatilho para um evento
one - Mesmo que bind mas será executado apenas uma vez
live - Mesmo que bind mas para elementos futuros *
http://docs.jquery.com/Events
![Page 25: Como fazer mais em aplicações RIA escrevendo menos](https://reader035.vdocuments.pub/reader035/viewer/2022062319/55615610d8b42a780d8b531f/html5/thumbnails/25.jpg)
PluginsSão bibliotecas/extensões para o jQuery que fornecem novas funcionalidades ae ou ferramentas para os desenvolvedores.
• Thickbox • Form plugin (with AJAX) • Validation • Treeview • Tabs • Tablesorter
![Page 26: Como fazer mais em aplicações RIA escrevendo menos](https://reader035.vdocuments.pub/reader035/viewer/2022062319/55615610d8b42a780d8b531f/html5/thumbnails/26.jpg)
O que é RIA?
![Page 27: Como fazer mais em aplicações RIA escrevendo menos](https://reader035.vdocuments.pub/reader035/viewer/2022062319/55615610d8b42a780d8b531f/html5/thumbnails/27.jpg)
O que é RIA?
• É a revolução das aplicações Web
![Page 28: Como fazer mais em aplicações RIA escrevendo menos](https://reader035.vdocuments.pub/reader035/viewer/2022062319/55615610d8b42a780d8b531f/html5/thumbnails/28.jpg)
RIA é mais um passo no processo evolutivo da internet
É o uso da Internet e das tecnologias disponíveis para criar uma experiência mais intuitiva e eficientepara o usuário
RIA é a combinação da interatividade e funcionalidades do Desktop com a abrangência e flexibilidade da Web
O que é RIA?
![Page 29: Como fazer mais em aplicações RIA escrevendo menos](https://reader035.vdocuments.pub/reader035/viewer/2022062319/55615610d8b42a780d8b531f/html5/thumbnails/29.jpg)
Aplicações
![Page 30: Como fazer mais em aplicações RIA escrevendo menos](https://reader035.vdocuments.pub/reader035/viewer/2022062319/55615610d8b42a780d8b531f/html5/thumbnails/30.jpg)
Elementos de uma aplicação RIA
Ajax
JSON
Biblioteca Javascript
![Page 31: Como fazer mais em aplicações RIA escrevendo menos](https://reader035.vdocuments.pub/reader035/viewer/2022062319/55615610d8b42a780d8b531f/html5/thumbnails/31.jpg)
Asynchronous Javascript And XML
Premissa: Requisições são feitas do cliente ao servidor mesmo após a página ter sido completamente carregada.
Ajax não é somente um novo modelo, é também uma iniciativa na construção deaplicações Web mais dinâmicas e criativas.
Ajax também não é uma tecnologia, são várias tecnologias conhecidas trabalhando juntas, oferecendo novas funcionalidades.
Ajax permite ao desenvolvedor criar interações adicionais aomodelo tradicional.
Ajax
![Page 32: Como fazer mais em aplicações RIA escrevendo menos](https://reader035.vdocuments.pub/reader035/viewer/2022062319/55615610d8b42a780d8b531f/html5/thumbnails/32.jpg)
JSON é uma alternativa para XML, ele também exerce omesmo papel que o XML como formato para transporte de dados.
É uma formatação leve de troca de dados.Para seres humanos, é fácil de ler e escrever. Para máquinas, é fácil de interpretar e gerar.
JSON
![Page 33: Como fazer mais em aplicações RIA escrevendo menos](https://reader035.vdocuments.pub/reader035/viewer/2022062319/55615610d8b42a780d8b531f/html5/thumbnails/33.jpg)
Estudo de casoExemplos do uso de jQuery
jQuery Desktop
http://desktop.sonspring.com/
![Page 34: Como fazer mais em aplicações RIA escrevendo menos](https://reader035.vdocuments.pub/reader035/viewer/2022062319/55615610d8b42a780d8b531f/html5/thumbnails/34.jpg)
Estudo de casoExemplos do uso de jQuery
http://www.3site.eu/examples/liquid/
Liquid Effect
![Page 35: Como fazer mais em aplicações RIA escrevendo menos](https://reader035.vdocuments.pub/reader035/viewer/2022062319/55615610d8b42a780d8b531f/html5/thumbnails/35.jpg)
Estudo de casoExemplos do uso de jQuery
•http://www.jquery.info/scripts/jFlip/demo.html
jFlip
![Page 36: Como fazer mais em aplicações RIA escrevendo menos](https://reader035.vdocuments.pub/reader035/viewer/2022062319/55615610d8b42a780d8b531f/html5/thumbnails/36.jpg)
Estudo de casoExemplos do uso de jQuery
http://www.nicolarizzo.com/gamesroom/flip.html
Efeito Flip
![Page 37: Como fazer mais em aplicações RIA escrevendo menos](https://reader035.vdocuments.pub/reader035/viewer/2022062319/55615610d8b42a780d8b531f/html5/thumbnails/37.jpg)
Estudo de casoExemplos do uso de jQuery
http://robot.anthonycalzadilla.com/
![Page 39: Como fazer mais em aplicações RIA escrevendo menos](https://reader035.vdocuments.pub/reader035/viewer/2022062319/55615610d8b42a780d8b531f/html5/thumbnails/39.jpg)
Livros
![Page 40: Como fazer mais em aplicações RIA escrevendo menos](https://reader035.vdocuments.pub/reader035/viewer/2022062319/55615610d8b42a780d8b531f/html5/thumbnails/40.jpg)
•Popularidade jQueryhttp://www.kylehayes.info/2009/03/29/survey-results-javascript-frameworks/
Links e Referências
•A pure-JavaScript CSS selector enginehttp://sizzlejs.com/
•jQuery 1.3 Performancehttp://docs.jquery.com/Release:jQuery_1.3#Performance
•Construindo uma Biblioteca Javascripthttp://www.slideshare.net/jeresig/building-a-javascript-library
•Historia do jQuery by John 2007http://www.slideshare.net/jeresig/history-of-jquery
![Page 41: Como fazer mais em aplicações RIA escrevendo menos](https://reader035.vdocuments.pub/reader035/viewer/2022062319/55615610d8b42a780d8b531f/html5/thumbnails/41.jpg)
Links e Referências
•Palestra by Marc Grabanski 2009http://www.slideshare.net/1Marc/jquery-essentials
•getElementsBySelector(Inspiração para o jQuery)http://simonwillison.net/2003/Mar/25/getElementsBySelector/
•CSSQuery(Inspiração para o jQuery) by Dean Edwardshttp://dean.edwards.name/my/cssQuery/
•AddEvent(Inspiração para o jQuery) by Dean Edwardshttp://dean.edwards.name/weblog/2005/10/add-event/
•Primeira implementação do jQuery by John Resighttp://ejohn.org/apps/jselect/selector.js
![Page 42: Como fazer mais em aplicações RIA escrevendo menos](https://reader035.vdocuments.pub/reader035/viewer/2022062319/55615610d8b42a780d8b531f/html5/thumbnails/42.jpg)
•Post que deu origem ao jQuery - Blog do Johnhttp://ejohn.org/blog/selectors-in-javascript/
Links e Referências
•Histórico do jQueryhttp://docs.jquery.com/History_of_jQuery
•RichBlocks - Framework RIAhttp://jaydson.org/docs/richblocks.pdf
•Show case de sites q usam jQueryhttp://usejquery.com/
•Why use jQueryhttp://www.javascriptkata.com/2007/05/29/3-reasons-why-i-use-jquery/
![Page 43: Como fazer mais em aplicações RIA escrevendo menos](https://reader035.vdocuments.pub/reader035/viewer/2022062319/55615610d8b42a780d8b531f/html5/thumbnails/43.jpg)
Obrigado!