Nadando em Dinheiro com jQuery

2,242 views

Published on

Palestra dada no 1º Workshop PHP-ES, ocorrido no dia 30 de Maio de 2009, na UVV

Published in: Technology
0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
2,242
On SlideShare
0
From Embeds
0
Number of Embeds
67
Actions
Shares
0
Downloads
55
Comments
0
Likes
1
Embeds 0
No embeds

No notes for slide

Nadando em Dinheiro com jQuery

  1. 1. Nadando em Dinheiro com AJAX e jQuery
  2. 2. $('#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
  3. 3. 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!
  4. 4. Regras 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...
  5. 5. AJAX ● 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
  6. 6. AJAX como Arquitetura
  7. 7. Então... ● AJAX N-A-O-~ é ● AJAX É ● Time de futebol ● Paradigma ● Produto de limpeza ● Arquitetura ● Linguagem de ● Técnica programação ● JavaScript + CSS + DOM ● DHTML, JavaScript ou Scripting outra “coisa pra fazer ● Maior Interação site” ● Menos tempo para ● jQuery, Prototype.js, resposta Ext.js, Mootools
  8. 8. 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
  9. 9. 2007 2008
  10. 10. 2009
  11. 11. 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
  12. 12. ● ASP.NET AJAX (VS 2008 e VS 2010) ● Nokia Web-Run-Time ● Diversos livros (até um em português) “Eu sou jQuery!” Paris Hilton
  13. 13. Contando Vantagem http://is.gd/sQCx
  14. 14. Estado atual ● jQuery 1.3 ● Performance ● Sizzle (engine seletor) ● Delegação de Eventos
  15. 15. Tem que ter o DOM DOM – 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.
  16. 16. <html> <head> <title>My title</title> </head> <body> <a href=”link.html”>My link</a> <h1>My header</h1> </body> </html>
  17. 17. Let's Rock 'n Roll
  18. 18. Quem quer dinheiro? $ = jQuery ● jQuery( seletor [, contexto] ) ● jQuery( html ) ● jQuery( fn ) ● jQuery( objeto ) Todas retornam um objeto jQuery!
  19. 19. “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/)
  20. 20. Estudo de Caso Mozilla Addons https://addons.mozilla.org/pt-BR/firefox/
  21. 21. $('#reinaldo').trigger('Obrigado') (Eu prefiro NADAR em Dinheiro!)
  22. 22. … OU $('#auditorio') .find('.ouvintes') .filter(':dormindo').trigger('acorda').end() .filter(':acordado').find(':not(.boiando)') .trigger('aplausos').each(function(){ $('#reinaldo').agradece(this); });
  23. 23. Any Questions? Reinaldo Junior reinaldojunior.net/palestras (www) @ReinaldoJunior (twitter)

×