Aula 4. bibliotecas js

•

0 gostou•279 visualizações

A

- O documento discute bibliotecas JavaScript e frameworks para desenvolvimento web, apresentado pelo professor André Costa - Apresenta jQuery como uma biblioteca JavaScript que aumenta a produtividade ao disponibilizar funções para manipulação de elementos, eventos, estilos e animações - Descreve uma atividade prática para aplicar os conceitos apresentados em sala de aula

Bibliotecas JS
Frameworks para Desenvolvimento Web
Prof. MSc. André Costa - andre.costa@unifacs.br

SUMÁRIO
• Bibliotecas JS
• jQuery
• Atividade Prática
Frameworks para Desenvolvimento Web – Porf. MSc. André Costa

Bibliotecas JS
• Conjunto de funções JS disponíveis para o utilização do desenvolvedor
• Maior produtividade em relação ao JS padrão
• Disponibilidade de Plug-ins baseados na Biblioteca
• Cross Browser
Frameworks para Desenvolvimento Web – Porf. MSc. André Costa

Bibliotecas JS
Frameworks para Desenvolvimento Web – Porf. MSc. André Costa

Bibliotecas JS
Frameworks para Desenvolvimento Web – Porf. MSc. André Costa

Bibliotecas JS
Frameworks para Desenvolvimento Web – Porf. MSc. André Costa

Bibliotecas JS
Frameworks para Desenvolvimento Web – Porf. MSc. André Costa

jQuery
CDN
Frameworks para Desenvolvimento Web – Porf. MSc. André Costa

jQuery
Ready
Frameworks para Desenvolvimento Web – Porf. MSc. André Costa

jQuery
Console (JS)
Frameworks para Desenvolvimento Web – Porf. MSc. André Costa

jQuery
Seletor (igual ao CSS)
• Seletor compatível com CSS3, mesmo que o Browser não dê suporte
Frameworks para Desenvolvimento Web – Porf. MSc. André Costa

jQuery
Capturar Eventos
Frameworks para Desenvolvimento Web – Porf. MSc. André Costa

jQuery
Manipular Atributos
Frameworks para Desenvolvimento Web – Porf. MSc. André Costa

jQuery
Manipular CSS
Frameworks para Desenvolvimento Web – Porf. MSc. André Costa

jQuery
Manipular Valores
Frameworks para Desenvolvimento Web – Porf. MSc. André Costa

jQuery
Manipular HTML
Frameworks para Desenvolvimento Web – Porf. MSc. André Costa

jQuery
Loop para Arrays
Frameworks para Desenvolvimento Web – Porf. MSc. André Costa

jQuery
Efeitos
Frameworks para Desenvolvimento Web – Porf. MSc. André Costa

jQuery
Ajax
Frameworks para Desenvolvimento Web – Porf. MSc. André Costa

jQuery
jQuery UI
Frameworks para Desenvolvimento Web – Porf. MSc. André Costa

Atividade Prática
Descrição do trabalho em sala..
Frameworks para Desenvolvimento Web – Porf. MSc. André Costa

Prof. MSc. André Costa
andre.costa@unifacs.br

Mais conteúdo relacionado

Mais procurados

Abordagens modernas no desenvolvimento web

Abordagens modernas no desenvolvimento web

Abordagens modernas no desenvolvimento webWemerson Januario

Introdução ao Native Script

Introdução ao Native Script

Introdução ao Native ScriptAndre Baltieri

Introdução ao Web Design: Aula 1 - Imersão ao Web Design

Introdução ao Web Design: Aula 1 - Imersão ao Web Design

Introdução ao Web Design: Aula 1 - Imersão ao Web DesignGustavo Zimmermann

CoffeeScript Aula 01 Introdução a CoffeeScript

CoffeeScript Aula 01 Introdução a CoffeeScript

CoffeeScript Aula 01 Introdução a CoffeeScriptWelington Sampaio

Design para WordPress- Anyssa Ferreira - WordCamp BH 2015

Design para WordPress- Anyssa Ferreira - WordCamp BH 2015

