SlideShare uma empresa Scribd logo
Desenvolvendo com Dojo Toolkit
Desenvolvendo
com Dojo Toolkit




Palestrante: Flávio Gomes da Silva Lisboa
Desenvolvendo com Dojo Toolkit


Agenda


▶Situando-se no contexto Javascript
▶Apresentação ampla do Dojo Toolkit
▶Introdução a programação com alguns exemplos




          Desenvolvendo com Dojo Toolkit
Brevíssima Introdução ao Javascript




  Desenvolvendo com Dojo Toolkit
Javascript




Desenvolvendo com Dojo Toolkit
Javascript




Programação Orientada a Aspectos em PHP
Javascript




Desenvolvendo com Dojo Toolkit
Javascript




Programação Orientada a Aspectos em PHP
JAVASCRIPT




<script type="text/javascript"></script>




      Programação Orientada a Aspectos em PHP
JAVASCRIPT


Javascript é A linguagem de scripting
da Web.

É utilizada em bilhões de páginas Web
para adicionar funcionalidades, validar
formulários, estabelecer comunicação
com o servidor e muitas outras coisas.


     Programação Orientada a Aspectos em PHP
v
                 JAVASCRIPT

Graças ao Javascript, as páginas
HTML puderam ganhar um
comportamento que ia além do
redirecionamento baseado em
hyperlinks. Era possível responder a
eventos provocados pelo usuário, sem
a necessidade de enviar uma
requisição ao servidor.


    Programação Orientada a Aspectos em PHP
JAVASCRIPT


Javascript é baseada em uma
especificação aberta (ECMA-262).
Embora outras linguagens tenham
surgido, ela se firmou como padrão de
scripting para cliente Web.



     Programação Orientada a Aspectos em PHP
JAVASCRIPT




FATO. Existe muito código Javascript
disponível.




     Programação Orientada a Aspectos em PHP
JAVASCRIPT


É fácil copiar e colar.
E também é muito fácil perder o
controle sobre o código.




     Programação Orientada a Aspectos em PHP
Programação Orientada a Aspectos em PHP

 INÍCIO         COPIOU                  COLOU




                                                      SIM
                                    FUNCIONOU?              BELEZA!
TENTA DE NOVO!

                                                NÃO

POTE:
PROGRAMAÇÃO                           FERROU!
ORIENTADA A
TENTATIVA
JAVASCRIPT

Quando você perde o controle sobre o
código, você perde tempo. E quando
você perde tempo certamente não
ganha dinheiro.




    Programação Orientada a Aspectos em PHP
JAVASCRIPT



E onde entra o Dojo Toolkit?

O que é e por que deveríamos usá-lo?




     Programação Orientada a Aspectos em PHP
O que é?
O que é Dojo Toolkit?
●   É uma “caixa de ferramentas” livre e aberta para
    DHTML escrita em Javascript.
    ●   Ou seja, é um conjunto de bibliotecas Javascript.
●   Pretende resolver problemas históricos com DHTML.
    ●   Como a incompatibilidade entre browsers.
●   Permite que você atribua capacidades dinâmicas em
    páginas Web facilmente.
    ●   Widgets
    ●   Animações
Por que Dojo Toolkit?
●   Você pode usar Dojo para tornar suas aplicações Web
    mais usáveis, responsivas e funcionais.
    ●   Ele suporta AJAX.
●   Dojo provê muitas facilidades
    ●   Ele esconde o processamento de XMLHttpRequest
    ●   Ele manipula as incompatibilidades entre browsers
●   Dojo tem uma comunidade de desenvolvedores forte
Arquitetura
Bibliotecas Dojo Toolkit



                       Seus
dijit      dojox
                      widgets


           core                 util

           base
Dojo Base

<html>
<head>
<title>Hello, Dojo</title>
<!-- load Dojo from [webroot]/js: -->
<script type="text/javascript"
src="/js/dojo/dojo.js">
</script>
</head>
<body>
</body>
</html>
Dojo Base

<html>
<head>
<title>Hello, Dojo</title>
<!-- load Dojo from Google -->
<script
src="http://ajax.googleapis.com/ajax/libs/dojo/1.6.1/doj
o/dojo.xd.js" type="text/javascript"></script>
</head>
<body>
</body>
</html>
Dojo Base

<html>
<head>
<title>Hello, Dojo</title>
<!-- load Dojo from Yandex -->
<script
src="http://yandex.st/dojo/1.6.1/dojo/dojo.xd.
js" type="text/javascript"></script>
</head>
<body>
</body>
</html>
dojo.js: 31k de diversão
●   Ajax: dojo.xhr, dojo.xhrGet, dojo.xhrPost ...
●   Eventos: normalization, keys, Objects or Nodes
●   DOM/CSS: dojo.byId, dojo.style, dojo.place, dojo.attr
●   Animação: dojo.fadeIn/Out, dojo.animateProperty
●   Query/NodeList: Seletores CSS3 ou todas as anteriores.
●   Javascript Avançado: dojo.delegate (OMAC), .hitch (IoC?), .partial
    (mutant signature?), .exists ...
●   dojo.declare
●   Javascript Nativo: forEach, map, filter, some, every, indexOf ...
●   Browser Sniffing: dojo.isIE < 7, isFF, isWebKit ...
Padrões em Dojo

