Nadando em Dinheiro com jQuery
-
Upload
reinaldo-junior -
Category
Technology
-
view
1.793 -
download
0
description
Transcript of Nadando em Dinheiro com jQuery
Nadando em Nadando em Dinheiro com Dinheiro com
AJAX e jQueryAJAX e jQuery
$('#reinaldo-junior')$('#reinaldo-junior')
● ~7 anos no PHP
● Fundador do phpBB.com.br (atual Suporte phpBB)
● Desenvolvimento e Treinamento
● Palestrante em eventos capixabas de Software Livre
● Entusiasta WEB
O que vamos fazer hoje Cérebro?O que vamos fazer hoje Cérebro?
● Apresentar jQuery
● DOM Scripting
● AJAX
● Hijax
● Técnicas e Boas práticas
● PHP (sim, eu sei onde estou)
● … e Dominar o Mundo!
Regras do JogoRegras do Jogo
● Tem uma Pergunta Rápida?● Pergunte na hora
● Tem uma Pergunta Demorada?● Pergunte depois (no intervalo, por email, etc)
● Está boiando (Tem uma Pergunta Idiota)?● Fique quieto, preste atenção e aprenda
● Não gostou das piadas?● Espera a palestra do Leonardo...
AJAXAJAX
● Apresentação baseada em padrões (XHTML/CSS)
● Exibição e interação dinâmicas (DOM)
● Troca e manipulação de dados (XML/XSLT/JSON)
● Recuperação de dados assíncrona (XMLHttpRequest)
● e JavaScript ligando tudo junto!
Jesse James Garrett,“Ajax: A New Approach to Web Applications” Fev/2005
AJAX como Arquitetura
Então...Então...
● AJAX N-A-O-~ é● Time de futebol● Produto de limpeza● Linguagem de
programação● DHTML, JavaScript ou
outra “coisa pra fazer site”
● jQuery, Prototype.js, Ext.js, Mootools
● AJAX É● Paradigma● Arquitetura● Técnica● JavaScript + CSS + DOM
Scripting● Maior Interação● Menos tempo para
resposta
j-What?j-What?
jQuery é uma biblioteca com foco na interação entre JavaScript e HTML.
Lançada em 2006 por John Resig, evangelista de JavaScript da Mozilla
“jQuery é projetada para mudar a maneira que você escreve JavaScript.”
jQuery.com
20082007
2009
Porque jQuery?Porque jQuery?
● Facilidade e Popularidade
● Comunidade e Plugins
● Filosofia “Write Less, Do More”
● Chaining (Wikipedia, Method Chaining)
● DSL (Domain Specific Language)
● “DOM Oriented-Programming” e JavaScript Não-Obtrusivo
● Free e OpenSource
● ASP.NET AJAX (VS 2008 e VS 2010)
● Nokia Web-Run-Time
● Diversos livros (até um em português)
“Eu sou jQuery!”Paris Hilton
Contando VantagemContando Vantagem
http://is.gd/sQCx
Estado atualEstado atual
● jQuery 1.3
● Sizzle (engine seletor)
● Performance
● Delegação de Eventos
Tem que ter o DOMTem que ter o DOMDOM – Modelo de Objetos de Documentos
Padrão e API para consultar, navegar e manipular elementos de um documento.
Toda a biblioteca é orientada ao DOM.
O propósito principal é fornecer uma maneira fácil para separar “comportamento” do conteúdo.
Para isso, jQuery fornece uma API para o DOM intuitiva e cross-browser.
<html>
<head>
<title>My title</title>
</head>
<body>
<a href=”link.html”>My link</a>
<h1>My header</h1>
</body>
</html>
Let's Rock 'n RollLet's Rock 'n Roll
Quem quer dinheiro?Quem quer dinheiro?
$ = jQuery
● jQuery( seletor [, contexto] )
● jQuery( html )
● jQuery( fn )
● jQuery( objeto )
Todas retornam um objeto jQuery!
““Workshopping”Workshopping”
● O que?● Demonstrar um framework simples para uso de AJAX
com PHP para fornecer melhoria progressiva com degradação graciosa
● Como?● Utilizar AJAX no CRUD● Utilizar AJAX na paginação● Adicionar validação (utilizando um plugin)● Hijax (http://domscripting.com/presentations/xtech2006/)
Estudo de CasoEstudo de Caso
Mozilla Addonshttps://addons.mozilla.org/pt-BR/firefox/
$('#reinaldo').trigger('Obrigado')$('#reinaldo').trigger('Obrigado')
(Eu prefiro NADAR em Dinheiro!)
… … OUOU
$('#auditorio').find('.ouvintes')
.filter(':dormindo').trigger('acorda').end()
.filter(':acordado').find(':not(.boiando)').trigger('aplausos').each(function(){
$('#reinaldo').agradece(this);});
Any Questions?Any Questions?
Reinaldo Juniorreinaldojunior.net/palestras (www)
@ReinaldoJunior (twitter)