Design para WordPress- Anyssa Ferreira - WordCamp BH 2015Anyssa Ferreira

O Papel do desenvolvedor Front End

O Papel do desenvolvedor Front End

O Papel do desenvolvedor Front EndRael Max

WordCampBH 2015 - O mínimo essencial para o bom desempenho do seu projeto em ...

WordCampBH 2015 - O mínimo essencial para o bom desempenho do seu projeto em ...

WordCampBH 2015 - O mínimo essencial para o bom desempenho do seu projeto em ...Sergio Costa

Método The bridge

Método The bridge

Método The bridgeDaniel Coscarelli

Guia do Front-end das Galáxias

Guia do Front-end das Galáxias

Guia do Front-end das GaláxiasDavidson Fellipe

WordPress para Gestores de Conteúdo - WordCamp BH 2015

WordPress para Gestores de Conteúdo - WordCamp BH 2015

WordPress para Gestores de Conteúdo - WordCamp BH 2015Nauweb

Do marketplace ao WordPress - WordCamp BH 2015

Do marketplace ao WordPress - WordCamp BH 2015

Do marketplace ao WordPress - WordCamp BH 2015Fellyph Cintra

Software gratuito

Software gratuito

Software gratuitoCampus Party Brasil

DESIGNER E FRONT-END DEV: Prontos para mudar seu workflow?

DESIGNER E FRONT-END DEV: Prontos para mudar seu workflow?

DESIGNER E FRONT-END DEV: Prontos para mudar seu workflow?RC Comunicação

Simple singleton pattern

Simple singleton pattern

Simple singleton patternDennis Calazans

Micro Front-end + CQRS/ES - JSSP jul/2019

Micro Front-end + CQRS/ES - JSSP jul/2019

Micro Front-end + CQRS/ES - JSSP jul/2019Gabriel Rodrigues Couto

Progressive Web Apps: Um novo mundo

Progressive Web Apps: Um novo mundo

Progressive Web Apps: Um novo mundoAndre Baltieri

ASP.NET Core APIs: Performance Tips

ASP.NET Core APIs: Performance Tips

ASP.NET Core APIs: Performance TipsAndre Baltieri

Node.js e Express

Node.js e Express

Node.js e ExpressDan Vitoriano

Phonegap - self RJ

Phonegap - self RJ

Phonegap - self RJjavamanrj

Apresentação scriptcase-netmake

Apresentação scriptcase-netmake

Apresentação scriptcase-netmakeGustavo Lobato

Mais procurados (20)

Abordagens modernas no desenvolvimento web

Abordagens modernas no desenvolvimento web

Abordagens modernas no desenvolvimento web

Introdução ao Native Script

Introdução ao Native Script

Introdução ao Native Script

Introdução ao Web Design: Aula 1 - Imersão ao Web Design

Introdução ao Web Design: Aula 1 - Imersão ao Web Design

Introdução ao Web Design: Aula 1 - Imersão ao Web Design

CoffeeScript Aula 01 Introdução a CoffeeScript

CoffeeScript Aula 01 Introdução a CoffeeScript

CoffeeScript Aula 01 Introdução a CoffeeScript

Design para WordPress- Anyssa Ferreira - WordCamp BH 2015

Design para WordPress- Anyssa Ferreira - WordCamp BH 2015

Design para WordPress- Anyssa Ferreira - WordCamp BH 2015

O Papel do desenvolvedor Front End

O Papel do desenvolvedor Front End

O Papel do desenvolvedor Front End

WordCampBH 2015 - O mínimo essencial para o bom desempenho do seu projeto em ...

WordCampBH 2015 - O mínimo essencial para o bom desempenho do seu projeto em ...

WordCampBH 2015 - O mínimo essencial para o bom desempenho do seu projeto em ...

Método The bridge

Método The bridge

Método The bridge

Guia do Front-end das Galáxias

Guia do Front-end das Galáxias

Guia do Front-end das Galáxias

WordPress para Gestores de Conteúdo - WordCamp BH 2015

WordPress para Gestores de Conteúdo - WordCamp BH 2015