// style and add class to a node:
dojo.addClass(“someNode”, “someClass”);
dojo.style(“someNode”, { opacity:0.5, lineHeight:”1.3em” });
dojo.attr(“someNode”, { id:”newId” });
// or chained
dojo.query(“#someNode”)
.addClass(“someClass”)
.attr({ id:”newId” })
.style({ opacity:0.5, lineHeight:”1.3em” })
// connect:
dojo.connect(dojo.byId(“foo”), “onclick”, function(e){...});
// or connect:
dojo.query(“#foo”).connect(“onclick”, function(e){ ... });
// or sugar:
dojo.query(“#foo”).onclick(function(e){ ... });
OO Simples, Herança Simulada
dojo.declare(“some.Person”, null, {
name: ”default”,
constructor: function(args){
dojo.mixin(this, args);
}
});
dojo.declare(“some.Employee”, some.Person, {
employeeId: 0
});
var bob = new some.Person({ name:”Bob Bobson” });
var joy = new some.Employee({ name:”Joy”, employeeId:24 });
E mais...
●Localizado:
 ● dojo.require(“dojo.io.script”);

 ● dojo.require(“my.Widget”);

●Robusto:

 ● dojo.registerModulePath(“external”, “/external/js”);

 ● dojo.require(“external.Thinger”);

●Fácil:

 ● dojo.provide(“my.Widget”);

●Pronto: dojo.ready, dojo.addOnLoad, .addOnUnLoad ...




    Sistema de pacotes == código modular
    Trabalhe com Dojo e customize seu código
Dojo Core
●Use à vontate (self-service) – tudo é aditivo.
●Sem rastreamento de dependências – apenas

dojo.require(“algumacoisa”)
●Poucas, se existem, “regras”

●Escala: Cresça de acordo com suas necessidades
Viva uma vida mais feliz com
              require
●dojo.data – API unificada de dados
●dojo.dnd - API de Drag and Drop

●dojo.fx / dojo.NodeList-fx – FX avançado adicional

●dojo.i18n – Ferramentas de internacionalização

●dojo.string, dojo.date, dojo.regexp – utilitários comuns

●dojo.io.iframe, dojo.io.script, dojo.rpc - IO avançada

●... mais: dojo.behavior, dojo.html, dojo.gears,

●dojo.cookie, dojo.parser, dojo.jaxer ...
Dijit – The Dojo Widget
             Framework
●Comportamento compartimentalizado utilizando
marcação existente (como <div></div>)
●Totalmente dinâmico. Componentes reutilizáveis

baseados em templates
●Estenda os existentes ou crie os seus ...
Inclui uma suíte de widgets
●Layouts – Painéis, Caixas...
●Formulário - Validação e mais ...

●Editor WYSIWYG

●Árvore, Sliders, Barra de progresso, ...
Inclui uma suíte de widgets
●Layouts – Painéis, Caixas...
●Formulário - Validação e mais ...

●Editor WYSIWYG

●Árvore, Sliders, Barra de progresso, ...
Configurar é fácil

<html>
<head>
<title>index.html</title>
<!-- some css -->
<link rel="stylesheet"
href="/fwks/js/dijit/themes/tundra/tundra.css">
<script type="text/javascript"
src="/fwks/js/dojo/dojo.js"></script>
</head>
<body class="tundra">
</body>
</html>
A instanciação é flexível
<script type="text/javascript">
dojo.ready(function(){
//load the resource:
dojo.require("dijit.dijit"); // Base Dijit
dojo.require("dijit.Dialog"); // Dialog Code
// create programatically:
var myDialog = new dijit.Dialog({
title:"Login",
}, "formArea");
// access the instance:
dijit.byId("formArea").show(); //
myDialog.show();
});
</script>
CDS: CSS Driven Skinning

Três temas completos:
●Tundra

●Soria

●Nihilo

Complementamente customizáveis
Suporte a
internacionalização
Suporte a acessibilidade
● Suporte a leitor de tela
● Suporte a modo de alto

  contraste
● Navegação por teclado


● … com qualquer Dijit
Mais informações

www.dojotoolkit.org
Referências
●   Dojo: 0 to Production. Peter Higgins. SpringOne Americas. 2008
●   Introduction to Dojo Toolkit. Sun Microsystems.




                www.fgsl.eti.br
                   @fgsl

Mais conteúdo relacionado

Mais procurados

Palestra Dojo Toolkit Consegi 2011
Palestra Dojo Toolkit Consegi 2011Palestra Dojo Toolkit Consegi 2011
Palestra Dojo Toolkit Consegi 2011
Flávio Lisboa
 
Desenvolvimento de Módulos Divi Builder
Desenvolvimento de Módulos Divi BuilderDesenvolvimento de Módulos Divi Builder
Desenvolvimento de Módulos Divi Builder
Daniel Paz
 
Groovy stack
Groovy stackGroovy stack
Groovy stack
Leonardo Silva
 
Jclouds jug vale
Jclouds jug valeJclouds jug vale
Jclouds jug vale
Eclis Rodrigues de Castilho
 
JavaFX 2
JavaFX 2JavaFX 2
JavaFX 2
jesuinoPower
 
Mean Stack
Mean StackMean Stack
Mean Stack
Bruno Catão
 
Aula javascript
Aula  javascriptAula  javascript
Aula javascript
Gabriel Moura
 
Minicurso - Desenvolvendo aplicações web com JavaScript e AngularJS - Estácio...
Minicurso - Desenvolvendo aplicações web com JavaScript e AngularJS - Estácio...Minicurso - Desenvolvendo aplicações web com JavaScript e AngularJS - Estácio...
Minicurso - Desenvolvendo aplicações web com JavaScript e AngularJS - Estácio...
Rodrigo Branas
 
Javascript Orientado a Objetos - Fisl12
Javascript Orientado a Objetos - Fisl12Javascript Orientado a Objetos - Fisl12
Javascript Orientado a Objetos - Fisl12
Emerson Macedo
 
Criando websites a jato com Django
Criando websites a jato com DjangoCriando websites a jato com Django
Criando websites a jato com Django
Marcos Petry
 
Grails
GrailsGrails
Grails
Alex Guido
 
Desenvolvimento Front end (AngularJS e Bootstrap)
Desenvolvimento Front end (AngularJS e Bootstrap)Desenvolvimento Front end (AngularJS e Bootstrap)
Desenvolvimento Front end (AngularJS e Bootstrap)
Julian Cesar
 
Construindo Sistemas Com Django
Construindo Sistemas Com DjangoConstruindo Sistemas Com Django
Construindo Sistemas Com Django
Marinho Brandão
 
Curso de Desenvolvimento Web - Módulo 03 - JavaScript
Curso de Desenvolvimento Web - Módulo 03 - JavaScriptCurso de Desenvolvimento Web - Módulo 03 - JavaScript
Curso de Desenvolvimento Web - Módulo 03 - JavaScript
Rodrigo Bueno Santa Maria, BS, MBA
 
Aula 07 acessibilidade
Aula 07  acessibilidadeAula 07  acessibilidade
Aula 07 acessibilidade
Cristiano Pires Martins
 
Joomla! do desktop ao datacenter
Joomla! do desktop ao datacenterJoomla! do desktop ao datacenter
Joomla! do desktop ao datacenter
Paulino Michelazzo
 
Django para desenvolvimento web; porque ser repetitivo é chato.
Django para desenvolvimento web; porque ser repetitivo é chato.Django para desenvolvimento web; porque ser repetitivo é chato.
Django para desenvolvimento web; porque ser repetitivo é chato.
Arthur Furlan
 
HTTP, JSON, REST e AJAX com AngularJS
HTTP, JSON, REST e AJAX com AngularJSHTTP, JSON, REST e AJAX com AngularJS
HTTP, JSON, REST e AJAX com AngularJS
Rodrigo Branas
 
Introdução ao desenvolvimento de aplicações web
Introdução ao desenvolvimento de aplicações webIntrodução ao desenvolvimento de aplicações web
Introdução ao desenvolvimento de aplicações web
Rodrigo Branas
 
Drupal Performance - Dicas e técnicas para levar seu Drupal às nuvens
Drupal Performance - Dicas e técnicas para levar seu Drupal às nuvensDrupal Performance - Dicas e técnicas para levar seu Drupal às nuvens
Drupal Performance - Dicas e técnicas para levar seu Drupal às nuvens
Paulino Michelazzo
 

Mais procurados (20)

Palestra Dojo Toolkit Consegi 2011
Palestra Dojo Toolkit Consegi 2011Palestra Dojo Toolkit Consegi 2011
Palestra Dojo Toolkit Consegi 2011
 
Desenvolvimento de Módulos Divi Builder
Desenvolvimento de Módulos Divi BuilderDesenvolvimento de Módulos Divi Builder
Desenvolvimento de Módulos Divi Builder
 
Groovy stack
Groovy stackGroovy stack
Groovy stack
 
Jclouds jug vale
Jclouds jug valeJclouds jug vale
Jclouds jug vale
 
JavaFX 2
JavaFX 2JavaFX 2
JavaFX 2
 
Mean Stack
Mean StackMean Stack
Mean Stack
 
Aula javascript
Aula  javascriptAula  javascript
Aula javascript
 
Minicurso - Desenvolvendo aplicações web com JavaScript e AngularJS - Estácio...
Minicurso - Desenvolvendo aplicações web com JavaScript e AngularJS - Estácio...Minicurso - Desenvolvendo aplicações web com JavaScript e AngularJS - Estácio...
Minicurso - Desenvolvendo aplicações web com JavaScript e AngularJS - Estácio...
 
Javascript Orientado a Objetos - Fisl12
Javascript Orientado a Objetos - Fisl12Javascript Orientado a Objetos - Fisl12
Javascript Orientado a Objetos - Fisl12
 
Criando websites a jato com Django
Criando websites a jato com DjangoCriando websites a jato com Django
Criando websites a jato com Django
 
Grails
GrailsGrails
Grails
 
Desenvolvimento Front end (AngularJS e Bootstrap)
Desenvolvimento Front end (AngularJS e Bootstrap)Desenvolvimento Front end (AngularJS e Bootstrap)
Desenvolvimento Front end (AngularJS e Bootstrap)
 
Construindo Sistemas Com Django
Construindo Sistemas Com DjangoConstruindo Sistemas Com Django
Construindo Sistemas Com Django
 
Curso de Desenvolvimento Web - Módulo 03 - JavaScript
Curso de Desenvolvimento Web - Módulo 03 - JavaScriptCurso de Desenvolvimento Web - Módulo 03 - JavaScript
Curso de Desenvolvimento Web - Módulo 03 - JavaScript
 
Aula 07 acessibilidade
Aula 07  acessibilidadeAula 07  acessibilidade
Aula 07 acessibilidade
 
Joomla! do desktop ao datacenter
Joomla! do desktop ao datacenterJoomla! do desktop ao datacenter
Joomla! do desktop ao datacenter
 
Django para desenvolvimento web; porque ser repetitivo é chato.
Django para desenvolvimento web; porque ser repetitivo é chato.Django para desenvolvimento web; porque ser repetitivo é chato.
Django para desenvolvimento web; porque ser repetitivo é chato.
 
HTTP, JSON, REST e AJAX com AngularJS
HTTP, JSON, REST e AJAX com AngularJSHTTP, JSON, REST e AJAX com AngularJS
HTTP, JSON, REST e AJAX com AngularJS
 
Introdução ao desenvolvimento de aplicações web
Introdução ao desenvolvimento de aplicações webIntrodução ao desenvolvimento de aplicações web
Introdução ao desenvolvimento de aplicações web
 
Drupal Performance - Dicas e técnicas para levar seu Drupal às nuvens
Drupal Performance - Dicas e técnicas para levar seu Drupal às nuvensDrupal Performance - Dicas e técnicas para levar seu Drupal às nuvens
Drupal Performance - Dicas e técnicas para levar seu Drupal às nuvens
 

Semelhante a Desenvolvendo com Dojo Toolkit

Java Web Fácil com VRaptor
Java Web Fácil com VRaptorJava Web Fácil com VRaptor
Java Web Fácil com VRaptor
Frederico Maia Arantes
 
Introdução ao JavaFX
Introdução ao JavaFXIntrodução ao JavaFX
Introdução ao JavaFX
jesuinoPower
 
T03_LM3: Javascript (2013-2014)
T03_LM3: Javascript (2013-2014)T03_LM3: Javascript (2013-2014)
T03_LM3: Javascript (2013-2014)
Carlos Santos
 
Django
DjangoDjango
Django - Desenvolvimento web ágil com Python
Django - Desenvolvimento web ágil com PythonDjango - Desenvolvimento web ágil com Python
Django - Desenvolvimento web ágil com Python
Igor Sobreira
 
Desenvolvimento web - conceitos, tecnologia e tendências.
Desenvolvimento web - conceitos, tecnologia e tendências.Desenvolvimento web - conceitos, tecnologia e tendências.
Desenvolvimento web - conceitos, tecnologia e tendências.
Valmir Justo
 
Desenvolvimento Ágil com Grails.
Desenvolvimento Ágil com Grails.Desenvolvimento Ágil com Grails.
Desenvolvimento Ágil com Grails.
Alex Guido
 
jQuery
jQueryjQuery
jQuery
Bruno Cunha
 
jQuery
jQueryjQuery
jQuery
Bruno Cunha
 
Lab
LabLab
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 escalaTé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
Alexandre Tarifa
 
Workflow WordPress + JavaScript - WordCamp Rio
Workflow WordPress + JavaScript  - WordCamp RioWorkflow WordPress + JavaScript  - WordCamp Rio
Workflow WordPress + JavaScript - WordCamp Rio
Fellyph Cintra
 
JSF 2.0 e ScrumToys
JSF 2.0 e ScrumToysJSF 2.0 e ScrumToys
JSF 2.0 e ScrumToys
Dr. Spock
 
Programando para programadores: Desafios na evolução de um Framework
Programando para programadores: Desafios na evolução de um FrameworkProgramando para programadores: Desafios na evolução de um Framework
Programando para programadores: Desafios na evolução de um Framework
Pablo Dall'Oglio
 
Nadando em Dinheiro com jQuery
Nadando em Dinheiro com jQueryNadando em Dinheiro com jQuery
Nadando em Dinheiro com jQuery
Reinaldo Junior
 
Jquery - Apresentação e aplicação prática
Jquery - Apresentação e aplicação práticaJquery - Apresentação e aplicação prática
Jquery - Apresentação e aplicação prática
Teles Maciel
 
TDC2015 Porto Alegre - Interfaces ricas com Rails e React.JS
TDC2015  Porto Alegre - Interfaces ricas com Rails e React.JSTDC2015  Porto Alegre - Interfaces ricas com Rails e React.JS
TDC2015 Porto Alegre - Interfaces ricas com Rails e React.JS
Rodrigo Urubatan
 
Desenvolvimento Agil Com Doctrine Orm
Desenvolvimento Agil Com Doctrine OrmDesenvolvimento Agil Com Doctrine Orm
Desenvolvimento Agil Com Doctrine Orm
Guilherme Blanco
 
Descomplicando o JQuery - Introdução ao Framework
Descomplicando o JQuery - Introdução ao FrameworkDescomplicando o JQuery - Introdução ao Framework
Descomplicando o JQuery - Introdução ao Framework
Pablo Garrido
 
Jquery - Apresentação e aplicação prática
Jquery - Apresentação e aplicação práticaJquery - Apresentação e aplicação prática
Jquery - Apresentação e aplicação prática
Teles Maciel
 

Semelhante a Desenvolvendo com Dojo Toolkit (20)

Java Web Fácil com VRaptor
Java Web Fácil com VRaptorJava Web Fácil com VRaptor
Java Web Fácil com VRaptor
 
Introdução ao JavaFX
Introdução ao JavaFXIntrodução ao JavaFX
Introdução ao JavaFX
 
T03_LM3: Javascript (2013-2014)
T03_LM3: Javascript (2013-2014)T03_LM3: Javascript (2013-2014)
T03_LM3: Javascript (2013-2014)
 
Django
DjangoDjango
Django
 
Django - Desenvolvimento web ágil com Python
Django - Desenvolvimento web ágil com PythonDjango - Desenvolvimento web ágil com Python
Django - Desenvolvimento web ágil com Python
 
Desenvolvimento web - conceitos, tecnologia e tendências.
Desenvolvimento web - conceitos, tecnologia e tendências.Desenvolvimento web - conceitos, tecnologia e tendências.
Desenvolvimento web - conceitos, tecnologia e tendências.
 
Desenvolvimento Ágil com Grails.
Desenvolvimento Ágil com Grails.Desenvolvimento Ágil com Grails.
Desenvolvimento Ágil com Grails.
 
jQuery
jQueryjQuery
jQuery
 
jQuery
jQueryjQuery
jQuery
 
Lab
LabLab
Lab
 
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 escalaTé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
 
Workflow WordPress + JavaScript - WordCamp Rio
Workflow WordPress + JavaScript  - WordCamp RioWorkflow WordPress + JavaScript  - WordCamp Rio
Workflow WordPress + JavaScript - WordCamp Rio
 
JSF 2.0 e ScrumToys
JSF 2.0 e ScrumToysJSF 2.0 e ScrumToys
JSF 2.0 e ScrumToys
 
Programando para programadores: Desafios na evolução de um Framework
Programando para programadores: Desafios na evolução de um FrameworkProgramando para programadores: Desafios na evolução de um Framework
Programando para programadores: Desafios na evolução de um Framework
 
Nadando em Dinheiro com jQuery
Nadando em Dinheiro com jQueryNadando em Dinheiro com jQuery
Nadando em Dinheiro com jQuery
 
Jquery - Apresentação e aplicação prática
Jquery - Apresentação e aplicação práticaJquery - Apresentação e aplicação prática
Jquery - Apresentação e aplicação prática
 
TDC2015 Porto Alegre - Interfaces ricas com Rails e React.JS
TDC2015  Porto Alegre - Interfaces ricas com Rails e React.JSTDC2015  Porto Alegre - Interfaces ricas com Rails e React.JS
TDC2015 Porto Alegre - Interfaces ricas com Rails e React.JS
 
Desenvolvimento Agil Com Doctrine Orm
Desenvolvimento Agil Com Doctrine OrmDesenvolvimento Agil Com Doctrine Orm
Desenvolvimento Agil Com Doctrine Orm
 
Descomplicando o JQuery - Introdução ao Framework
Descomplicando o JQuery - Introdução ao FrameworkDescomplicando o JQuery - Introdução ao Framework
Descomplicando o JQuery - Introdução ao Framework
 
Jquery - Apresentação e aplicação prática
Jquery - Apresentação e aplicação práticaJquery - Apresentação e aplicação prática
Jquery - Apresentação e aplicação prática
 

Mais de Flávio Lisboa

Criando testes integrados de APIs com PHP
Criando testes integrados de APIs com PHPCriando testes integrados de APIs com PHP
Criando testes integrados de APIs com PHP
Flávio Lisboa
 
Cooperativas de Software Livre: Uma comparação entre Brasil e Argentina
Cooperativas de Software Livre: Uma comparação entre Brasil e ArgentinaCooperativas de Software Livre: Uma comparação entre Brasil e Argentina
Cooperativas de Software Livre: Uma comparação entre Brasil e Argentina
Flávio Lisboa
 
Aprenda a afiar suas garras com Laminas
Aprenda a afiar suas garras com LaminasAprenda a afiar suas garras com Laminas
Aprenda a afiar suas garras com Laminas
Flávio Lisboa
 
Ciência e software livre: desenvolvendo com método
Ciência e software livre: desenvolvendo com métodoCiência e software livre: desenvolvendo com método
Ciência e software livre: desenvolvendo com método
Flávio Lisboa
 
Turbinando microsserviços em PHP
Turbinando microsserviços em PHPTurbinando microsserviços em PHP
Turbinando microsserviços em PHP
Flávio Lisboa
 
O que esperar do framework Laminas
O que esperar do framework LaminasO que esperar do framework Laminas
O que esperar do framework Laminas
Flávio Lisboa
 
PHP Conference Brazil - What can we expect about framework Laminas?
PHP Conference Brazil - What can we expect about framework Laminas?PHP Conference Brazil - What can we expect about framework Laminas?
PHP Conference Brazil - What can we expect about framework Laminas?
Flávio Lisboa
 
Algoritmos Genéticos em PHP - PHP Conference Brasil 2019
Algoritmos Genéticos em PHP - PHP Conference Brasil 2019Algoritmos Genéticos em PHP - PHP Conference Brasil 2019
Algoritmos Genéticos em PHP - PHP Conference Brasil 2019
Flávio Lisboa
 
Criando microsserviços em PHP
Criando microsserviços em PHPCriando microsserviços em PHP
Criando microsserviços em PHP
Flávio Lisboa
 
Como se tornar o pior programador PHP do mundo
Como se tornar o pior programador PHP do mundoComo se tornar o pior programador PHP do mundo
Como se tornar o pior programador PHP do mundo
Flávio Lisboa
 
A demanda da santa entrega Batman: bugs e gargalos em aplicações PHP
A demanda da santa entrega Batman: bugs e gargalos em aplicações PHPA demanda da santa entrega Batman: bugs e gargalos em aplicações PHP
A demanda da santa entrega Batman: bugs e gargalos em aplicações PHP
Flávio Lisboa
 
Comunicação e padrões em código aberto: quando convergente e divergente cooperam
Comunicação e padrões em código aberto: quando convergente e divergente cooperamComunicação e padrões em código aberto: quando convergente e divergente cooperam
Comunicação e padrões em código aberto: quando convergente e divergente cooperam
Flávio Lisboa
 
Criação de robôs em PHP para raspagem de dados
Criação de robôs em PHP para raspagem de dadosCriação de robôs em PHP para raspagem de dados
Criação de robôs em PHP para raspagem de dados
Flávio Lisboa
 
Amanhecer esmeralda
Amanhecer esmeraldaAmanhecer esmeralda
Amanhecer esmeralda
Flávio Lisboa
 
Estudo de Caso: Utilização de PHP no Serviço Federal de Processamento de Dados
Estudo de Caso: Utilização de PHP no Serviço Federal de Processamento de DadosEstudo de Caso: Utilização de PHP no Serviço Federal de Processamento de Dados
Estudo de Caso: Utilização de PHP no Serviço Federal de Processamento de Dados
Flávio Lisboa
 
Arquitetura PHP para um mundo orientado a microsserviços
Arquitetura PHP para um mundo orientado a microsserviçosArquitetura PHP para um mundo orientado a microsserviços
Arquitetura PHP para um mundo orientado a microsserviços
Flávio Lisboa
 
Semeando Liberdade: Como (e onde) o software livre inclui as pessoas
Semeando Liberdade: Como (e onde) o software livre inclui as pessoasSemeando Liberdade: Como (e onde) o software livre inclui as pessoas
Semeando Liberdade: Como (e onde) o software livre inclui as pessoas
Flávio Lisboa
 
O que é programação de computadores
O que é programação de computadoresO que é programação de computadores
O que é programação de computadores
Flávio Lisboa
 
Economia em rede (comunidade)
Economia em rede (comunidade)Economia em rede (comunidade)
Economia em rede (comunidade)
Flávio Lisboa
 
Aplicações Corporativas em PHP (CRM e ERP)
Aplicações Corporativas em PHP (CRM e ERP)Aplicações Corporativas em PHP (CRM e ERP)
Aplicações Corporativas em PHP (CRM e ERP)
Flávio Lisboa
 

Mais de Flávio Lisboa (20)

Criando testes integrados de APIs com PHP
Criando testes integrados de APIs com PHPCriando testes integrados de APIs com PHP
Criando testes integrados de APIs com PHP
 
Cooperativas de Software Livre: Uma comparação entre Brasil e Argentina
Cooperativas de Software Livre: Uma comparação entre Brasil e ArgentinaCooperativas de Software Livre: Uma comparação entre Brasil e Argentina
Cooperativas de Software Livre: Uma comparação entre Brasil e Argentina
 
Aprenda a afiar suas garras com Laminas
Aprenda a afiar suas garras com LaminasAprenda a afiar suas garras com Laminas
Aprenda a afiar suas garras com Laminas
 
Ciência e software livre: desenvolvendo com método
Ciência e software livre: desenvolvendo com métodoCiência e software livre: desenvolvendo com método
Ciência e software livre: desenvolvendo com método
 
Turbinando microsserviços em PHP
Turbinando microsserviços em PHPTurbinando microsserviços em PHP
Turbinando microsserviços em PHP
 
O que esperar do framework Laminas
O que esperar do framework LaminasO que esperar do framework Laminas
O que esperar do framework Laminas
 
PHP Conference Brazil - What can we expect about framework Laminas?
PHP Conference Brazil - What can we expect about framework Laminas?PHP Conference Brazil - What can we expect about framework Laminas?
PHP Conference Brazil - What can we expect about framework Laminas?
 
Algoritmos Genéticos em PHP - PHP Conference Brasil 2019
Algoritmos Genéticos em PHP - PHP Conference Brasil 2019Algoritmos Genéticos em PHP - PHP Conference Brasil 2019
Algoritmos Genéticos em PHP - PHP Conference Brasil 2019
 
Criando microsserviços em PHP
Criando microsserviços em PHPCriando microsserviços em PHP
Criando microsserviços em PHP
 
Como se tornar o pior programador PHP do mundo
Como se tornar o pior programador PHP do mundoComo se tornar o pior programador PHP do mundo
Como se tornar o pior programador PHP do mundo
 
A demanda da santa entrega Batman: bugs e gargalos em aplicações PHP
A demanda da santa entrega Batman: bugs e gargalos em aplicações PHPA demanda da santa entrega Batman: bugs e gargalos em aplicações PHP
A demanda da santa entrega Batman: bugs e gargalos em aplicações PHP
 
Comunicação e padrões em código aberto: quando convergente e divergente cooperam
Comunicação e padrões em código aberto: quando convergente e divergente cooperamComunicação e padrões em código aberto: quando convergente e divergente cooperam
Comunicação e padrões em código aberto: quando convergente e divergente cooperam
 
Criação de robôs em PHP para raspagem de dados
Criação de robôs em PHP para raspagem de dadosCriação de robôs em PHP para raspagem de dados
Criação de robôs em PHP para raspagem de dados
 
Amanhecer esmeralda
Amanhecer esmeraldaAmanhecer esmeralda
Amanhecer esmeralda
 
Estudo de Caso: Utilização de PHP no Serviço Federal de Processamento de Dados
Estudo de Caso: Utilização de PHP no Serviço Federal de Processamento de DadosEstudo de Caso: Utilização de PHP no Serviço Federal de Processamento de Dados
Estudo de Caso: Utilização de PHP no Serviço Federal de Processamento de Dados
 
Arquitetura PHP para um mundo orientado a microsserviços
Arquitetura PHP para um mundo orientado a microsserviçosArquitetura PHP para um mundo orientado a microsserviços
Arquitetura PHP para um mundo orientado a microsserviços
 
Semeando Liberdade: Como (e onde) o software livre inclui as pessoas
Semeando Liberdade: Como (e onde) o software livre inclui as pessoasSemeando Liberdade: Como (e onde) o software livre inclui as pessoas
Semeando Liberdade: Como (e onde) o software livre inclui as pessoas
 
O que é programação de computadores
O que é programação de computadoresO que é programação de computadores
O que é programação de computadores
 
Economia em rede (comunidade)
Economia em rede (comunidade)Economia em rede (comunidade)
Economia em rede (comunidade)
 
Aplicações Corporativas em PHP (CRM e ERP)
Aplicações Corporativas em PHP (CRM e ERP)Aplicações Corporativas em PHP (CRM e ERP)
Aplicações Corporativas em PHP (CRM e ERP)
 

Desenvolvendo com Dojo Toolkit

  • 2. Desenvolvendo com Dojo Toolkit Palestrante: Flávio Gomes da Silva Lisboa
  • 3. Desenvolvendo com Dojo Toolkit Agenda ▶Situando-se no contexto Javascript ▶Apresentação ampla do Dojo Toolkit ▶Introdução a programação com alguns exemplos Desenvolvendo com Dojo Toolkit
  • 4. Brevíssima Introdução ao Javascript Desenvolvendo com Dojo Toolkit
  • 9. JAVASCRIPT <script type="text/javascript"></script> Programação Orientada a Aspectos em PHP
  • 10. JAVASCRIPT Javascript é A linguagem de scripting da Web. É utilizada em bilhões de páginas Web para adicionar funcionalidades, validar formulários, estabelecer comunicação com o servidor e muitas outras coisas. Programação Orientada a Aspectos em PHP
  • 11. v JAVASCRIPT Graças ao Javascript, as páginas HTML puderam ganhar um comportamento que ia além do redirecionamento baseado em hyperlinks. Era possível responder a eventos provocados pelo usuário, sem a necessidade de enviar uma requisição ao servidor. Programação Orientada a Aspectos em PHP
  • 12. JAVASCRIPT Javascript é baseada em uma especificação aberta (ECMA-262). Embora outras linguagens tenham surgido, ela se firmou como padrão de scripting para cliente Web. Programação Orientada a Aspectos em PHP
  • 13. JAVASCRIPT FATO. Existe muito código Javascript disponível. Programação Orientada a Aspectos em PHP
  • 14. JAVASCRIPT É fácil copiar e colar. E também é muito fácil perder o controle sobre o código. Programação Orientada a Aspectos em PHP
  • 15. Programação Orientada a Aspectos em PHP INÍCIO COPIOU COLOU SIM FUNCIONOU? BELEZA! TENTA DE NOVO! NÃO POTE: PROGRAMAÇÃO FERROU! ORIENTADA A TENTATIVA
  • 16. JAVASCRIPT Quando você perde o controle sobre o código, você perde tempo. E quando você perde tempo certamente não ganha dinheiro. Programação Orientada a Aspectos em PHP
  • 17. JAVASCRIPT E onde entra o Dojo Toolkit? O que é e por que deveríamos usá-lo? Programação Orientada a Aspectos em PHP
  • 19. O que é Dojo Toolkit? ● É uma “caixa de ferramentas” livre e aberta para DHTML escrita em Javascript. ● Ou seja, é um conjunto de bibliotecas Javascript. ● Pretende resolver problemas históricos com DHTML. ● Como a incompatibilidade entre browsers. ● Permite que você atribua capacidades dinâmicas em páginas Web facilmente. ● Widgets ● Animações
  • 20. Por que Dojo Toolkit? ● Você pode usar Dojo para tornar suas aplicações Web mais usáveis, responsivas e funcionais. ● Ele suporta AJAX. ● Dojo provê muitas facilidades ● Ele esconde o processamento de XMLHttpRequest ● Ele manipula as incompatibilidades entre browsers ● Dojo tem uma comunidade de desenvolvedores forte
  • 22. Bibliotecas Dojo Toolkit Seus dijit dojox widgets core util base
  • 23. Dojo Base <html> <head> <title>Hello, Dojo</title> <!-- load Dojo from [webroot]/js: --> <script type="text/javascript" src="/js/dojo/dojo.js"> </script> </head> <body> </body> </html>
  • 24. Dojo Base <html> <head> <title>Hello, Dojo</title> <!-- load Dojo from Google --> <script src="http://ajax.googleapis.com/ajax/libs/dojo/1.6.1/doj o/dojo.xd.js" type="text/javascript"></script> </head> <body> </body> </html>
  • 25. Dojo Base <html> <head> <title>Hello, Dojo</title> <!-- load Dojo from Yandex --> <script src="http://yandex.st/dojo/1.6.1/dojo/dojo.xd. js" type="text/javascript"></script> </head> <body> </body> </html>
  • 26. dojo.js: 31k de diversão ● Ajax: dojo.xhr, dojo.xhrGet, dojo.xhrPost ... ● Eventos: normalization, keys, Objects or Nodes ● DOM/CSS: dojo.byId, dojo.style, dojo.place, dojo.attr ● Animação: dojo.fadeIn/Out, dojo.animateProperty ● Query/NodeList: Seletores CSS3 ou todas as anteriores. ● Javascript Avançado: dojo.delegate (OMAC), .hitch (IoC?), .partial (mutant signature?), .exists ... ● dojo.declare ● Javascript Nativo: forEach, map, filter, some, every, indexOf ... ● Browser Sniffing: dojo.isIE < 7, isFF, isWebKit ...
  • 27. Padrões em Dojo // style and add class to a node: dojo.addClass(“someNode”, “someClass”); dojo.style(“someNode”, { opacity:0.5, lineHeight:”1.3em” }); dojo.attr(“someNode”, { id:”newId” }); // or chained dojo.query(“#someNode”) .addClass(“someClass”) .attr({ id:”newId” }) .style({ opacity:0.5, lineHeight:”1.3em” }) // connect: dojo.connect(dojo.byId(“foo”), “onclick”, function(e){...}); // or connect: dojo.query(“#foo”).connect(“onclick”, function(e){ ... }); // or sugar: dojo.query(“#foo”).onclick(function(e){ ... });
  • 28. OO Simples, Herança Simulada dojo.declare(“some.Person”, null, { name: ”default”, constructor: function(args){ dojo.mixin(this, args); } }); dojo.declare(“some.Employee”, some.Person, { employeeId: 0 }); var bob = new some.Person({ name:”Bob Bobson” }); var joy = new some.Employee({ name:”Joy”, employeeId:24 });
  • 29. E mais... ●Localizado: ● dojo.require(“dojo.io.script”); ● dojo.require(“my.Widget”); ●Robusto: ● dojo.registerModulePath(“external”, “/external/js”); ● dojo.require(“external.Thinger”); ●Fácil: ● dojo.provide(“my.Widget”); ●Pronto: dojo.ready, dojo.addOnLoad, .addOnUnLoad ... Sistema de pacotes == código modular Trabalhe com Dojo e customize seu código
  • 30. Dojo Core ●Use à vontate (self-service) – tudo é aditivo. ●Sem rastreamento de dependências – apenas dojo.require(“algumacoisa”) ●Poucas, se existem, “regras” ●Escala: Cresça de acordo com suas necessidades
  • 31. Viva uma vida mais feliz com require ●dojo.data – API unificada de dados ●dojo.dnd - API de Drag and Drop ●dojo.fx / dojo.NodeList-fx – FX avançado adicional ●dojo.i18n – Ferramentas de internacionalização ●dojo.string, dojo.date, dojo.regexp – utilitários comuns ●dojo.io.iframe, dojo.io.script, dojo.rpc - IO avançada ●... mais: dojo.behavior, dojo.html, dojo.gears, ●dojo.cookie, dojo.parser, dojo.jaxer ...
  • 32. Dijit – The Dojo Widget Framework ●Comportamento compartimentalizado utilizando marcação existente (como <div></div>) ●Totalmente dinâmico. Componentes reutilizáveis baseados em templates ●Estenda os existentes ou crie os seus ...
  • 33. Inclui uma suíte de widgets ●Layouts – Painéis, Caixas... ●Formulário - Validação e mais ... ●Editor WYSIWYG ●Árvore, Sliders, Barra de progresso, ...
  • 34. Inclui uma suíte de widgets ●Layouts – Painéis, Caixas... ●Formulário - Validação e mais ... ●Editor WYSIWYG ●Árvore, Sliders, Barra de progresso, ...
  • 35. Configurar é fácil <html> <head> <title>index.html</title> <!-- some css --> <link rel="stylesheet" href="/fwks/js/dijit/themes/tundra/tundra.css"> <script type="text/javascript" src="/fwks/js/dojo/dojo.js"></script> </head> <body class="tundra"> </body> </html>
  • 36. A instanciação é flexível <script type="text/javascript"> dojo.ready(function(){ //load the resource: dojo.require("dijit.dijit"); // Base Dijit dojo.require("dijit.Dialog"); // Dialog Code // create programatically: var myDialog = new dijit.Dialog({ title:"Login", }, "formArea"); // access the instance: dijit.byId("formArea").show(); // myDialog.show(); }); </script>
  • 37. CDS: CSS Driven Skinning Três temas completos: ●Tundra ●Soria ●Nihilo Complementamente customizáveis
  • 39. Suporte a acessibilidade ● Suporte a leitor de tela ● Suporte a modo de alto contraste ● Navegação por teclado ● … com qualquer Dijit
  • 41. Referências ● Dojo: 0 to Production. Peter Higgins. SpringOne Americas. 2008 ● Introduction to Dojo Toolkit. Sun Microsystems. www.fgsl.eti.br @fgsl