Como fazer (+) em Aplicações RIA escrevendo

(-)

Jaydson Gomes & Felipe Nascimento

Apresentação

Felipe Nascimento

Entusiasta Javascript e PHP

Graduando Faculdade Senac

Analista Desenvolvedor na Agiplan Serviços Financeiros

felipenmoura@gmail.com

@felipenmoura

http://felipenascimento.org

Formado pela Faculdade Senac em 2008

4 anos na FGV

Empresa atual Ag2

Entusiasta em Javascript e em tecnologias livres

Apresentação

Jaydson Gomes

jayalemao@gmail.com

@jaydson

http://jaydson.org

O que é o jQuery?

jQuery === Javascript

O que é o jQuery?

Uma biblioteca Javascript open-sourceque simplifica a interação entre o HTMLe o Javascript

Origem• Biblioteca getElementsBySelector de Simon Willison

Origem• Biblioteca CSSQuery de Dean Edwards

Origem• Biblioteca Prototype

Origem• Biblioteca moo.fx

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

Frameworks / Bibliotecas

Porque usar jQuery?

Porque usar jQuery?

42%

Maio 2009

The jQuery Team at the 2009 jQuery Conference

Profissionais qualificados envolvidos no core da

biblioteca

Porque usar jQuery?

Ariel FleslerGame Developer

John ResigJavaScript Tool Developer

at Mozilla Corporation

Brandon AaronSenior Technologist

at NokiaJorn Zaefferer

Consultant at maxence integration technologies

Porque usar jQuery?

Selectors

Selectors

Selectors

Selectors

http://docs.jquery.com/Selectors

Traversing

Traversing

http://docs.jquery.com/Traversing

Manipulation

http://docs.jquery.com/Manipulation

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

Ajax

http://docs.jquery.com/Ajax

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

O que é RIA?

O que é RIA?

• É a revolução das aplicações Web

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?

Aplicações

Elementos de uma aplicação RIA

Ajax

JSON

Biblioteca Javascript

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

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

Estudo de casoExemplos do uso de jQuery

jQuery Desktop

http://desktop.sonspring.com/

Estudo de casoExemplos do uso de jQuery

http://www.3site.eu/examples/liquid/

Liquid Effect

Estudo de casoExemplos do uso de jQuery

•http://www.jquery.info/scripts/jFlip/demo.html

jFlip

Estudo de casoExemplos do uso de jQuery

http://www.nicolarizzo.com/gamesroom/flip.html

Efeito Flip

Estudo de casoExemplos do uso de jQuery

http://robot.anthonycalzadilla.com/

Como aprender Javascript / jQuery

http://docs.jquery.com/Main_Page

Livros

•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

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

•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/

Obrigado!