WordPress para Gestores de Conteúdo - WordCamp BH 2015

Do marketplace ao WordPress - WordCamp BH 2015

Do marketplace ao WordPress - WordCamp BH 2015

Do marketplace ao WordPress - WordCamp BH 2015

Software gratuito

Software gratuito

Software gratuito

DESIGNER E FRONT-END DEV: Prontos para mudar seu workflow?

DESIGNER E FRONT-END DEV: Prontos para mudar seu workflow?

DESIGNER E FRONT-END DEV: Prontos para mudar seu workflow?

Simple singleton pattern

Simple singleton pattern

Simple singleton pattern

Micro Front-end + CQRS/ES - JSSP jul/2019

Micro Front-end + CQRS/ES - JSSP jul/2019

Micro Front-end + CQRS/ES - JSSP jul/2019

Progressive Web Apps: Um novo mundo

Progressive Web Apps: Um novo mundo

Progressive Web Apps: Um novo mundo

ASP.NET Core APIs: Performance Tips

ASP.NET Core APIs: Performance Tips

ASP.NET Core APIs: Performance Tips

Node.js e Express

Node.js e Express

Node.js e Express

Phonegap - self RJ

Phonegap - self RJ

Phonegap - self RJ

Apresentação scriptcase-netmake

Apresentação scriptcase-netmake

Apresentação scriptcase-netmake

Semelhante a Aula 4. bibliotecas js

Web Tools Pt Br

Web Tools Pt Br

Web Tools Pt BrPaulo Mattos

Apresentação jsf 1_2

Apresentação jsf 1_2

Apresentação jsf 1_2Bruno de Andrade

Desenvolvimento web produtivo

Desenvolvimento web produtivo

Desenvolvimento web produtivoBruno Luiz Pereira da Silva

Web tools pt-br

Web tools pt-br

Web tools pt-brPaulo Mattos

Desenvolvimento Web: Conhecendo o Vue.Js - Francisco Matheus Ricelly Pinto de...

Desenvolvimento Web: Conhecendo o Vue.Js - Francisco Matheus Ricelly Pinto de...

Desenvolvimento Web: Conhecendo o Vue.Js - Francisco Matheus Ricelly Pinto de...PotiLivre Sobrenome

Desenvolvimento web - conceitos, tecnologia e tendências.

Desenvolvimento web - conceitos, tecnologia e tendências.

Desenvolvimento web - conceitos, tecnologia e tendências.Valmir Justo

Criando aplicações web com tecnologias Microsoft

Criando aplicações web com tecnologias Microsoft

Criando aplicações web com tecnologias MicrosoftFabrício Lopes Sanchez

Javascript Cross-browser

Javascript Cross-browser

Javascript Cross-browserDavidson Fellipe

Introdução a jsf

Introdução a jsf

Introdução a jsfJorge William Rodrigues

Firefox - Developer's Best Friend // Fisl2008

Firefox - Developer's Best Friend // Fisl2008

Firefox - Developer's Best Friend // Fisl2008Clauber Stipkovic

Técnicas e recursos para desenvolvimento Web em cenários de grande escala

Técnicas e recursos para desenvolvimento Web em cenários de grande escala

Técnicas e recursos para desenvolvimento Web em cenários de grande escalaAlexandre Tarifa

Asa cpbr4Campus Party Brasil

Javascript levado a serio

Javascript levado a serio

Javascript levado a serioJaydson Gomes

Portando sua aplicação web para iphone

Portando sua aplicação web para iphone

Portando sua aplicação web para iphoneRenato Nitta

Javascript nos dias de hoje

Javascript nos dias de hoje

Javascript nos dias de hojeCaio Ribeiro Pereira

Introdução sobre desenvolvimento web

Introdução sobre desenvolvimento web

Introdução sobre desenvolvimento webRodrigo Rodrigues

Apresentação Jquery

Apresentação Jquery

Apresentação JqueryLeonardo Ribeiro

Desenvolvendo Sistema Cloud e Web Full-stack Developer

Desenvolvendo Sistema Cloud e Web Full-stack Developer

