Upload
valmir-justo
View
632
Download
3
Embed Size (px)
DESCRIPTION
O Desenvolvimento de Aplicações WEB nem sempre é uma tarefa trivial. Esta apresentação demonstra diversos conceitos, tecnologias e metodologias que são utilizadas em diversos projetos.
Citation preview
Conceitos, Tecnologia, Metodologia e Tendências
Desenvolvimento WEB
Valmir Justo
@justoeu
• Front-end
– HTML 5 e CSS 3: Por que devemos usar?
– Responsive Web Design! A tá, sei!
– Frameworks Responsivos, Balas!
• Linguagens e Frameworks
– Javascript: A linguagem que todo mundo “Manja”;
– NodeJS e seus Teclados!
– Java EE na atualidade.
• Arquitetura Enterprise
– Qual é o Real papel de um Arquiteto de Software?
– Qual é a diferença entre Arquitetura de Solução e
Corporativa?
– Pintando o 7 com os Desenhos de Arquitetura
Agenda
• Integração de Sistemas– Mundo SOA na atualidade
– SOAP ou Rest: Que tal os dois?
– WebSocket e Você, Tudo a ver.
• Metodologia Ágeis– Está na hora de pensar “Ágil”? As empresas
estão preparadas?
– Paradigmas do Scrum;
– Pensando diferente com Design Thinking
AgendaValmir Robson Justo
• Bacharel em Sistema de Informação/FGP
• Pós Graduado como Engenheiro de Componentes Reutilizáveis
• Desenvolvedor WEB e Java desde 2000
• Atualmente Sou Arquiteto SR na Capgemini Brasil
• Alguns Certificações
• Sun Certified Enterprise Architect for the Java Platform,Enterprise Edition 5 (I e II);
• Oracle Certified Professional, Java Platform, Enterprise Edition 6 Enterprise JavaBeans
Developer;
• Sun Certified Developer for Java Web Services 5;
• Sun Certified Java Business Component Developer Platform EE5
• Sun Certified Web Component Developer for J2EE 5;
• Sun Certified Programmer for Java 2 Platform 5;
• IBM Worklight Mobile Foundation Technical Sales Professional v1
• SCM - Certified ScrumMaster;
Front-end
HTML 5 e CSS 3
Por que devemos usar e
Por que NÓS devemos Aprender?
Quais são os Benefícios?
Os Browsers já estão suportando?
HTML 5 e CSS 3Por que devemos usar?
• Padronização;
• Criação de layout Ricos;
• Facilidade e organização no código;
• Nova estrutura de Elementos;
• Melhor aproveitamento dos Browsers na renderização das páginas;
• Consome menos processamento comparado ao Flash;
• Novos controles de Formulários;
• Conceitos Avançados para desenhos com Canvas;
• Novos padrões de cores, como HSL/A;
• Facilidade de criar Bordas arredondadas;
• Trabalhar com elementos em 3D;
• Recursos para trabalhar Off-line;
• Websockets e Geolocalização;
HTML 5 e CSS 3Benefícios
• Padronização: Usando elementos HTML5 , podemos aumentar o valor semântico da
página web como os códigos são muito padronizado;
• Mutualidade: Você não precisa mais dos plug-ins do Flash ou JS avançados para incluir
videos, gerar gráficos e animações entre outros recursos;
• Limpeza no Código: O HTML 5 fornece semânticas muito mais simples;
• Semântica melhoradas: Agora é fácil ver que partes da página são
cabeçalhos, NAV, rodapés, de lado, etc;
• Formulários Elegantes: HTML5 permite validação do formulário de forma Nativa
reduzindo expressiva o uso JavaScript;
• Consistência: Código estruturado, mais facilidade no entendimento e manutenção;
• Cache de aplicativo offline: Suporte a navegação offline;
• Armazenamento de Dados: O HTML 5 fornece o sessionStorage e localStorage que
permite armazenar dados estruturados temporariamente.
HTML 5 e CSS 3Suporte dos Browsers
*fonte: http://fmbip.com/litmus/
HTML 5 e CSS 3 Responsive Web Design
Responsive Web Design (Web Design Responsivo) é uma abordagem de web
design destinada a elaborar sites para fornecer uma ótima experiência de
visualização, fácil leitura e navegação com um mínimo de redimensionamento e
visionamento, para uma ampla gama de dispositivos (de monitores de computador
a telefones celulares);
…O Problema de entregar conteúdo em diversos formatos
O que importa não o tamanho da tela e sim a sua
RESOLUÇÃO
HTML 5 e CSS 3 Frameworks Responsivos
Bootstrap é um dos frameworks
mais populares para
desenvolvimento moderno
(front-end/UI). Ele possui 12
tipos de templates para layouts
prontos além de 13 plug-ins
para o JQuery.
HTML 5 e CSS 3 Frameworks Responsivos
Foundation, assim com o
Bootstrap é um framework para
construção de layouts
responsivos. Ele possui uma
gama de layout e
customizações para diversos
tipos de resoluções.
Um ponto interessante do
Foundation é a agilidade para
construir e customizar os
layouts.
Linguagens e Frameworks
JavascriptA Linguagem que todo mundo “Manja”
Segundo Dados do GIT:
• Linguagem dominante, 25% dos repositórios são de JavaScript;
• Node.JS é o segundo repositóriomais assistido;
• jQuery é o quarto repositório maisassistido;
• 16 dos 30 repositórios maisassistidos são puramente de JavaScript.
JavascriptAlguns dos Frameworks Javascript...
JavascriptOnde encontramos?
Javascript
Funciona com IE6+, smartphones recentes e até alguns antigos;
Utilizado por 41% dos 10 mil sites mais acessados do mundo;
14275 repositórios de plugins de jQuery no github;
Integrado com JSF, ASP.NET e Ruby on Rails
JavascriptJQuery
JAVASCRIPT PUROJQuery
Javascript
Modernizr é uma biblioteca JavaScript pequeno que detecta a disponibilidade deimplementações nativas para tecnologias web de próxima geração, ou seja, ascaracterísticas que resultam do HTML5 e CSS3 especificações.
Muitos desses recursos já estão implementados em pelo menos um navegadorprincipal (a maioria deles em duas ou mais), e que Modernizr faz é, muitosimplesmente, dizer se o navegador atual tem esse recurso nativamenteimplementado ou não.
Javascript
Backbone: Após dois anos e meio de
desenvolvimento, a versão 1.0 do
Backbone.js foi lançada. O Backbone.js é
uma popular biblioteca JavaScript que
segue o modelo Model/View, utilizada por
vários aplicativos web populares.
A premissa essencial no coração do
Backbone tem sido sempre encontrar e
descobrir o conjunto mínimo de primitivas
na estruturação de dados (Modelos e
Coleções) e de interface do usuário (Views
e URLs) que sejam úteis na construção de
aplicações web com JavaScript.
Rotas
Rotas View
Javascript
Como fornecer uma maneira fácil de criar programas de rede altamente escaláveis?
Pensando em Alto Volume de Acessos, Qual é o problema com os
programas que rodam nos servidor WEB atuais?
Vamos as contas:
Em linguagens como Java™ e PHP, cada conexão inicia um novo encadeamento
que, potencialmente, é acompanhado de 2 MB de memória. Em uma infra que
tenha 8 GB de RAM, nós vamos ter mais ou menos 4.000 usuários simultâneos, já
que é o máximo que o servidor poderia suportar. À medida que a base de clientes
cresce, a aplicatição Web para suportar mais usuários faz-se-necessário adicionar
mais servidores.
E o Custo disto?E manter esta infraestrutura?
Cloud Computing?
Javascript
Como fornecer uma maneira fácil de criar programas de rede altamente escaláveis?
• Node é um programa que roda nos servidores e utiliza o V8 JavaScript em sua
execução;
• O JavaScript no lado do servidor é um conceito relativamente novo, e há cerca de
dois anos, surgiu com o produto Aptana Jaxer, porém ganhou popularidade com o
NodeJS.
• O que é o V8? O V8 JavaScript é o mecanismo subjacente do JavaScript que o
Google crisou e usa em seu navegador Chrome. Esse mecanismo JavaScript
interpreta o código JS e o executa. Sendo assim, o V8, é um interpretador
ultrarrápido escrito em C++ que tem um aspecto exclusivo: é possível fazer o
download do mecanismo e integrá-lo em qualquer aplicativo que você desejar. Ele
não é restrito à execução em um navegador;
• Portanto, o Node, na verdade, usa o mecanismo V8 e o redireciona para uso no
servidor
• Até esta data, o Node apresenta 35 APIs para resolver diversos tipos de situação.
JavascriptNode APIs
Javascript
• Jasmine é um framework para testar código Javascript orientado
a comportamento;
• Ele não depende de quaisquer outros frameworks JavaScript;
• Possui um ambiente limpo, sintaxe simples para que você possa
facilmente escrever testes;
Javascript
Quantos Arquivos Javascripts, normalmente, um projeto WEB tem?
10? 20? 100?
… e saber de qual arquivo vem tal function???
… e manter esta estrutura?
… e evoluir não gerando efeitos colaterais..
Seus problemas ACABARAM!!!
RequireJS é um gestor de Módulos Javascript
Vantagens:
• Deixa Clara as dependências;
• Evita várias Globais;
• Ajuda a reduzir o Acoplamento;
• Carrega os Scripts Automáticamente
Modulo CounterModulo de Log
Main.js
Javascript
Desenvolver uma Aplicação exclusiva para cada plataforma utilizando os SDK
nativos ou criar uma Aplicação com um framework multiplataforma?
• Phonegap/ Cordova é uma tecnologia open source que tem como principal
característica desenvolver aplicativos webapp, que podem ser funcionais nos
ambientes online ou offline;
• Para suprir as necessidades das linguagens nativas de cada plataforma, ele utiliza
dos melhores padrões de web com o HTML5, CSS3 e o Javascript, tratando de
uma forma bastante simples o seu desenvolvimento;
• Com uma interface baseada em telas de HTML, a sua lógica de programação e os
seus recursos de dispositivos são tratados pelo Javascript tendo a possiblidade de
realizar combinações com diversos scripts. Estes são: Jquery, MooTools e XUI;
• O Phonegap/ Cordova abstrai o acesso nativa aos recursos do dispositivo através
da linguagem Javascript.
JAVAJEE – Java Enterprise Edition
• Que é JEE?
• Vantagens na utilização de um servidor JEE.
• Áreas de cobertura da JEE 6.
• Evolução da especificação.
• Desenvolvimento Moderno com o JEE
JAVAO Que é JEE – Java Enterprise Edition?
• Padrão para desenvolvimento de aplicações corporativas com Java.
• Controles comuns em aplicações corporativas: controle de transações, definição de
regras de segurança em aplicações, componentização, integração com outros
sistemas, entre outras.
• Tecnologias integradas, planejadas para prover uma experiência unificada para o
desenvolvedor: podemos trabalhar com componentes de interface juntamente com um
componente de negócio (EJB) que é injetado em um controlador intermediário, que por
sua vez está anotado com suas regras de segurança especificas.
• Define apenas as interfaces (o que deve ser feito) e as empresas implementam
(como é feito): A JEE define apenas a estrutura de interfaces e métodos, com base
nisso cada empresa que possui um servidor certificado JEE implementa essa
funcionalidade.
• A execução é realizada dentro de um servidor de aplicação JEE certificado pela
JCP: JBoss, Glassfish, WebSphere (IBM), Weblogic (Oracle).
JAVADesenvolvimento Moderno com JEE
*fonte: oracle.com.br
JAVAVantagens na utilização de um servidor JEE
• Padronização das operações: Aderindo aos padrões da JEE é possível ter
uma maior produtividade, pois as operações são feitas sempre seguindo os
mesmos passos;
• Aplicações independentes de servidor de aplicação (teoricamente): Na
teoria uma aplicação escrita utilizando somente as interfaces da JEE deve
rodar em qualquer servidor de aplicação;
• Menos código para infra-estrutura e maior foco no negócio: Geralmente as
empresas não querem ter o ônus de desenvolver toda a infra-estrutura de
controle de uma aplicação, é muito mais vantajoso utilizar uma arquitetura
definida por uma empresa que o foco dela é esse.
• Mão de obra especializada: Utilizando um padrão de mercado para o
desenvolvimento é sempre mais fácil encontrar profissionais que conheçam
essa arquitetura.
JAVAÁrea de Abrangência do JEE
Controle transacional: Controle de transações do usuário, a qual não se limita
apenas a banco de dados. É possível controlar uma transação completa que usa
mais de um banco de dados e até webservices de maneira atômica, ou seja, ou é
executado tudo ou nenhuma operação é confirmada.
Manipulação de XML: Bibliotecas para manipulação de XMLs, disponibilização
de objetos nesse formato, entre outras facilidades (JAXB).
Interação com banco de dados e mapeamento Objeto-Relacional: Controle
completo de ações com banco de dados. Utilização dos próprios objetos para
controlar ações de manutenção com o banco de dados.
Servlets / JSP / JSF: Disponiblização de paginas para web de maneira integrada
com os demais componentes. Disponibilização de componentes ricos para
interface web pelo JSF e bibliotecas que seguem sua especificação.
JAVAÁrea de Abrangência do JEE
Webservices: Disponibilização de métodos para outras aplicações, provendo
assim interoperabilidade entre aplicações de tecnologias distintas.
EJB (utilização dos serviços de forma simplificada): Enterprise Java Beans-
são componentes que são capazes de encapsular uma logica de negócio,
provendo sem muito esforço vários controles que teriam que ser feitos
manualmente, tais como controle de transação, controles de performance,
restrições de segurança, entre outras coisas.
Injeção de dependências: Disponibiliza, de forma simples, recursos e contextos
de uma aplicação, sem a necessidade de configurações em XMLs ou criação
efetiva de Objetos. Conexão com banco de dados, fontes de e-mail, transação do
usuário, componentes próprios, etc.
Segurança: Controle de usuários, perfis de acesso e restrição de recursos de
uma aplicação (JAAS).
JAVAEvolução do JEE - Roadmap
*fonte: oracle.com
Arquitetura Enterprise
Arquitetura EnterpriseQual O Real Papel do Arquiteto de Software?
Dado o cenário atual, onde o papel do Arquiteto de
software se enquadraria?
Ele é o responsável por escolher as tecnologias e
estruturas de todos os projetos de uma empresa?
O arquiteto deve ser um programador?
Uma das coisas mais importantes para o arquiteto é
que ele deve, sempre que possível, oferecer
liberdade para os desenvolvedores escolherem
tecnologias, framework, não engessando totalmente
o software, visto que isso faz com que seu time
aprenda mais e fique mais motivado.
Uma outra atitute interessante é incluir os
desenvolvedores em reuniões arquiteturais, pois os
mesmos podem agregar com expriências
vivênciadas entre outros conhecimentos adquiridos.
*fonte: infoq.com.br
Arquitetura EnterpriseQual é a diferença entre Arquitetura de Solução e Corporativa?
*fonte: blog.msdn.com
Arquitetura EnterpriseArquitetura de Referência
• Uma arquitetura de referência é sempre um ponto de início. É uma representação, bem genérica e
abstrata, que ajuda o time (e o arquiteto) na definição de elementos concretos do sistema. Elas
apontam para os principais componentes a serem definidos – orientando indiretamente seus
papéis, comportamentos e relacionamentos.
• Arquiteturas de referência surgem da observação de determinados tipos de software. Definem e
explicitam elementos comuns aplicados por vários profissionais de arquitetura no projeto de vários
software de um determinado tipo. São representações em alto-nível das similaridades identificadas
nessas diversas instâncias.
• Considerar uma arquitetura de referência, ao conceber um novo sistema, poupa ao arquiteto um
volume considerável de análise e ponderação na identificação de componentes – seus
comportamentos, papéis e relacionamentos.
• Arquiteturas de referência não foram criadas para atender conjuntos específicos de requisitos. Isso
significa que não podemos pegar uma arquitetura de referência e apontá-la como sendo a
arquitetura de um novo sistema sem a avaliação e ajustes indispensáveis. Elas são projetadas
para servir como “uma indicação de caminho a seguir”. Uma arquitetura concreta surge da
adaptação de uma referência para as necessidades e propósitos de um sistema específico.
Arquitetura EnterpriseDesenhos de Arquitetura
#Arquitetura de Referência#Arquitetura de Solução#Arquitetura de Infraestrutura
Integração de Sistemas
Integração de SistemasMundo SOA na atualidade
A Arquitetura Orientada à Serviço (SOA), atualmente, passou de ser apenas uma
tentativa para ser realidade. Hoje as empresas buscam integrar e compartilhar as
informações entre os sistemas de forma que a informação se torne algo
realmente valioso;
Através da SOA, é possível alinhar a Tecnologia da Informação (T.I.) com
negócios no ambiente corporativo, através da criação de soluções em forma de
serviços que possam ser reutilizados em diversas composições e cenários.
Porém, falar sobre SOA, não é apenas falarmos de Webservices e sim, de uma
moderna prática de compartilhamento de informação, regras de negócio, etc.
Integração de SistemasMundo SOA na atualidade
Integração de SistemasSOAP ou Rest: Que tal os dois?
Qual é o Melhor dos dois??
…Por que o SOAP trata melhor a segurança e trabalha com contratos…
…o REST é muito mais performático, trabalha sobre o HTTP e trafega dados com
menos verbosidade…
Integração de SistemasSOAP ou Rest: Que tal os dois?
Ambas tecnologias são muito viáveis no mercado atual. Ambos REST e o SOAP
conseguem resolver um grande número de problemas e desafios na web, e em
muitos casos, tanto um como o outro podem atender os cenários necessários;
O REST é fácil de entender e extremamente acessível porém, faltam padrões, e
a tecnologia é considerada apenas uma abordagem arquitetural. Em
comparação, o SOAP é um padrão da indústria, com protocolos bem definidos e
um conjunto de regras bem estabelecidas.
*fonte: infoq.com.br
Integração de SistemasSOAP ou Rest: Que tal os dois?
Alguns casos onde o REST vai muito bem:
• Situações em que há limitação de recursos e de largura de banda: A estrutura de retorno
é em qualquer formato definido pelo desenvolvedor e qualquer navegador pode ser
usado. Isso porque a abordagem REST usa o padrão de chamadas GET, PUT, POST e
DELETE;
• REST também pode usar objetos XMLHttpRequest (a base do velho AJAX) que a maioria
dos navegadores modernos suporta;
• Operações totalmente sem-estado: se uma operação precisa ser continuada, o REST não
será a melhor opção. No entanto, se forem necessárias operações de CRUD stateless
(Criar, Ler, Atualizar e Excluir), o REST seria a melhor alternativa;
• Situações que exigem cache: se a informação pode ser armazenada em cache, devido à
natureza da operação, o stateless do REST, esse seria um cenário adequado para a
tecnologia.
Integração de SistemasSOAP ou Rest: Que tal os dois?
O SOAP é bastante maduro e bem definido e vem com uma especificação
completa. Já a abordagem REST é apenas isso: uma abordagem e esta totalmente
aberta, sendo assim existem cenários interessantes para utilizarmos SOAP:
Processamento e chamada assíncronos: se o aplicativo precisa de um nível alto de
confiabilidade e segurança para a troca de mensagens, então o SOAP 1.2 oferece padrões
adicionais para esse tipo de operação como, por exemplo, o WSRM (WS-Reliable
Messaging);
Contratos formais: se ambos os lados (fornecedor e consumidor) têm que concordar com o
formato de intercâmbio de dados, então o SOAP 1.2 fornece especificações rígidas para esse
tipo de interação;
Operações stateful: para o caso de o aplicativo precisar de informação contextual e
gerenciamento de estado com coordenação e segurança, o SOAP 1.2 possui uma
especificação adicional em sua estrutura que apoia essa necessidade (segurança,
transações, coordenação etc.). Comparativamente, usar o REST exigiria que os
desenvolvedores construíssem uma solução personalizada.
“Portanto, a melhor
abordagem é a flexibilidade”
Integração de SistemasWebSocket e Você, Tudo a ver.
A especificação WebSocket define uma API que estabelece conexões de
"soquete" entre um navegador da web e um servidor;
Ele permitem abrir uma conexão com o servidor remoto e trafegar dados
arbitrariamente do servidor para o cliente e vice-versa. Isso viabiliza diversos
cenários como: Chats online, Transmissão de video, propagação de mensagem
para usuários conectados na solução etc.
A complexidade do lado do Cliente é muito simples e boa parte dos Browser já
suportam essa API que roda sobre o protocolo HTTP;
A grande complexidade fica do lado do Servidor que, precisa suportar este tipo de
comunicação.
Metodologias Ágeis
Metodologias ÁgeisEstá na Hora de Pensar “Ágil”... As empresas estão preparadas?
Está na hora de Pensar “Ágil” SIM!!!As empresas estão preparadas? Em sua grande maioria, NÃO!!!Quanto menos transparência houver na empresa, mais difícil será adotar abordagens
ágeis. Para saber o quanto a sua empresa é transparente, responda às três perguntas
abaixo:
O que acontece se as metas de orçamento não forem atingidas?
Se as respostas para essas perguntas forem "horas-extra para atingir as metas",
"humilhação pública" e "demissão", sua empresa provavelmente não está
preparada para ser Agile.
O que acontece se os story points previstos não forem concluídos em uma iteração?
O que acontece quando um vendedor não atinge sua cota?
Geralmente, empresas aptas a adotar Agile possuem comunicações
abertas e racionais, envolvendo o equilíbrio entre escopo e outras
variáveis de projeto. Um pré-requisito para a empresa se tornar ágil
é possuir "conversas adultas".
Metodologias ÁgeisBenefícios e Cuidados no Scrum
Overview:
Para obter o benefício do Scrum a empresa precisa fazer sua parte, adaptar-se
e mudar o pensamento. O resultado retorna em produtividade e na capacidade
de poder finalmente reconhecer o quando pode produzir.
Benefícios:
Se bem adotado, permite à organização começar a ter uma métrica da
capacidade que tem em converter demandas funcionais em produtos
prontos, o que permite que se possa melhorar a predictibilidade de entregas
de produto.
Além disso, organiza e disciplina a forma como demandas entram em projetos
e o diálogo necessário entre as partes para organizar da melhor forma
possível o trabalho. E como ponto principal inicia um processo de melhoria
contínua que permite que gargalos sejam identificados na organização
identificando desperdícios que em outro tipo de metodologia passariam
desapercebidos.
Cuidados:
A mudança de paradigma. Os gestores de projetos tradicionais foram
treinados em uma série de práticas que partem de uma série de
pressupostos. Eles estão ligados à engenharia faseada (fase de
requisitos, fase de construção etc.) e também pressupostos sobre processos
empurrados, que são baseados em empurrar previsões no sistema de
produção e muitos desses pressupostos caem por terra quando se aplica
engenharia simultânea, onde as disciplinas são realizadas simultaneamente
por uma equipe multidisciplinar, e quando se transforma o sistema de gestão
de empurrado para puxado, que está baseado em responder às demandas o
mais rápido possível e não em tentar prever a demanda com antecipação.
Metodologias ÁgeisPensando Diferente com Design Thinking
Inovar é uma tarefa árdua e muitas vezes frustrante, mas essencial para obter
diferenciação no mercado;
O design thinking propõe que um novo olhar seja adotado ao se endereçar a
problemas complexos, com um ponto de vista mais empático que permita colocar
as pessoas no centro do desenvolvimento de um projeto e gerar resultados que
são mais desejáveis para elas, mas que ao mesmo tempo financeiramente
interessantes e tecnicamente possíveis de serem transformados em realidade.
Nesse sentido, ele é parte do paradigma Arquitetura/Design, caracterizado pela
inovação e pelo human-centered design.
</OBRIGADO>