O documento apresenta uma palestra sobre JavaScript feita por André Luís no evento SAPO Sessions #2 em 2009. A palestra discute como JavaScript pode ser usado de forma não obstrutiva, respeitando princípios como degradação graciosa e melhoramento progressivo, através de técnicas como separação de camadas e carregamento assíncrono. O objetivo é mostrar como problemas comuns de acessibilidade, usabilidade e compatibilidade podem ser evitados ao se usar JavaScript de forma correta.
O documento apresenta uma introdução sobre JavaScript, descrevendo-o como uma linguagem de programação utilizada para criar pequenos programas que realizam ações em páginas web. Em seguida, explica conceitos básicos como estrutura de scripts, uso de funções como document.write(), caixas de diálogo e conversão de variáveis. Por fim, aborda brevemente objetos, eventos e funções.
Este documento apresenta uma introdução à linguagem JavaScript, cobrindo sua história, tipos, operações, strings, arrays, expressões, funções, objetos, strict mode, manipulação do DOM, eventos e o operador this. O documento também discute como rodar código JavaScript em sites e o futuro promissor de JavaScript.
O documento apresenta a agenda de um mini-curso de 5 dias sobre JavaScript. O curso abordará tópicos como sintaxe e estrutura da linguagem, funções e objetos, objetos nativos do browser, janelas do browser e depuração do DOM. Cada dia será dedicado a um ou dois episódios sobre esses assuntos.
O documento fornece uma introdução sobre JavaScript, abordando seus principais tópicos:
1) JavaScript permite adicionar interatividade às páginas web;
2) Foi criada pela Netscape em 1995 para rodar no lado do cliente;
3) Possui funcionalidades como manipulação de conteúdo, formulários, janelas do navegador e interação com outras linguagens.
Este documento fornece um resumo da história e características da linguagem JavaScript em 3 frases:
1) JavaScript foi criada originalmente em 1995 para ser usada no navegador Netscape Navigator e teve influências de linguagens como Java, Scheme, Self e Perl.
2) A linguagem é interpretada, possui tipagem dinâmica e fraca, orientação a objetos baseada em protótipos e funções de primeira classe.
3) JavaScript evoluiu muito desde então e atualmente está na versão ECMAScript 6, sendo uma das linguagens de programação
1. O documento apresenta um livro sobre desenvolvimento de websites interativos com JavaScript.
2. O livro contém 12 capítulos sobre sintaxe, funções, objetos, janelas do navegador e mais.
3. Inclui exemplos e exercícios resolvidos para aplicações como comunicação entre frames, geração de páginas dinâmicas e validação de formulários.
Palestra sobre Javascript que ministrei na III Mostra Científica do Senac-RS.
A palestra conta um pouco da história do Javascript e o porque da imcompreensão da linguagem. Também mostra o que é possível fazer e como desenvolver um código um profissional e levado a sério com Javascript.
O documento apresenta uma palestra sobre JavaScript feita por André Luís no evento SAPO Sessions #2 em 2009. A palestra discute como JavaScript pode ser usado de forma não obstrutiva, respeitando princípios como degradação graciosa e melhoramento progressivo, através de técnicas como separação de camadas e carregamento assíncrono. O objetivo é mostrar como problemas comuns de acessibilidade, usabilidade e compatibilidade podem ser evitados ao se usar JavaScript de forma correta.
O documento apresenta uma introdução sobre JavaScript, descrevendo-o como uma linguagem de programação utilizada para criar pequenos programas que realizam ações em páginas web. Em seguida, explica conceitos básicos como estrutura de scripts, uso de funções como document.write(), caixas de diálogo e conversão de variáveis. Por fim, aborda brevemente objetos, eventos e funções.
Este documento apresenta uma introdução à linguagem JavaScript, cobrindo sua história, tipos, operações, strings, arrays, expressões, funções, objetos, strict mode, manipulação do DOM, eventos e o operador this. O documento também discute como rodar código JavaScript em sites e o futuro promissor de JavaScript.
O documento apresenta a agenda de um mini-curso de 5 dias sobre JavaScript. O curso abordará tópicos como sintaxe e estrutura da linguagem, funções e objetos, objetos nativos do browser, janelas do browser e depuração do DOM. Cada dia será dedicado a um ou dois episódios sobre esses assuntos.
O documento fornece uma introdução sobre JavaScript, abordando seus principais tópicos:
1) JavaScript permite adicionar interatividade às páginas web;
2) Foi criada pela Netscape em 1995 para rodar no lado do cliente;
3) Possui funcionalidades como manipulação de conteúdo, formulários, janelas do navegador e interação com outras linguagens.
Este documento fornece um resumo da história e características da linguagem JavaScript em 3 frases:
1) JavaScript foi criada originalmente em 1995 para ser usada no navegador Netscape Navigator e teve influências de linguagens como Java, Scheme, Self e Perl.
2) A linguagem é interpretada, possui tipagem dinâmica e fraca, orientação a objetos baseada em protótipos e funções de primeira classe.
3) JavaScript evoluiu muito desde então e atualmente está na versão ECMAScript 6, sendo uma das linguagens de programação
1. O documento apresenta um livro sobre desenvolvimento de websites interativos com JavaScript.
2. O livro contém 12 capítulos sobre sintaxe, funções, objetos, janelas do navegador e mais.
3. Inclui exemplos e exercícios resolvidos para aplicações como comunicação entre frames, geração de páginas dinâmicas e validação de formulários.
Palestra sobre Javascript que ministrei na III Mostra Científica do Senac-RS.
A palestra conta um pouco da história do Javascript e o porque da imcompreensão da linguagem. Também mostra o que é possível fazer e como desenvolver um código um profissional e levado a sério com Javascript.
O documento fornece uma introdução às funções e conceitos básicos da linguagem JavaScript, incluindo:
1) A definição e tipos de funções em JavaScript;
2) Como declarar variáveis e os tipos de valores suportados;
3) Os operadores aritméticos, lógicos e de comparação disponíveis.
1) O documento introduz conceitos básicos de JavaScript, incluindo variáveis, tipos, operadores e estruturas de controlo. 2) É explicado que JavaScript permite a criação e manipulação de objetos, sendo estas as estruturas de dados fundamentais da linguagem. 3) O documento descreve também funções e scopes em JavaScript, esclarecendo que cada função define o seu próprio escopo.
O documento discute a experiência de 20 anos da BIREME/OPAS/OMS com bancos de dados NoSQL. Apresenta como o modelo relacional normalizado era predominante, mas usuários resistiam com sistemas como ISIS. Novos bancos NoSQL surgiram para grandes empresas. A BIREME usa o sistema LILACS para catalogação cooperativa na América Latina. Propõe o projeto ISIS-DM para definir esquemas semiestruturados em NoSQL como MongoDB e CouchDB.
Luciano Ramalho apresenta sobre a evolução do JavaScript, incluindo seu uso fora do navegador com Node.js e como as funções de primeira classe e de ordem superior ampliaram suas capacidades. A tipagem dinâmica e fraca causou problemas no passado, mas boas práticas como o uso de === ajudam. Frameworks modernos como jQuery também aproveitam recursos como expressões de função.
Java script em 2016 - Como sobreviver a essa sopa de letrinhas com vue.jsVinicius Reis
O documento discute a complexidade do ecossistema JavaScript e como Vue.js pode ajudar a simplificar o desenvolvimento front-end. Ele explica conceitos como EcmaScript, Node, pacotes, task runners, transpilers, bundlers e testes. Em seguida, apresenta o framework Vue.js como uma forma progressiva de construir interfaces com componentes de único arquivo que oferecem renderização do lado do servidor e do cliente.
Este documento fornece uma introdução básica à linguagem JavaScript em 3 frases ou menos:
1) Apresenta os conceitos fundamentais de JavaScript como variáveis, operadores, objetos e funções.
2) Explica como incorporar código JavaScript em páginas HTML e como esconder o código de navegadores mais antigos.
3) Fornece exemplos detalhados sobre como criar e manipular variáveis, objetos e arrays em JavaScript.
O documento fornece um resumo sobre o mercado de automação no Espírito Santo em 3 frases:
1) O mercado de automação no ES está em expansão, com previsão de investimentos de US$ 26,5 bilhões e geração de 100 mil empregos entre 2009-2013, principalmente nos setores de mineração e siderurgia.
2) Existem oportunidades para técnicos em automação em diversas indústrias e empresas de automação no estado, com atividades que incluem manutenção, projetos, controle e instrument
Modelagem e Controle de Robôs Móveis e Sistemas MultirrobôsFelipe Martins
Apresentação da tese de doutorado "Modelagem e Compensação da Dinâmica de Robôs Móveis e sua Aplicação em Controle de Formação".
Autor: Felipe Nascimento Martins
Este documento discute como as tecnologias móveis como tablets e smartphones podem ser usadas para melhorar o ensino e a aprendizagem. Apresenta vários estudos que mostram que os dispositivos móveis podem aumentar a compreensão, as habilidades digitais e a motivação dos alunos. No entanto, também ressalta a importância de os professores receberem treinamento adequado para poderem usar efetivamente essas ferramentas em sala de aula.
Práticas de Desenvolvimento de SoftwareTiago Barros
O curso aborda os seguintes tópicos:
1) Construção de software, incluindo o que é construção de software e como ela se encaixa no processo de desenvolvimento;
2) Paradigmas de programação e como eles afetam a construção de software;
3) Arquiteturas de software e padrões de projeto.
O documento apresenta uma introdução ao JavaScript, destacando sua popularidade e aplicações tanto no frontend quanto no backend. Explica como o JavaScript evoluiu ao longo dos anos e ressalta a importância de se manter atualizado com as novas funcionalidades, frameworks e padrões de codificação. Também enfatiza a forte comunidade ao redor da linguagem e convida o leitor a participar dela.
Interfaces fisicas para dispositivos moveisTiago Barros
O documento fornece uma introdução às interfaces físicas para dispositivos móveis, abordando conceitos como computação física, alternativas de interfaces como Arduino e Amarino, e protocolos de comunicação serial.
Técnicas de Prototipação II - Physical Computing - Aula 02Tiago Barros
O documento resume conceitos sobre sensores e atuadores sonoros e eletrônicos utilizados na plataforma Arduino. Inclui instruções para conectar e controlar microfones, buzzer, motores DC e displays de 7 segmentos, além de comunicação serial para enviar dados para o PC.
Competições de robótica voltada a estudantes. Em especial, um pouco sobre a Olimpíada Brasileira de Robótica (OBR), Competição Brasileira de Robótica (CBR), Latin American Robotics Competitios (LARC) e RoboCup.
1. O documento apresenta uma introdução ao JavaScript para iniciantes, abordando tópicos como sintaxe, boas práticas e informações úteis.
2. É apresentada uma sequência com três sessões: introdução ao JavaScript, conceitos básicos e manipulação do DOM.
3. Na sessão de conceitos básicos, são explicados tópicos como variáveis, operadores, estruturas de controlo, funções, objetos e eventos.
Este documento fornece uma introdução ao JavaScript em 3 frases ou menos:
1) Apresenta JavaScript como uma linguagem de programação usada para adicionar funcionalidades a páginas da web.
2) Discute como JavaScript atua sobre elementos do DOM após a página carregar.
3) Menciona o uso de bibliotecas como jQuery para estender as capacidades do JavaScript.
O que falta na internet para as coisas?Tiago Barros
Nos últimos anos, a internet vem evoluindo de um repositório de documentos interconectados para um ambiente dinâmico, que interliga pessoas, aplicações e dispositivos. Para que isto se estabeleça, é necessária uma arquitetura para internet que consiga lidar com estes novos desafios de intercomunicação entre as coisas. Nesta apresentação iremos discutir sobre as plataformas, padrões, protocolos de comunicação e a infra-estrutura necessária para a internet das coisas.
O documento discute funções em JavaScript, definindo-as como blocos de código capazes de executar ações e dar maior legibilidade e manutenção ao código. Apresenta diferentes formas de criar funções como declaração function, objeto construtor e sintaxe literal, e discute conceitos como escopo, closures e funções globais.
O documento apresenta o professor Tiago Barros, que ministrará o curso de especialização em Engenharia de Software. O curso abordará processos de desenvolvimento de software, engenharia de requisitos, documentação e elicitação de requisitos. Os alunos formarão equipes para definir e documentar os requisitos de um projeto de software.
Achieving consistency in large CSS projects — FullStackLX #2André Luís
Video at: https://www.youtube.com/watch?v=1_YdO9uGhYY
We all know CSS’s reputation for being a mess. We’ve all seen Peter Griffin’s GIF. It’s not that tricky but if we let our immediate needs roam wild, our future self will be shaking their fist at our present self. In this talk we’ll cover how we can put in place several mechanisms in our favourite CSS pre-processor to achieve consistency not only in terms of code but also achieving a visually consistent product.
PDF with notes available at http://talks.andr3.net/2016/consistency.pdf
The document discusses collaboration between designers and developers. It suggests that designers should understand limitations of different mediums and explore capabilities. Developers and designers work best when they communicate effectively through shared vocabulary, deliverables and deciding issues together in the browser. The result is higher quality products when both parties have input.
O documento fornece uma introdução às funções e conceitos básicos da linguagem JavaScript, incluindo:
1) A definição e tipos de funções em JavaScript;
2) Como declarar variáveis e os tipos de valores suportados;
3) Os operadores aritméticos, lógicos e de comparação disponíveis.
1) O documento introduz conceitos básicos de JavaScript, incluindo variáveis, tipos, operadores e estruturas de controlo. 2) É explicado que JavaScript permite a criação e manipulação de objetos, sendo estas as estruturas de dados fundamentais da linguagem. 3) O documento descreve também funções e scopes em JavaScript, esclarecendo que cada função define o seu próprio escopo.
O documento discute a experiência de 20 anos da BIREME/OPAS/OMS com bancos de dados NoSQL. Apresenta como o modelo relacional normalizado era predominante, mas usuários resistiam com sistemas como ISIS. Novos bancos NoSQL surgiram para grandes empresas. A BIREME usa o sistema LILACS para catalogação cooperativa na América Latina. Propõe o projeto ISIS-DM para definir esquemas semiestruturados em NoSQL como MongoDB e CouchDB.
Luciano Ramalho apresenta sobre a evolução do JavaScript, incluindo seu uso fora do navegador com Node.js e como as funções de primeira classe e de ordem superior ampliaram suas capacidades. A tipagem dinâmica e fraca causou problemas no passado, mas boas práticas como o uso de === ajudam. Frameworks modernos como jQuery também aproveitam recursos como expressões de função.
Java script em 2016 - Como sobreviver a essa sopa de letrinhas com vue.jsVinicius Reis
O documento discute a complexidade do ecossistema JavaScript e como Vue.js pode ajudar a simplificar o desenvolvimento front-end. Ele explica conceitos como EcmaScript, Node, pacotes, task runners, transpilers, bundlers e testes. Em seguida, apresenta o framework Vue.js como uma forma progressiva de construir interfaces com componentes de único arquivo que oferecem renderização do lado do servidor e do cliente.
Este documento fornece uma introdução básica à linguagem JavaScript em 3 frases ou menos:
1) Apresenta os conceitos fundamentais de JavaScript como variáveis, operadores, objetos e funções.
2) Explica como incorporar código JavaScript em páginas HTML e como esconder o código de navegadores mais antigos.
3) Fornece exemplos detalhados sobre como criar e manipular variáveis, objetos e arrays em JavaScript.
O documento fornece um resumo sobre o mercado de automação no Espírito Santo em 3 frases:
1) O mercado de automação no ES está em expansão, com previsão de investimentos de US$ 26,5 bilhões e geração de 100 mil empregos entre 2009-2013, principalmente nos setores de mineração e siderurgia.
2) Existem oportunidades para técnicos em automação em diversas indústrias e empresas de automação no estado, com atividades que incluem manutenção, projetos, controle e instrument
Modelagem e Controle de Robôs Móveis e Sistemas MultirrobôsFelipe Martins
Apresentação da tese de doutorado "Modelagem e Compensação da Dinâmica de Robôs Móveis e sua Aplicação em Controle de Formação".
Autor: Felipe Nascimento Martins
Este documento discute como as tecnologias móveis como tablets e smartphones podem ser usadas para melhorar o ensino e a aprendizagem. Apresenta vários estudos que mostram que os dispositivos móveis podem aumentar a compreensão, as habilidades digitais e a motivação dos alunos. No entanto, também ressalta a importância de os professores receberem treinamento adequado para poderem usar efetivamente essas ferramentas em sala de aula.
Práticas de Desenvolvimento de SoftwareTiago Barros
O curso aborda os seguintes tópicos:
1) Construção de software, incluindo o que é construção de software e como ela se encaixa no processo de desenvolvimento;
2) Paradigmas de programação e como eles afetam a construção de software;
3) Arquiteturas de software e padrões de projeto.
O documento apresenta uma introdução ao JavaScript, destacando sua popularidade e aplicações tanto no frontend quanto no backend. Explica como o JavaScript evoluiu ao longo dos anos e ressalta a importância de se manter atualizado com as novas funcionalidades, frameworks e padrões de codificação. Também enfatiza a forte comunidade ao redor da linguagem e convida o leitor a participar dela.
Interfaces fisicas para dispositivos moveisTiago Barros
O documento fornece uma introdução às interfaces físicas para dispositivos móveis, abordando conceitos como computação física, alternativas de interfaces como Arduino e Amarino, e protocolos de comunicação serial.
Técnicas de Prototipação II - Physical Computing - Aula 02Tiago Barros
O documento resume conceitos sobre sensores e atuadores sonoros e eletrônicos utilizados na plataforma Arduino. Inclui instruções para conectar e controlar microfones, buzzer, motores DC e displays de 7 segmentos, além de comunicação serial para enviar dados para o PC.
Competições de robótica voltada a estudantes. Em especial, um pouco sobre a Olimpíada Brasileira de Robótica (OBR), Competição Brasileira de Robótica (CBR), Latin American Robotics Competitios (LARC) e RoboCup.
1. O documento apresenta uma introdução ao JavaScript para iniciantes, abordando tópicos como sintaxe, boas práticas e informações úteis.
2. É apresentada uma sequência com três sessões: introdução ao JavaScript, conceitos básicos e manipulação do DOM.
3. Na sessão de conceitos básicos, são explicados tópicos como variáveis, operadores, estruturas de controlo, funções, objetos e eventos.
Este documento fornece uma introdução ao JavaScript em 3 frases ou menos:
1) Apresenta JavaScript como uma linguagem de programação usada para adicionar funcionalidades a páginas da web.
2) Discute como JavaScript atua sobre elementos do DOM após a página carregar.
3) Menciona o uso de bibliotecas como jQuery para estender as capacidades do JavaScript.
O que falta na internet para as coisas?Tiago Barros
Nos últimos anos, a internet vem evoluindo de um repositório de documentos interconectados para um ambiente dinâmico, que interliga pessoas, aplicações e dispositivos. Para que isto se estabeleça, é necessária uma arquitetura para internet que consiga lidar com estes novos desafios de intercomunicação entre as coisas. Nesta apresentação iremos discutir sobre as plataformas, padrões, protocolos de comunicação e a infra-estrutura necessária para a internet das coisas.
O documento discute funções em JavaScript, definindo-as como blocos de código capazes de executar ações e dar maior legibilidade e manutenção ao código. Apresenta diferentes formas de criar funções como declaração function, objeto construtor e sintaxe literal, e discute conceitos como escopo, closures e funções globais.
O documento apresenta o professor Tiago Barros, que ministrará o curso de especialização em Engenharia de Software. O curso abordará processos de desenvolvimento de software, engenharia de requisitos, documentação e elicitação de requisitos. Os alunos formarão equipes para definir e documentar os requisitos de um projeto de software.
Achieving consistency in large CSS projects — FullStackLX #2André Luís
Video at: https://www.youtube.com/watch?v=1_YdO9uGhYY
We all know CSS’s reputation for being a mess. We’ve all seen Peter Griffin’s GIF. It’s not that tricky but if we let our immediate needs roam wild, our future self will be shaking their fist at our present self. In this talk we’ll cover how we can put in place several mechanisms in our favourite CSS pre-processor to achieve consistency not only in terms of code but also achieving a visually consistent product.
PDF with notes available at http://talks.andr3.net/2016/consistency.pdf
The document discusses collaboration between designers and developers. It suggests that designers should understand limitations of different mediums and explore capabilities. Developers and designers work best when they communicate effectively through shared vocabulary, deliverables and deciding issues together in the browser. The result is higher quality products when both parties have input.
Responsive Web Design: Uma História das Trincheiras (sapo.pt)André Luís
Presentation in Portuguese delivered at ESAD Matosinhos, by invitation of Tiago Pedras and the Post-Grad. in Webdesign.
It's the history of the decisions we had to make while the sapo.pt homepage (the most popular portuguese website) was made. The website would be launched in july 2012, with a lot of improvements which sadly, aren't documented here.
http://www.esad.pt
Lições Práticas de Semântica com HTML5 — 2º evento HTML5PTAndré Luís
O documento apresenta as principais mudanças na semântica da web com a introdução do HTML5, incluindo novos elementos estruturais como <section>, <article>, <nav>, <time> e <data> que fornecem informações sobre o conteúdo de maneira mais clara e significativa do que tags genéricas.
Este documento apresenta uma palestra sobre direitos autorais e licenças permissivas. A palestra discute o que é direito autoral, como lidar com infrações, e como simplificar o compartilhamento de conteúdo usando licenças Creative Commons. O objetivo é ajudar criadores de conteúdo a entender melhor os direitos autorais e promover a reutilização do conteúdo de forma responsável.
The document discusses responsive web design and flexibility on websites. It provides a brief history of web design from 1991 to present, highlighting important milestones. It explains that responsive design means making websites react to different environments like device width, height, and orientation using CSS media queries. The key steps to make a site responsive are to adapt the layout for different environments through media queries, use fluid grids that are width in percentages instead of pixels, and make images flexible by setting width to a percentage rather than a fixed pixel value.
This document discusses copyright and fair use licenses. It begins by introducing the author and their background. It then provides explanations of what copyright is, including definitions, expiration timelines, and validity across countries. Reasons for copyright are discussed, including obtaining royalties. The document addresses how to deal with infringement through contacting infringers, legal advice, or more creative approaches. Different license types are explained, including various Creative Commons licenses and those for software. Considerations for copyright on the web are also provided.
Microformatos - 2009 - Juntando as Peças do PuzzleAndré Luís
Apresentação introdutória sobre Microformatos na SAPO Sessions de 4 de Junho de 2009.
Baseada na apresentação feita no Codebits, actualizada com exemplos e novidades. (novas ferramentas, novos design-patterns, etc.)
Microformatos - juntando as peças do puzzleAndré Luís
Apresentação dada no Codebits 2008. Focada no que são, como usá-los, como publicá-los e como os consumir... para permitir muitas hacks no concurso.
A presentation I gave at Codebits 2008, focused on what they are, how to use them, publish them and consume them... to enable hacking at the contest.
Microformatos - pequenas peças do puzzleAndré Luís
Internal training session (in Portuguese) at SAPO.pt to introduce the concepts and explain the implementation details of the most prominent formats.
----
Sessão de formação interna (em português) @ SAPO.pt para introduzir os conceitos e os pormenores de implementação dos formatos mais relevantes.
As classes de modelagem podem ser comparadas a moldes ou
formas que definem as características e os comportamentos dos
objetos criados a partir delas. Vale traçar um paralelo com o projeto de
um automóvel. Os engenheiros definem as medidas, a quantidade de
portas, a potência do motor, a localização do estepe, dentre outras
descrições necessárias para a fabricação de um veículo
Este certificado confirma que Gabriel de Mattos Faustino concluiu com sucesso um curso de 42 horas de Gestão Estratégica de TI - ITIL na Escola Virtual entre 19 de fevereiro de 2014 a 20 de fevereiro de 2014.
PRODUÇÃO E CONSUMO DE ENERGIA DA PRÉ-HISTÓRIA À ERA CONTEMPORÂNEA E SUA EVOLU...Faga1939
Este artigo tem por objetivo apresentar como ocorreu a evolução do consumo e da produção de energia desde a pré-história até os tempos atuais, bem como propor o futuro da energia requerido para o mundo. Da pré-história até o século XVIII predominou o uso de fontes renováveis de energia como a madeira, o vento e a energia hidráulica. Do século XVIII até a era contemporânea, os combustíveis fósseis predominaram com o carvão e o petróleo, mas seu uso chegará ao fim provavelmente a partir do século XXI para evitar a mudança climática catastrófica global resultante de sua utilização ao emitir gases do efeito estufa responsáveis pelo aquecimento global. Com o fim da era dos combustíveis fósseis virá a era das fontes renováveis de energia quando prevalecerá a utilização da energia hidrelétrica, energia solar, energia eólica, energia das marés, energia das ondas, energia geotérmica, energia da biomassa e energia do hidrogênio. Não existem dúvidas de que as atividades humanas sobre a Terra provocam alterações no meio ambiente em que vivemos. Muitos destes impactos ambientais são provenientes da geração, manuseio e uso da energia com o uso de combustíveis fósseis. A principal razão para a existência desses impactos ambientais reside no fato de que o consumo mundial de energia primária proveniente de fontes não renováveis (petróleo, carvão, gás natural e nuclear) corresponde a aproximadamente 88% do total, cabendo apenas 12% às fontes renováveis. Independentemente das várias soluções que venham a ser adotadas para eliminar ou mitigar as causas do efeito estufa, a mais importante ação é, sem dúvidas, a adoção de medidas que contribuam para a eliminação ou redução do consumo de combustíveis fósseis na produção de energia, bem como para seu uso mais eficiente nos transportes, na indústria, na agropecuária e nas cidades (residências e comércio), haja vista que o uso e a produção de energia são responsáveis por 57% dos gases de estufa emitidos pela atividade humana. Neste sentido, é imprescindível a implantação de um sistema de energia sustentável no mundo. Em um sistema de energia sustentável, a matriz energética mundial só deveria contar com fontes de energia limpa e renováveis (hidroelétrica, solar, eólica, hidrogênio, geotérmica, das marés, das ondas e biomassa), não devendo contar, portanto, com o uso dos combustíveis fósseis (petróleo, carvão e gás natural).
Em um mundo cada vez mais digital, a segurança da informação tornou-se essencial para proteger dados pessoais e empresariais contra ameaças cibernéticas. Nesta apresentação, abordaremos os principais conceitos e práticas de segurança digital, incluindo o reconhecimento de ameaças comuns, como malware e phishing, e a implementação de medidas de proteção e mitigação para vazamento de senhas.
6. SAPO Sessions #2 javascript, done right.
Desde brincadeiras em javascript
no site dum canal de IRC.
2000
7. SAPO Sessions #2 javascript, done right.
Até aplicações web inseridas
no Webmail do SAPO.
2009
8. SAPO Sessions #2 javascript, done right.
Programa de Festas
. Uso dado ao Javascript
. Problemas
. Como resolvê‐los
. Javascript Não Obstrutivo
. Hijax
. Scripts não bloqueantes
. Histórico com Javascript
2009
9. SAPO Sessions #2 javascript, done right.
javascript
Tem sido muito maltratado ao longo do tempo
10. SAPO Sessions #2 javascript, done right.
2001
ppopu
s
puop p
pop p
o u up
pjavascript s
popups s
ps
filho do diabo
Em 2001, era o filho do diabo.
12. SAPO Sessions #2 javascript, done right.
2005
st
X que
JA e
A pR
tt javascript
H WebAp
L
M ps
X everybody’s bitch
lover
Mashup
s
13. SAPO Sessions #2 javascript, done right.
javascript é usado para
14. SAPO Sessions #2 javascript, done right.
javascript é usado para popups
15. SAPO Sessions #2 javascript, done right.
javascript é usado para efeitos de estilo
16. SAPO Sessions #2 javascript, done right.
javascript é usado para decorações
natalícias
17. SAPO Sessions #2 javascript, done right.
javascript é usado para pré‐carregar
imagens
18. SAPO Sessions #2 javascript, done right.
javascript é usado para mudar de página
19. SAPO Sessions #2 javascript, done right.
javascript é usado para evitar recarregamento
de páginas inteiras
20. SAPO Sessions #2 javascript, done right.
javascript é usado para evitar recarregamento
AJA X
de páginas inteiras
21. SAPO Sessions #2 javascript, done right.
javascript é usado para tudo
Am
s Valid
a
p
a bie ação
M de
nte Form
fline
s Of s G s
pp
A ráf
/Sub icos
Emu Pub
lador
es de
(spec Jogo
trum tes
s ui
e S
, etc) ffic
O
22. SAPO Sessions #2 javascript, done right.
Será que isto é um problema?
-------25%------
23. SAPO Sessions #2 javascript, done right.
problemas com o javascript
Ausência de suporte para Javascript
Intranets corp., screen-readers, search engine crawlers, NoScript, etc.
Somando as pequenas percentagens destes factores, facilmente se chega acima
dos 10%.
Mais: um utilizador que veja um site quebrado, muito provavelmente, não volta.
24. SAPO Sessions #2 javascript, done right.
problemas com o javascript
Ausência de suporte para Javascript
Não é bookmarkable
Não oferece, de origem, mecanismos para guardar o estado duma webapp
Soa a algo familiar? Argumento muitas vezes usado por *nós* contra sites 100% Flash.
25. SAPO Sessions #2 javascript, done right.
problemas com o javascript
Ausência de suporte para Javascript
Não é bookmarkable
Quebra o histórico (retroceder, avançar)
Não oferece, de origem, mecanismos para guardar o histórico
Permite-nos implementar mecanismos para isto, mas não fornece de origem.
26. SAPO Sessions #2 javascript, done right.
problemas com o javascript
Ausência de suporte para Javascript
Não é bookmarkable
Quebra o histórico (retroceder, avançar)
Acessibilidade: navegação por teclado
Eventos onmousedown, onmouseover não disparam se não se usar um disp. apontador
focus para além do onmouseover, onclick em vez de onmousedown
27. SAPO Sessions #2 javascript, done right.
problemas com o javascript
Ausência de suporte para Javascript
Não é bookmarkable
Quebra o histórico (retroceder, avançar)
Acessibilidade: navegação por teclado
Usabilidade: controlar a abertura dum link
Abrir numa nova tab, nova janela ou enviar link por mail. Problema: href=”#”
28. SAPO Sessions #2 javascript, done right.
problemas com o javascript
Ausência de suporte para Javascript
Não é bookmarkable
Boas notícias: tudo isto é evitável.
Quebra o histórico (retroceder, avançar)
Acessibilidade: navegação por teclado
Usabilidade: controlar a abertura dum link
30. SAPO Sessions #2 javascript, done right.
Degradação Graciosa vs. Melhoramento Progressivo
Graceful Degradation Progressive Enhancement
Mostram‐se versões
alternativas no caso do
cliente não suportar todas
as tecnologias utilizadas.
31. SAPO Sessions #2 javascript, done right.
Degradação Graciosa vs. Melhoramento Progressivo
Graceful Degradation Progressive Enhancement
Exemplos:
<img src=”foto.png” alt=”Fotografia”>
Mostram‐se versões
<noscript>
alternativas no caso do
<noframes>
cliente não suportar todas
as tecnologias utilizadas.
32. SAPO Sessions #2 javascript, done right.
Degradação Graciosa vs. Melhoramento Progressivo
Graceful Degradation Progressive Enhancement
Constrói‐se uma versão
base/usável duma
funcionalidade e melhora‐se
progressivamente.
33. SAPO Sessions #2 javascript, done right.
Degradação Graciosa vs. Melhoramento Progressivo
Graceful Degradation Progressive Enhancement
Exemplos:
Constrói‐se uma versão
Substitução de Imagens por CSS
base/usável duma
Javascript Não Obstrutivo
funcionalidade e melhora‐se
progressivamente.
34. SAPO Sessions #2 javascript, done right.
Degradação Graciosa vs. Melhoramento Progressivo
Graceful Degradation Progressive Enhancement
Exemplos:
Melhorar
Constrói‐se uma versão
Substitução de Imagens por CSS
progressivamente!
base/usável duma
Javascript Não Obstrutivo
funcionalidade e melhora‐se
progressivamente.
36. SAPO Sessions #2 javascript, done right.
javascript não obstrutivo
37. SAPO Sessions #2 javascript, done right.
obstrutivo: adj.
que causa obstrução;
que serve para obstruir.
Funny story: não foi possível colocar o link directo para “obstrutivo” pq a priberam usa JS
obstrutivo.
38. SAPO Sessions #2 javascript, done right.
obstrutivo: adj.
que causa obstrução;
que serve para obstruir.
fonte: Priberam
http://priberam.pt/dlpo/
FAIL
Funny story: não foi possível colocar o link directo para “obstrutivo” pq a priberam usa JS
obstrutivo.
39. SAPO Sessions #2 javascript, done right.
javascript não obstrutivo
Mas como?
40. SAPO Sessions #2 javascript, done right.
javascript não obstrutivo
Revisão da matéria dada: Camadas de Separação
Conteúdo
HTML
Comportamento
Apresentação
JAVASCRIPT
CSS
41. SAPO Sessions #2 javascript, done right.
javascript não obstrutivo
Revisão da matéria dada: Camadas de Separação
/whatever.php
Conteúdo
HTML
/css/style.css /js/whatever.js
Comportamento
Apresentação
JAVASCRIPT
CSS
42. SAPO Sessions #2 javascript, done right.
javascript não obstrutivo
Revisão da matéria dada: Camadas de Separação
/whatever.php
Não misturar
Conteúdo
tecnologias.
HTML
/css/style.css /js/whatever.js
Comportamento
Apresentação
JAVASCRIPT
CSS
Loose coupling FTW!!
43. SAPO Sessions #2 javascript, done right.
javascript não obstrutivo
Revisão da matéria dada: Carregamento e Eventos
HTML
onDomReady / domContentLoaded
CSS JAVASCRIPT
MEDIA
window.onLoad
DOMContentLoaded no HTML5
44. SAPO Sessions #2 javascript, done right.
javascript não obstrutivo
Quão importante é um mero link?
-------50%------
45. SAPO Sessions #2 javascript, done right.
Vannevar Bush
1945: propôs o Memex, um computador teórico que em vez de ordenar informação
alfabeticamente, usava associações entre documentos. Inspirou a criação do conceito de
hipertexto. Artigo: As We May Think.
46. SAPO Sessions #2 javascript, done right.
Ted Nelson
1960: Fundou projecto Xanadu, definiu o conceito de Hipertexto. Apesar do seu conceito ser
um pouco mais completo, xanadu falhou. (links que se quebram nem gestão de versões, na
WWW do TBL)
47. SAPO Sessions #2 javascript, done right.
Douglas Engelbart
1963: NLS (oNLine System), que utilizava ligações (links) do conceito do hipertexto.
48. SAPO Sessions #2 javascript, done right.
Tim Berners‐Lee
tanaka
1991: WWW, num lab do CERN.
49. SAPO Sessions #2 javascript, done right.
javascript não obstrutivo
Remover obstruções
<a href=”javascript:show(
‘wonderbra.png’, ...
FAIL
Link sem href = big no no.
Motores de busca não seguem.
Não há JS, não há link. Não tem de ser assim...
50. SAPO Sessions #2 javascript, done right.
javascript não obstrutivo
Remover obstruções
<a href=”#” onclick=”show(
‘wonderbra.png’, ...
FAIL
Ainda assim...
Está a definir um handler por Javascript... mas não tem href.
AVISO: Sempre que escreverem “#”. YOU’RE DOIN’ IT WRONG!
51. SAPO Sessions #2 javascript, done right.
javascript não obstrutivo
Remover obstruções
<a href=”#” onclick=”show(
‘wonderbra.png’, ...
FAIL
Ainda assim...
I CAN HAZ CHEEZBURGER
http://whit.me/doinitwrong
Está a definir um handler por Javascript... mas não tem href.
AVISO: Sempre que escreverem “#”. YOU’RE DOIN’ IT WRONG!
52. SAPO Sessions #2 javascript, done right.
javascript não obstrutivo
Remover obstruções
<a href=”wonderbra.png”
onclick=”show(‘wonderbra.png’);
return false;”>...
menos mau
Já tem href.
ATENÇÃO: return false; impede o browser de seguir o href=
Mas... javascript inline é má idea.
53. SAPO Sessions #2 javascript, done right.
javascript não obstrutivo
Remover obstruções
<a href=”wonderbra.png”
onclick=”show(this.href);
return false;”>...
menos mau
DRY - don’t repeat yourself. ;)
54. SAPO Sessions #2 javascript, done right.
javascript não obstrutivo
Remover obstruções
<a href=”wonderbra.png”
class=”preview”
>...
melhor
55. SAPO Sessions #2 javascript, done right.
javascript não obstrutivo
Remover obstruções
meanwhile...
in a js file not
far from there
var prevs =
document.getElementsByClassName(‘preview’);
for (var i=0,len=prevs.length;i<len;i++) {
prevs[i].addEventListener (‘click’, show);
prevs[i].onclick = ‘return false’;
}
56. SAPO Sessions #2 javascript, done right.
javascript não obstrutivo
Remover obstruções
meanwhile...
in a js file not
far from there
var prevs =
document.getElementsByClassName(‘preview’);
for (var i=0,len=prevs.length;i<len;i++) {
prevs[i].addEventListener (‘click’, show);
prevs[i].onclick = ‘return false’;
}
In your dreams,
sucker!
57. SAPO Sessions #2 javascript, done right.
javascript não obstrutivo
Remover obstruções
Frameworks ajudam a lidar com as
incoerências dos browsers
62. SAPO Sessions #2 javascript, done right.
javascript não obstrutivo
Exemplo Lightbox http://www.lokeshdhakar.com/projects/lightbox2/
Fonte das imagens: http://brunoluis.com
63. SAPO Sessions #2 javascript, done right.
javascript não obstrutivo
Exemplo Lightbox
Links para as imagens: href=”wonderbra.jpg”
1
on dom:loaded, procurar links com rel=”lightbox”
2
Definir funções para mostrar o Loading... e carregar
3
imagem dentro da página
Cancelar a acção de “click” para o browser não seguir o
4
que está no href.
64. SAPO Sessions #2 javascript, done right.
javascript não obstrutivo
Exemplo Lightbox
<a href=”wonderbra.jpg” rel=”lightbox”>
1
a[rel=lightbox] todos os links com atributo rel=lightbox
2
addEventListener (w3c) / attachEvent (IE)
3
return false;
4
65. SAPO Sessions #2 javascript, done right.
javascript não obstrutivo
E formulários?
71. SAPO Sessions #2 javascript, done right.
javascript não obstrutivo
Mais aplicações:
Ecrãs de registo, transformar link
“Termos e condições” num overlay.
Reconhecer microformatos e inserir links
para as transformações.
73. SAPO Sessions #2 javascript, done right.
javascript não obstrutivo
AJAX
!
W
PO
KA
74. SAPO Sessions #2 javascript, done right.
javascript não obstrutivo
HIJAX
by Jeremy Keith
Construir um site que utilize links e formulários
1
tradicionais. Sem recurso a javascript.
Entrar no DOM, definir eventListeners para os eventos certos e
2
substituir os carregamentos de páginas completas por pequenos
pedidos AJAX.
75. SAPO Sessions #2 javascript, done right.
javascript não obstrutivo
HIJAX
by Jeremy Keith
Planear para o AJAX desde as wireframes.
1
Implementá‐lo no final.
2
76. SAPO Sessions #2 javascript, done right.
javascript não obstrutivo
HIJAX
by Jeremy Keith
Mais info, no blog DomScripting.org
http://whit.me/hijax
77. SAPO Sessions #2 javascript, done right.
javascript não obstrutivo
http://unobtrusify.com
Jeremy Keith: Behavioral Separation
78. SAPO Sessions #2 javascript, done right.
javascript não obstrutivo
Behavioral Separation, by Jeremy Keith
http://whit.me/behavsep
1. Começar com o conteúdo
2. Darlhe estrutura com html semântico
3. Aplicar css
4. Aplicar comportamento com JS
A LIST APART.
86. SAPO Sessions #2 javascript, done right.
Histórico em Webapps
Quebra o histórico (retroceder, avançar)
Não oferece, de origem, mecanismos para guardar o histórico
Alterar o location.href.hash
1
Verificar se o location.href.hash mudou e
2
lidar com essa mudança
87. SAPO Sessions #2 javascript, done right.
Histórico em Webapps
Quebra o histórico (retroceder, avançar)
Não oferece, de origem, mecanismos para guardar o histórico
Alterar o location.href.hash
1
Verificar se o location.href.hash mudou e
2
lidar com essa mudança
Inconsistências de browsers *cof*IE*cof*
3
http://developer.yahoo.com/yui/history/
IE = usar uma iframe, ir alterando a SRC.