Desenvolvendo Sistema Cloud e Web Full-stack DeveloperCesar Romero

Web Design Responsivo

Web Design Responsivo

Web Design ResponsivoEduardo Mendes

Conhecendo o Django

Conhecendo o Django

Conhecendo o DjangoMarcos Thomaz

Semelhante a Aula 4. bibliotecas js (20)

Web Tools Pt Br

Web Tools Pt Br

Web Tools Pt Br

Apresentação jsf 1_2

Apresentação jsf 1_2

Apresentação jsf 1_2

Desenvolvimento web produtivo

Desenvolvimento web produtivo

Desenvolvimento web produtivo

Web tools pt-br

Web tools pt-br

Web tools pt-br

Desenvolvimento Web: Conhecendo o Vue.Js - Francisco Matheus Ricelly Pinto de...

Desenvolvimento Web: Conhecendo o Vue.Js - Francisco Matheus Ricelly Pinto de...

Desenvolvimento Web: Conhecendo o Vue.Js - Francisco Matheus Ricelly Pinto de...

Desenvolvimento web - conceitos, tecnologia e tendências.

Desenvolvimento web - conceitos, tecnologia e tendências.

Desenvolvimento web - conceitos, tecnologia e tendências.

Criando aplicações web com tecnologias Microsoft

Criando aplicações web com tecnologias Microsoft

Criando aplicações web com tecnologias Microsoft

Javascript Cross-browser

Javascript Cross-browser

Javascript Cross-browser

Introdução a jsf

Introdução a jsf

Introdução a jsf

Firefox - Developer's Best Friend // Fisl2008

Firefox - Developer's Best Friend // Fisl2008

Firefox - Developer's Best Friend // Fisl2008

Técnicas e recursos para desenvolvimento Web em cenários de grande escala

Técnicas e recursos para desenvolvimento Web em cenários de grande escala

Técnicas e recursos para desenvolvimento Web em cenários de grande escala

Asa cpbr4

Javascript levado a serio

Javascript levado a serio

Javascript levado a serio

Portando sua aplicação web para iphone

Portando sua aplicação web para iphone

Portando sua aplicação web para iphone

Javascript nos dias de hoje

Javascript nos dias de hoje

Javascript nos dias de hoje

Introdução sobre desenvolvimento web

Introdução sobre desenvolvimento web

Introdução sobre desenvolvimento web

Apresentação Jquery

Apresentação Jquery

Apresentação Jquery

Desenvolvendo Sistema Cloud e Web Full-stack Developer

Desenvolvendo Sistema Cloud e Web Full-stack Developer

Desenvolvendo Sistema Cloud e Web Full-stack Developer

Web Design Responsivo

Web Design Responsivo

Web Design Responsivo

Conhecendo o Django

Conhecendo o Django

Conhecendo o Django

Mais de andreluizlc

Aula 6. trabalho da disciplina

Aula 6. trabalho da disciplina

Aula 6. trabalho da disciplinaandreluizlc

Aula 3. frameworks front end

Aula 3. frameworks front end

Aula 3. frameworks front endandreluizlc

Aula 1. apresentação + frameworks

Aula 1. apresentação + frameworks

Aula 1. apresentação + frameworksandreluizlc

Feriadoandreluizlc

Atividadeandreluizlc

Avaliaçãoandreluizlc

Html formulário

Html formulário

Html formulárioandreluizlc

Html tabelaandreluizlc

Apresentação e Introdução ao HTML

Apresentação e Introdução ao HTML

Apresentação e Introdução ao HTMLandreluizlc

Apresentação + html (tags)

Apresentação + html (tags)

Apresentação + html (tags)andreluizlc

Trabalhoandreluizlc

Revisãoandreluizlc

Práticaandreluizlc

Html (tabela)andreluizlc

Html (formulário)

Html (formulário)

Html (formulário)andreluizlc

Feriadoandreluizlc

Mais de andreluizlc (20)

Aula 6. trabalho da disciplina

Aula 6. trabalho da disciplina

Aula 6. trabalho da disciplina

