a nova geração da arquitetura web para a era da nuvem
TRANSCRIPT
A NOVA GERAÇÃO DA
ARQUITETU
RA WEB PA
RA A ERA
DA NUVEM
P O R : CL O V E S M
O R E I RA J U
N I OR
QUAL PÚBLICO É INDICADO ESTA PALESTRA?• Qualquer pessoa interessada em tecnologia web que tenha uma
compreensão básica de aplicações web e Arquitetura Orientada a Serviço (SOA)
HISTÓRIA DA
ARQUITETU
RA DE
APLICAÇÕES W
EB
Anos 90
Páginas HTML Estáticas
CGI ServletsFrameworks MVC
Motores de Templates Web
AJAX
SOFEA
Web 1.0
Web 2.0
Mobile
Hoje
MOTORES DE TEMPLATES WEB• Código incorporado dentro de elementos HTML estáticos• Mistura de HTML estático e dinâmico• Arquitetura de primeira geração• Exemplos:• Java Server Pages (JSP)• PHP• Active Server Pages (ASP)
FRAMEWORKS MVC• Padrão Model View Controller• Frameworks no lado servidor (Server- Side)• Arquitetura de Segunda Geração• Exemplos:• ASP.NET MVC Framework (.Net)• Struts, Spring MVC (Java)• Ruby on Rails (Ruby)• Django (Phyton)• Grails (Groovy)
AJAX• Asynchronous JavaScript And XML• Alterações de conteúdo dinâmico sem recarregar a página
inteira• Aplicativos interativos e dinâmicos da web se aproximando da
experiência de interação rica na parte client-side (Instrumentação para o RIA – Rich Internet Application)
• HTML/CSS + DOM + XmlHttpRequest Object + JavaScript + JSON/XML
PROCESSOS DE APLICAÇÕES WEB• Download da Aplicação• Código (JavaScript, HTML, Applets, Flash) a ser baixado no cliente
(web browser)
• Fluxo de Apresentação• Processamento visual dinâmico da UI (mudança de telas, novas
telas, etc) em resposta à entrada do usuário e alterações de estado de dados
• Interação de Dados• A troca de dados entre dois componentes de software ou camadas.
(busca, atualizações, recuperação, etc)
PROCESSO DE ALOCAÇÃO PARA FRAMEWORKS DE MOTORES DE TEMPLATES WEB
HOJE EM DIA• Motores de Template Web + Frameworks MVC + uma pitada
de Ajax
SOA & NUVEM
SOFEA
U M E S T I L O A R Q U I T E T U R A L P A R A A P L I C A Ç Õ E S W
E B E M
A MB I E N T E S P A R A S E R V I Ç O
SOFEA• Service Oriented Front End Architecture• Como construir aplicações Front-End em um mundo orientado à
serviços.• Quem definiu isso aí?• Ganesh Prasad, Rajat Taneja, Vikrant Todankar
• Estilo Arquitetural• Não uma implementação
• Prasad propôs que a revolução SOA será estar atrás em aplicações front-end/UI’s.
Viável porque...• Maturidade do
paradigma SOA em teoria e prática.
• Avanços em tecnologias de cliente com base em navegador, especialmente mecanismos de navegadores com suporte à JavaScript e AJAX toolkits
Necessários porque...
• SOA é o mecanismo de entrega de fato para serviços baseados em nuvem (Cloud e SOA são tecnologias complementares)
• Diversidade de plataformas de cliente• Dominação crescente de
clientes móveis
SOFEA É AGORA...
ARQUITETURA EMPRESARIAL WEB LEGADA
Arquitetura típica de aplicações empresariais web
Navegador Web
Lógica de Negócios e Persistência
Construção Lógica da
Página Web (JSP, PHP, ASP, etc.)
Cliente Servidor
ARQUITETURA SOFEA
Navegador Web
Lógica de Negócios e Persistência
Construção Lógica da
Página Web (JSP, PHP, ASP, etc.)
Cliente Servidor
Navegador Web
Lógica de Negócios e Persistência
SERVIÇOS
PROCESSOS WEB E SOFEA
PRINCÍPIOS DE SOFEA• Donwload da Aplicação, Comunicação de dados (Data
Interchange) e Fluxo de Apresentação deve ser desacoplado.• Nenhuma parte do cliente deve ser chamado, gerado ou modelado
a partir do lado do servidor.• O Fluxo de Apresentação é apenas uma preocupação do lado
cliente.• Toda a comunicação do aplicativo com o servidor deverá
estar usando serviços (REST, SOAP, etc).• O padrão MVC pertence ao cliente, não ao servidor.
• Escalabilidade• O servidor tem menos trabalho a fazer;
não realiza mais a geração da camada de apresentação, basta fornecer um serviço.
• Melhor resposta do usuário• Baixa Latência – Usuários finais felizes :D• Após o download do aplicativo, nenhuma
apresentação é transportado sobre a rede, apenas os dados de negócios
• Alto ROI• Expandido o espaço de oportunidades,
devido à natureza reutilizável inerente de SOA
• Ajuste natural em abmientes SOA e para a Nuvem
• Modelo de programação organizada• Desenvolvedores Client-side se
concentram na UI.• Desenvolvedores Server-side se
concentram nos serviços.
• Aplicações Offline• Quando houver falhas de rede, o cliente
é desacoplado e pode mudar dinamicamente sua escolha sobre os objetos de modelo, podendo usar uma base local ou quando a rede voltar poderá comunicar com os serviços.
• Interoperabilidade• Integração mais fácil com menor
sobrecarga de múltiplas plataformas.• Os clientes não se importam se os
serviços são Java, C #, Python, Cobol ou uma mistura heterogênea
BENEFÍCIOS DE SOFEA
IMPLEMENTAÇÃO DE ARQUETIPO DE CLIENTE PARA SOFEA
PONTOS À SEREM OBSERVADOS• O App Cliente é a Prioridade número um na definição da arquitetura,
não deve ser pensado nisto depois.• Usar ferramendas maduras no desenvolvimento client-side.• Ex: AngularJS, KnockoutJS, jQuery, etc...
• O RESTful é o modelo natural para comunicação em sistemas SOFEA• Arquitetos e Desenvolvedores devem definir uma comunicação de
forma assíncrona entre o servidor e a camada de cliente.• Aproveitar ao máximo as tecnologias mais recentes se for apropriado• HTML5, Webh Workers e WebSockets.
• Comece os testes de compatibilidade cross-browser no início do ciclo de desenvolvimento
• SOFEA é uma excelente escolha para ambientes que tenham largura de banda restrita ou consumo limitado de banda.
CONTATO• Git: clovesmjunior• E-mail: [email protected]• Sites :• www.squaresystems.com.br• www.squaress.com.br• www.squaress.com
• Agradecimentos: Ao Designer José Mário pela nova identidade visual da SquareSystems. Link: http://josemarioramos.com.br/
REFERÊNCIAS BIBLIOGRÁFICAShttp://martinfowler.com/eaaDev/ModelViewPresenter.htmlhttp://
www.infoq.com/articles/ieee-software-engineeering-services-cloud-computing,http://jubyzacharias.blogspot.com.br/p/sofea.htmlhttp://www.smart-soft.com/downloads/articles/Life-above-the-Service-Tier-v1_1.pdfhttp://mvalente.eu/2007/11/03/a-future-web-development-framework-ui-controller/http://www.smart-soft.com/downloads/articles/sofea.htmlhttp://www.sei.cmu.edu/library/assets/presentations/nelson-saturn2013.pdfhttp://martinfowler.com/eaaDev/uiArchs.htmlhttp://www.wildcrest.com/Potel/Portfolio/mvp.pdfhttp://martinfowler.com/eaaDev/PresentationModel.htmlhttp://knockoutjs.com/documentation/observables.html