jQuery: Introdução e Plugins matadores

jQuery Introdução e Plugins matadores

Vamos falar sobre 1. Conceitos básicos (HTML, JavaScript, CSS e
DOM) 2. Diferença entre server-side e client-side 3. jQuery: Apresentação, Instalação e ‘Hello World’ 4. Highcharts e DataTables 5. Compilação de plugins

HTML “HTML é uma linguagem para descrever páginas web” –
W3CSchools

JavaScript “É uma linguagem para web, servidores, PCs, laptops, tablets,
smart phones, e mais.” – W3CSchools

CSS “Deﬁne como os elementos HTML devem ser exibidos.” –
W3CSchools

DOM “Deﬁne um padrão de acesso e manipulação de documentos
HTML.” – W3CSchools

Server-side “O código é primeiramente executado no servidor e então
os dados são enviados para o navegador do usuário.” – PHP website

Client-side “Deﬁne o comportamento do navegador, sendo assim, o código
é executado pelo próprio navegador.” – W3CSchools

jQuery simpliﬁca a programação JavaScript é uma biblioteca JavaScript é
muito fácil de aprender

Instalação 1. Faça o download em http://jquery.com 2. Crie um
arquivo HTML 3. Adicione a referência ao arquivo jquery.js <!DOCTYPE html> <html> <head> <script src="jquery.js"></script> </head> <body> </body> </html>

Hello World com jQuery <!DOCTYPE html> <html> <head> <script src="jquery.js"></script>
</head> <body> <script> $(document).ready(function(){ alert('Olá mundo com jQuery'); }); </script> </body> </html>

jQuery vs DOM Scripting <!DOCTYPE html> <html> <head></head> <body> <script>
function addLoadEvent(func) { var oldonload = window.onload; if (typeof window.onload != 'function') { window.onload = func; } else { window.onload = function() { oldonload(); func(); } } } function mensagem(){ alert('Ola mundo sem jQuery'); } addLoadEvent(mensagem); </script> </body> </html> <!DOCTYPE html> <html> <head> <script src="jquery.js"></script> </head> <body> <script> $(document).ready(function(){ alert('Olá mundo com jQuery'); }); </script> </body> </html>

Highcharts

DataTables

Web Forms, Typography, Time-Savers and Images Text, Tables, List and
Useful Development Tools http://coding.smashingmagazine.com/2012/09/23/useful-javascript-libraries-jquery-plugins-web-developers/ http://coding.smashingmagazine.com/useful-javascript-libraries-jquery-plugins-part-2/

Obrigado!

jQuery: Introdução e Plugins matadores

jQuery: Introdução e Plugins matadores

Bruno Freitas

More Decks by Bruno Freitas

Other Decks in Programming

Featured

Transcript