Aula 3. frameworks front end

Aula 3. frameworks front end

Aula 3. frameworks front end

Aula 1. apresentação + frameworks

Aula 1. apresentação + frameworks

Aula 1. apresentação + frameworks

PHP

Feriado

Atividade

Avaliação

Js

Css

Html formulário

Html formulário

Html formulário

Html tabela

Apresentação e Introdução ao HTML

Apresentação e Introdução ao HTML

Apresentação e Introdução ao HTML

Apresentação + html (tags)

Apresentação + html (tags)

Apresentação + html (tags)

CSS

Trabalho

Revisão

Prática

Html (tabela)

Html (formulário)

Html (formulário)

Html (formulário)

Feriado

Último

Luís Kitota AWS Discovery Day Ka Solution.pdf

Luís Kitota AWS Discovery Day Ka Solution.pdf

Luís Kitota AWS Discovery Day Ka Solution.pdfLuisKitota

ATIVIDADE 1 - CUSTOS DE PRODUÇÃO - 52_2024.docx

ATIVIDADE 1 - CUSTOS DE PRODUÇÃO - 52_2024.docx

ATIVIDADE 1 - CUSTOS DE PRODUÇÃO - 52_2024.docx2m Assessoria

Padrões de Projeto: Proxy e Command com exemplo

Padrões de Projeto: Proxy e Command com exemplo

Padrões de Projeto: Proxy e Command com exemploDanilo Pinotti

Boas práticas de programação com Object Calisthenics

Boas práticas de programação com Object Calisthenics

Boas práticas de programação com Object CalisthenicsDanilo Pinotti

ATIVIDADE 1 - SISTEMAS DISTRIBUÍDOS E REDES - 52_2024.docx

ATIVIDADE 1 - SISTEMAS DISTRIBUÍDOS E REDES - 52_2024.docx

ATIVIDADE 1 - SISTEMAS DISTRIBUÍDOS E REDES - 52_2024.docx2m Assessoria

ATIVIDADE 1 - LOGÍSTICA EMPRESARIAL - 52_2024.docx

ATIVIDADE 1 - LOGÍSTICA EMPRESARIAL - 52_2024.docx

ATIVIDADE 1 - LOGÍSTICA EMPRESARIAL - 52_2024.docx2m Assessoria

ATIVIDADE 1 - ESTRUTURA DE DADOS II - 52_2024.docx

ATIVIDADE 1 - ESTRUTURA DE DADOS II - 52_2024.docx

ATIVIDADE 1 - ESTRUTURA DE DADOS II - 52_2024.docx2m Assessoria

ATIVIDADE 1 - GCOM - GESTÃO DA INFORMAÇÃO - 54_2024.docx

ATIVIDADE 1 - GCOM - GESTÃO DA INFORMAÇÃO - 54_2024.docx

ATIVIDADE 1 - GCOM - GESTÃO DA INFORMAÇÃO - 54_2024.docx2m Assessoria

Programação Orientada a Objetos - 4 Pilares.pdf

Programação Orientada a Objetos - 4 Pilares.pdf

Programação Orientada a Objetos - 4 Pilares.pdfSamaraLunas

Último (9)

Luís Kitota AWS Discovery Day Ka Solution.pdf

Luís Kitota AWS Discovery Day Ka Solution.pdf

Luís Kitota AWS Discovery Day Ka Solution.pdf

ATIVIDADE 1 - CUSTOS DE PRODUÇÃO - 52_2024.docx

ATIVIDADE 1 - CUSTOS DE PRODUÇÃO - 52_2024.docx

ATIVIDADE 1 - CUSTOS DE PRODUÇÃO - 52_2024.docx

Padrões de Projeto: Proxy e Command com exemplo

Padrões de Projeto: Proxy e Command com exemplo

Padrões de Projeto: Proxy e Command com exemplo

Boas práticas de programação com Object Calisthenics

Boas práticas de programação com Object Calisthenics

Boas práticas de programação com Object Calisthenics

ATIVIDADE 1 - SISTEMAS DISTRIBUÍDOS E REDES - 52_2024.docx

ATIVIDADE 1 - SISTEMAS DISTRIBUÍDOS E REDES - 52_2024.docx

ATIVIDADE 1 - SISTEMAS DISTRIBUÍDOS E REDES - 52_2024.docx

ATIVIDADE 1 - LOGÍSTICA EMPRESARIAL - 52_2024.docx

ATIVIDADE 1 - LOGÍSTICA EMPRESARIAL - 52_2024.docx

ATIVIDADE 1 - LOGÍSTICA EMPRESARIAL - 52_2024.docx

ATIVIDADE 1 - ESTRUTURA DE DADOS II - 52_2024.docx

ATIVIDADE 1 - ESTRUTURA DE DADOS II - 52_2024.docx

ATIVIDADE 1 - ESTRUTURA DE DADOS II - 52_2024.docx

ATIVIDADE 1 - GCOM - GESTÃO DA INFORMAÇÃO - 54_2024.docx

ATIVIDADE 1 - GCOM - GESTÃO DA INFORMAÇÃO - 54_2024.docx

ATIVIDADE 1 - GCOM - GESTÃO DA INFORMAÇÃO - 54_2024.docx

Programação Orientada a Objetos - 4 Pilares.pdf

Programação Orientada a Objetos - 4 Pilares.pdf

Programação Orientada a Objetos - 4 Pilares.pdf

Aula 4. bibliotecas js

1. Bibliotecas JS Frameworks para Desenvolvimento Web Prof. MSc. André Costa - andre.costa@unifacs.br

2. SUMÁRIO • Bibliotecas JS • jQuery • Atividade Prática Frameworks para Desenvolvimento Web – Porf. MSc. André Costa

3. Bibliotecas JS • Conjunto de funções JS disponíveis para o utilização do desenvolvedor • Maior produtividade em relação ao JS padrão • Disponibilidade de Plug-ins baseados na Biblioteca • Cross Browser Frameworks para Desenvolvimento Web – Porf. MSc. André Costa

4. Bibliotecas JS Frameworks para Desenvolvimento Web – Porf. MSc. André Costa

5. Bibliotecas JS Frameworks para Desenvolvimento Web – Porf. MSc. André Costa

6. Bibliotecas JS Frameworks para Desenvolvimento Web – Porf. MSc. André Costa

7. Bibliotecas JS Frameworks para Desenvolvimento Web – Porf. MSc. André Costa

8. jQuery CDN Frameworks para Desenvolvimento Web – Porf. MSc. André Costa

9. jQuery Ready Frameworks para Desenvolvimento Web – Porf. MSc. André Costa

10. jQuery Console (JS) Frameworks para Desenvolvimento Web – Porf. MSc. André Costa

11. jQuery Seletor (igual ao CSS) • Seletor compatível com CSS3, mesmo que o Browser não dê suporte Frameworks para Desenvolvimento Web – Porf. MSc. André Costa

12. jQuery Capturar Eventos Frameworks para Desenvolvimento Web – Porf. MSc. André Costa

13. jQuery Manipular Atributos Frameworks para Desenvolvimento Web – Porf. MSc. André Costa

14. jQuery Manipular CSS Frameworks para Desenvolvimento Web – Porf. MSc. André Costa

15. jQuery Manipular Valores Frameworks para Desenvolvimento Web – Porf. MSc. André Costa

16. jQuery Manipular HTML Frameworks para Desenvolvimento Web – Porf. MSc. André Costa

17. jQuery Loop para Arrays Frameworks para Desenvolvimento Web – Porf. MSc. André Costa

18. jQuery Efeitos Frameworks para Desenvolvimento Web – Porf. MSc. André Costa

19. jQuery Ajax Frameworks para Desenvolvimento Web – Porf. MSc. André Costa

20. jQuery jQuery UI Frameworks para Desenvolvimento Web – Porf. MSc. André Costa

21. Atividade Prática Descrição do trabalho em sala.. Frameworks para Desenvolvimento Web – Porf. MSc. André Costa

22. Prof. MSc. André Costa andre.costa@unifacs.br