SlideShare uma empresa Scribd logo
UNIVERSIDADE ESTADUAL DO SUDOESTE DA BAHIA
CURSO DE CIÊNCIA DA COMPUTAÇÃO
DESENVOLVIMENTO DE SISTEMAS WEB – 2015.2
Fábio M. Pereira
(fabio.mpereira@uesb.edu.br)
Roteiro
• Internet e Web
• Cliente/Servidor
• Navegação
• URLs
• Anatomia de Uma Página Web
• Web Sites x Web Apps
• Web 2.0
• Rich Internet Applications (RIA)
• Computação em Nuvem
• Arquitetura em Três Camadas
• Web Server
• Bancos de Dados
• Frameworks e Linguagens
• Referências
Desenvolvimento de Sistemas Web - Conceitos Básicos
Internet X Web
• Internet
– Uma rede de computadores conectados
– Um esforço cooperativo governado por um sistema de padrões
e regras
– A finalidade de se conectar computadores – compartilhar
informação
– Existem várias maneiras pelas quais a informação pode ser
passada entre computadores, incluindo e-mail, transferência de
arquivos (FTP) e muitos outros modos especializados sobre os
quais a Internet é construída
– Estes métodos padronizados para transferência de dados ou
documentos sobre uma rede são conhecidos como protocolos
Internet X Web
• Web
– Originalmente chamada de World Wide Web, daí o “www” no
endereço de sites
– É apenas uma das maneiras de como a informação pode ser
compartilhada na Internet
– Ela é única por permitir que documentos possam ser ligados
uns aos outros utilizando links de hipertexto – formando uma
grande “teia” de informação conectada
– A Web utiliza um protocolo chamado HTTP (HyperText Transfer
Protocol), as primeiras quatro letras de todo endereço de site
web
Internet – Histórico
• A pesquisa sobre a comutação de pacotes começou na década
de 1960:
– Redes de comutação de pacotes, como Mark I, no NPL no Reino
Unido, ARPANET, CYCLADES, Merit Network, Tymnet e Telenet foram
desenvolvidas em final dos anos 1960 e início dos anos 1970, usando
uma variedade de protocolos
• A ARPANET, em particular, levou ao desenvolvimento de
protocolos para internetworking, onde várias redes separadas
poderiam ser unidas em uma rede de redes
• Os dois primeiros nós do que viria a ser a ARPANET foram
interconectados entre o Network Measurement Center de
Leonard Kleinrock na Escola de Engenharia e Ciências
Aplicadas da UCLA e o sistema NLS de Douglas Engelbart no
SRI International (SRI), em Menlo Park, Califórnia, em 29 de
outubro de 1969
Internet – Histórico
• O terceiro nó da ARPANET era o Culler-Fried Interactive
Mathematics Center da Universidade da Califórnia em Santa
Bárbara e o quarto era o Departamento Gráfico da
Universidade de Utah
• Em um sinal precoce de crescimento futuro, já havia quinze
sites conectados à jovem ARPANET até o final de 1971
• Em dezembro de 1974, o RFC (Request for Comments) 675 -
Specification of Internet Transmission Control Program, de
Vinton Cerf, Yogen Dalal e Carl Sunshine usou o termo
Internet como uma abreviação para internetworking e RFCs
posteriores repetiram esse termo
• Em 1982, o Internet Protocol Suite (TCP/IP) foi padronizado e
o conceito de uma rede mundial de redes TCP/IP totalmente
interligadas chamado de Internet foi introduzido
Internet – Histórico
• O acesso à rede TCP/IP expandiu-se novamente em 1986,
quando o National Science Foundation Network (NSFNET)
proveu acesso a sites de supercomputadores nos Estados
Unidos a partir de organizações de pesquisa e de educação, o
primeiro a 56 kbit/s e, mais tarde, 1,5 Mbit/s e 45 Mbit/s
• Os primeiros fornecedores de acesso à internet (ISPs)
comerciais começaram a surgir no final dos anos 1980 e início
dos anos 1990
• A ARPANET foi desmantelada em 1990
• A internet foi totalmente comercializada nos Estados Unidos
em 1995, quando a NSFNET foi desmantelada, removendo as
últimas restrições sobre o uso da internet para transportar o
tráfego comercial
• A internet começou uma rápida expansão para a Europa e
Austrália em meados da década de 1980 e para a Ásia no final
dos anos 1980 e início dos anos 1990
Internet – Histórico
• Durante a década de 1990, estimou-se que o tráfego na internet
pública cresceu cerca 100% ao ano, enquanto estima-se que o
crescimento anual do número de usuários seja de algo entre 20% e
50%
• Gráfico mostrando a proporção de usuários de Internet a cada 100
pessoas:
Internet – Brasil
• A internet no Brasil se desenvolveu junto ao meio
acadêmico e científico, e no seu início, o acesso era
restrito a professores e funcionários de universidades e
instituições de pesquisa
• Somente no ano de 1995 a internet deixou de ser
privilégio das universidades e da iniciativa privada para se
tornar de acesso público
• No Brasil existe o Comitê Gestor da Internet e um órgão
para o registro de domínios (FAPESP - Fundação de
Amparo à Pesquisa do Estado de São Paulo)
• 57,6% da população tem acesso a Internet (Argentina –
55,8%, China – 45,8%, Índia – 25%, EUA – 81%, Japão –
79%, Alemanha – 84%, Suécia – 94%)
Web - Histórico
• A Organização Europeia para a Investigação Nuclear (CERN)
foi a responsável pela invenção da World Wide Web
• O responsável pela invenção chama-se Tim Berners-Lee, que
construiu o seu primeiro computador na Universidade de
Oxford, onde se formou em 1976
• Quatro anos depois, tornava-se consultor de engenharia de
software no CERN e escrevia o seu primeiro programa para
armazenamento de informação – chamava-se Enquire e,
embora nunca tenha sido publicada, foi a base para o
desenvolvimento da Web
• Em 1989, propôs um projeto de hipertexto que permitia às
pessoas trabalhar em conjunto, combinando o seu
conhecimento numa rede de documentos
– Foi esse projeto que ficou conhecido como a World Wide Web
Web - Histórico
• A Web funcionou primeiro dentro do CERN, e no Verão
de 1991 foi disponibilizada mundialmente
• Em 1994 Berners-Lee criou o World Wide Web
Consortium (W3C - http://www.w3.org/), onde
atualmente assume a função de diretor
• Mais tarde, e em reconhecimento dos serviços prestados
para o desenvolvimento global da Web, Tim Berners-Lee
foi nomeado cavaleiro pela rainha da Inglaterra
Desenvolvimento de Sistemas Web - Conceitos Básicos
Cliente/Servidor
• Por disponibilizar documentos sob demanda, alguns
computadores são conhecidos como servidores
• Mais precisamente, o servidor é o software (não o
computador em si) que permite aos computadores se
comunicarem com outros computadores
– Embora seja comum utilizar a palavra “servidor” para se referir
também ao computador
• O papel do software servidor é esperar por uma
requisição de informação, então reter e enviar a
informação de volta tão rápido quanto possível
• Não há nada de especial com o computador em si – é o
software servidor que faz tudo acontecer
Cliente/Servidor
• Para que um computador possa fazer parte da Web, ele
deve estar rodando um software especial para servidor
Web que permita a manipulação de transações HTTP
– Servidores Web também são conhecidos como servidores HTTP
• Existem muitas opções de software, mas os dois mais
populares são:
– Apache (de código aberto) – livremente disponível para
computadores baseados em Unix, Mac OS e Windows
– Microsoft Internet Information Services (IIS) – parte da família
de soluções de servidores da Microsoft
– Glassfish da Oracle
Cliente/Servidor
• Para todo computador e dispositivo (modem, roteador,
smartphone, carros, etc.) conectados à Internet é atribuído
um único endereço IP (Internet Protocol) numérico
– Por exemplo, o computador que hospeda oreilly.com tem o endereço
IP 208.201.239.100
• Como esses números podem confundir, felizmente o Domain
Name System (DNS) foi desenvolvido para permitir a nós nos
referirmos a um servidor pelo seu nome de domínio, no caso
“orelly.com”
– O endereço IP é útil para software, enquanto o nome de domínio é
mais acessível para humanos
• Combinar o texto dos nomes de domínios com seus
respectivos endereços IP numéricos é o trabalho de um
servidor DNS
Cliente/Servidor
• É possível configurar o servidor web para responder a
mais de um nome de domínio
– Mapeados para um único endereço IP
• Permitindo que vários sites compartilhem um único
servidor
• Questões para discussão:
– Quais outros tipos de software para servidor você conhece?
– Qual a relação entre configuração do computador servidor
(equipamento) e tipo de serviço oferecido?
Fim dos Endereços IP
• A IANA, organização que designa números IP, distribuiu o seu
último pacote de endereços IP em 3 de fevereiro de 2011
– Não existem mais IPs no estilo ###.###.###.### (chamado IPv4), que
tem a capacidade de produzir 4.3 bilhões de endereços únicos, que
parecia suficiente quando o “experimento” da Internet foi
inicialmente concebido em 1977
• Não havia como os criadores poderem antecipar que um dia
cada telefone, televisão e objetos em uma prateleira de uma
loja, poderiam solicitar um endereço IP
• A solução é um novo formato (IPv6, já em funcionamento)
que permite que trilhões de números IP únicos sejam
utilizados
• O IPv6 é incompatível com a rede atual baseada em IPv4
– Então ela irá operar como um tipo de Internet paralela à que temos
hoje
– Eventualmente, IPv4 irá desaparecer, mas alguns dizem que isto
demorará décadas
Desenvolvimento de Sistemas Web - Conceitos Básicos
Navegação
• O software que faz as requisições é chamado de cliente
• Pessoas utilizam navegadores desktop, navegadores
móveis e outras tecnologias assistivas (como leitores de
telas), como clientes para acessar documentos na Web
• O servidor retorna o documento para o navegador
(também conhecido como agente do usuário), para que
possa ser exibido
• A requisição e a resposta são manipuladas pelo protocolo
HTTP
– Embora falemos em “documentos”, HTTP pode ser usado para
transferir imagens, filmes, arquivos de áudio, dados, scripts, e
todos os outros recursos utilizados na construção de sites e
aplicações Web
Server-side vs. Client-side
• Frequentemente em web-design, ouvimos referências a
aplicações “client-side” (lado cliente) ou “server-side”
(lado servidor)
• Estes termos são utilizados para indicar qual máquina
realiza o processamento:
– Aplicações “client-side” rodam na máquina do usuário
– Aplicações e funções “server-side” utilizam o poder de
processamento de computadores servidores
Navegação
• É comum pensar em um navegador como uma janela em
um monitor com uma página exibida nele
– Estes são conhecidos como navegadores gráficos ou de desktop
– Por um longo período de tempo foram a única forma de acesso
à Web
• Os navegadores mais populares de desktop incluem:
Internet Explorer, Chrome, Firefox, Safari e Opera
• Atualmente mais e mais pessoas estão acessando a Web
utilizando navegadores criados dentro de telefones
móveis ou tablets
Navegação
• É também importante manter em mente experiências
alternativas na Web
• Usuários com deficiência de visão devem poder ouvir o
conteúdo de uma página Web através de um leitor de
tela, ou simplesmente tornando o texto extremamente
grande
• Usuários com mobilidade limitada podem utilizar
dispositivos assistivos para acessar links e digitar
• Os sites que construirmos devem poder ser acessados e
utilizáveis por todos os usuários, independentemente de
suas experiências de navegação
Navegação
• Mesmo em navegadores desktop páginas podem parecer
e funcionar de maneira diferente de navegador para
navegador
• Isto ocorre pela variedade de suporte à tecnologias Web
e a habilidade do usuário para atribuir suas próprias
preferências de navegação
Intranets e Extranets
• Quando pensamos em um site Web, geralmente
assumimos que ele está acessível a qualquer pessoa
navegando na Web
• Entretanto, muitas empresas se utilizam das vantagens
do compartilhamento e troca de informações dos sites
Web apenas dentro de seus próprios negócios
• Estas redes especiais baseadas na Web são chamadas de
Intranets
– Elas são criadas e funcionam como sites Web comuns, mas
utilizam dispositivos de segurança especiais (chamados
firewalls) que previnem o acesso externo
– Intranets possuem vários usos, como acesso a informações de
recursos humanos ou de bancos de dados de inventário
Intranets e Extranets
• Uma Extranet, assim como uma Intranet, somente pode
ser acessada por usuários selecionados, mas fora da
empresa
– São informações corporativas acessadas, de forma limitada,
pela Internet
• Por exemplo, uma fábrica pode fornecer a seus clientes
uma senha que permita que eles verifiquem a situação
de seus pedidos no banco de dados de pedidos da
empresa
• A senha determina qual parte da informação da empresa
está disponível
Desenvolvimento de Sistemas Web - Conceitos Básicos
URLs
• Cada página ou recurso na Web possui seu próprio
endereço especial chamado de URL, acrônimo de
Uniform Resource Locator (Localizador Padrão de
Recursos)
• Algumas URLs são curtas, outras podem parecer com
enormes strings de caracteres separados por pontos,
traços e barras
Partes de uma URL
1. http://
– Indica o protocolo utilizado para a operação
– As letras HTTP indicam ao servidor para utilizar o Hypertext Transfer
Protocol, ou entrar no “modo Web”
2. www.example.com
– Identifica o site Web por seu nome de domínio
– O nome do domínio é example.com
– A parte “www.” do início é o nome de um host (máquina) em
particular naquele domínio
– O nome do host “www” se tornou uma convenção, mas não é uma
regra, e muitas vezes pode ser omitido
– Pode haver mais de um site Web em um mesmo domínio, por
exemplo, development.example.com, clients.example.com
Partes de uma URL
3. /2012/samples/first.html
– Caminho absoluto através das pastas no servidor, onde está
localizado o documento HTML, first.html
– As palavras separadas por barras são os nomes das pastas,
iniciando na pasta raiz do host (como indicado pelo sinal /)
– Como a Internet originalmente foi projetada para rodar no
sistema operacional Unix, a maneira atual de fazer as coisas
ainda seguem muitas regras e convenções do Unix, como a /
para separar nomes de pastas
Arquivos default
• Obviamente, nem todas as URLs possuem tanta informação
• Muitos endereços não incluem um nome de arquivo,
simplesmente apontam para uma pasta
– http://www.oreilly.com
– http://jendesign.com/resume/
• Quando isto ocorre, o servidor busca por um documento
default, tipicamente chamado de index.html
• Assim o exemplo anterior seria visto como:
– http://www.oreilly.com/index.html
– http://jendesign.com/resume/index.html
• O nome do arquivo padrão pode variar e depende de como o
servidor está configurado
– Neste exemplo o nome é index.html, mas poderia ser default.htm
Arquivos default
• Se utilizarmos programação do lado servidor, o arquivo
padrão poderia ser nomeado index.php ou index.asp
• Uma outra coisa a ser notada no primeiro exemplo é a
falta da barra para indicar uma pasta
– Quando a barra é omitida, o servidor simplesmente a adiciona
se encontrar uma pasta com aquele nome
• O arquivo índice também é utilizado para segurança:
– Alguns servidores (dependendo da configuração) mostram o
conteúdo da pasta caso o arquivo padrão não seja encontrado
– Uma das maneiras de evitar que pessoas fiquem fuçando em
seus arquivos é colocar um arquivo índice em todas as pastas
Desenvolvimento de Sistemas Web - Conceitos Básicos
Anatomia de Uma Página Web
• A página Web simples apresentada a seguir, apesar de
parecer como uma única página coerente, é construída a
partir de quatro arquivos separados:
– Um documento HTML (index.html), uma folha de estilos (style
sheet – kitchen.css), e dois gráficos (foods.gif e spoon.gif)
Documentos HTML
• Páginas Web são geralmente geradas por documentos de
textos simples, formados por marcas (tags) especiais
(indicadas pelos sinais < e >) que descrevem cada elemento
da página
• Adicionar tags descritivas a um documento é conhecido como
“marcar” o documento
– Páginas Web utilizam uma linguagem de marcação conhecida como
HyperText Markup Language (HTML), que foi criada especialmente
para documentos com links de hipertexto
• HTML define dúzias de elementos de texto que compõem um
documento, como cabeçalhos, parágrafos, texto enfatizado, e
claro, links
• Também existem elementos para adicionar informação sobre
o documento (como o seu título), mídia (como imagens e
vídeos) e componentes (widgets) para criação de formulários,
apenas para citar alguns
Documentos HTML
• Pior ainda é o fato de que existem várias versões de
HTML em uso hoje em dia
• A mais fortemente estabelecida é a 4.01 e seu “parente”
mais próximo XHTML 1.0
• Mas já está em funcionamento a versão mais recente,
HTML5, que foi projetada para um melhor
desenvolvimento de aplicações Web e que está
gradualmente ganhando suporte dos navegadores
Introdução Rápida a HTML
• Comparando a página com o seu código...
– http://www.learningwebdesign.com/4e/materials/chapter02/ki
tchen.html
Introdução Rápida a HTML
Introdução Rápida a HTML
• Primeiro devemos notar que o texto marcado (entre < e
>) não é mostrado na página final
– O navegador mostra apenas o que estiver entre as tags – o
conteúdo do elemento – a marcação é escondida
• A tag fornece o nome do elemento HTML
– Geralmente uma abreviação, como “h1” para “heading level 1”,
ou “em” para “emphasized text”
• Em segundo lugar, devemos notar que a maioria das tags
HTML aparecem em pares em volta do conteúdo do
elemento
– No nosso exemplo, <h1> indica que o texto seguinte deve ser
um cabeçalho de nível 1
– </h1> indica o final do cabeçalho
Introdução Rápida a HTML
• Alguns elementos, conhecidos como elementos vazios,
não possuem conteúdo
– No exemplo, a tag <hr> indica um elemento vazio que informa
ao navegador para “inserir um divisor temático aqui” (na
maioria dos navegadores, uma linha horizontal – horizontal
rule)
Inserindo Imagens
• Obviamente, um arquivo HTML não pode conter
imagens, então cada imagem deve estar em um arquivo
separado
• As imagens são colocadas entre o texto através do
elemento image do HTML (img), que informa ao
navegador onde encontrar o gráfico (sua URL)
– Quando o navegador encontra o elemento img, ele faz uma
outra requisição ao servidor pelo arquivo de imagem
– Vídeos e outros arquivos de mídias embutidos são tratados
geralmente da mesma forma
Inserindo Imagens
• A montagem da página geralmente acontece de maneira
instantânea, aparecendo como uma página completa
carregada de uma só vez
– Em conexões lentas ou páginas que incluam imagens ou
arquivos de mídia grandes, o processo de montagem pode ser
mais aparente, com imagens aparecendo depois do texto
– A página pode ser até mesmo redesenhada quando novas
imagens chegam (a não ser que possamos construir a página de
maneira a prevenir este acontecimento)
Trabalhando com Estilos
• Próximo do início do documento HTML existe um
elemento link que aponta para o documento de folha
de estilo kitchen.css
• Esta folha de estilos inclui poucas linhas de instruções
para a forma como a página deve parecer no navegador
• São instruções de estilo escritas de acordo com as regras
CSS (Cascading Style Sheets)
• CSS permite que designers adicionem instruções de estilo
visual (conhecidas como apresentação do documento) no
texto de marcação (estrutura do documento em
terminologia de projeto Web)
Trabalhando com Estilos
• Note a diferença da página exemplo com e sem estilo:
Resumindo...
Resumindo...
Adicionando Comportamento
• Em uma página Web, além da estrutura e da
apresentação, existe também um componente de
comportamento que define como as coisas funcionam
• Na Web comportamentos são definidos por uma
linguagem de script chamada JavaScript
• Muitos projetistas Web recorrem a profissionais mais
experientes para adicionar funcionalidade aos seus sites
• Entretanto, saber como escrever JavaScript está se
tornando mais essencial à profissão de “Web designer”
Desenvolvimento de Sistemas Web - Conceitos Básicos
Web Sites x Web Apps
• Nas últimas duas décadas a Internet cresceu, expandiu,
explodiu e tornou impossível ignorá-la, tornando qualquer
teclado sem conexão com a Internet muitas vezes inútil
• Nos últimos anos, surgiu na Web um novo termo que pode
ser tanto interessante como confuso ao mesmo tempo: “Web
app”
• Hoje, existe um debate na comunidade sobre onde termina o
“Web site” e onde começa a “Web app”
• Apresentamos um resumo do artigo de Ciprian Borodescu
sobre a opinião de diferentes figuras influentes no domínio de
tecnologia Web e da discussão sobre a “app-ification” da Web
– http://www.visionmobile.com/blog/2013/07/web-sites-vs-web-apps-
what-the-experts-think/
Definição
• Na era da pré-app-história, a palavra “aplicação” era aplicada
a sites Web que forneciam interações avançadas a seus
usuários e capacidades previamente disponíveis apenas
através de software instalado
– Exemplos iniciais de aplicações Web incluem Webmail, Google Maps
e Google Docs
• Comparados à Web clássica, por exemplo blogs e sites de
notícias, Web apps permitiam uma experiência rica do usuário
e acesso a capacidades avançadas dos navegadores
• Hoje, páginas de sites Web ainda podem ser referenciadas
como Web apps, mas está mais focada na tarefa que na
tecnologia em si
– “O use case de uma aplicação é sempre FAZER alguma coisa”
(Christian Heilmann)
Definição
• Uma Web app é sempre voltada a tarefas:
– Pensando em smartphones ou tablets, uma aplicação poderia
ter como objetivo realizar uma tarefa específica, como fazer
uma ligação, verificar o e-mail ou encontrar um táxi próximo
• Algumas definições simples:
– Web sites são somente leitura (read only), Web apps são de
leitura-escrita (read-write)
– Web sites são para consumo, Web apps são para criação
Atributos de Uma Web App
• Auto-contida
• Interface do usuário rica/interativa, possivelmente
imitando a interface nativa do dispositivo
• Utilizar capacidades avançadas do dispositivo
– Localização geográfica, integração com câmera ou outras
tecnologias
• Orientação à ação em vez de orientação à informação
• Não utilizar pesadamente (ou esconder quando possível)
operações do navegador (botão voltar, recarregar, barra
de endereços)
• Funcionar offline
– Por exemplo, utilizando HTML5 ApplicationCache,
armazenamento local ou bancos de dados indexados
“App-ification” da Web
• Existe um número crescente de desenvolvedores mobile de
Web apps
• Baseado em uma pesquisa da Developer Economics de 2014
com mais de 7.000 desenvolvedores...
– 71% dos desenvolvedores para plataformas móveis desenvolvem para
Android
– 37% utilizam HTML5 como plataforma
– 83% desenvolvem para tablets, mas apenas 12% tratam esta
plataforma como alvo principal
– 60% estão “abaixo da linha de pobreza das apps” – ganham menos de
$500 por aplicação por mês
– 23% dos desenvolvedores HTML5 desenvolvem Web apps,
comparados a 38% que desenvolvem Web sites
• Como disse Sir Tim Berners-Lee em 2012: “the solution is in
your hands: develop web apps!”
Desenvolvimento de Sistemas Web - Conceitos Básicos
Web 2.0
• Termo polêmico criado pela O’Reilly Media em 2004 para
designar uma segunda geração de comunidades e
serviços tendo como conceito a “Web como plataforma”
• Embora o termo tenha uma conotação de uma nova
versão para a Web, ele não se refere à atualização nas
suas especificações técnicas, mas a uma mudança na
forma como ela é encarada por usuários e
desenvolvedores, ou seja, o ambiente de interação e
participação que hoje engloba inúmeras linguagens e
motivações
Definição de Tim O’Reilly
"Web 2.0 é a mudança para uma internet como
plataforma, e um entendimento das regras
para obter sucesso nesta nova plataforma.
Entre outras, a regra mais importante é
desenvolver aplicativos que aproveitem os
efeitos de rede para se tornarem melhores
quanto mais são usados pelas pessoas,
aproveitando a inteligência coletiva"
Regras
• Beta perpétuo
– o software não é um artefato e sim um processo de
comprometimento com seus usuários
• Pequenas peças frouxamente unidas
– abra seus dados e serviços para que sejam reutilizados por
outros
– reutilize dados e serviços de outros sempre que possível
• Software acima do nível de um único dispositivo
• Dados são o novo “Intel inside”
– infoware X software
Regras
• Software usados na Internet como serviços e não vendidos
como pacotes
– Pagos mensalmente como uma conta de água
– A Web é a plataforma, o software um serviço
• Experiência do usuário mais rica
– interfaces mais rápidas e mais fáceis de usar
• Posicionamento do usuário: você controla os seus próprios
dados
• Arquitetura de participação
– aproveitamento da inteligência coletiva
– muitos serviços online pretendem oferecer além de um ambiente de
fácil publicação e espaço para debates, recursos para a gestão coletiva
do trabalho comum
– não é uma ideia nova e sim um dos princípios da Internet desde a sua
criação
Exemplos
Desenvolvimento de Sistemas Web - Conceitos Básicos
Rich Internet Application (RIA)
• Aplicação de Internet Rica
• Aplicações Web que possuem muitas das características
de software de aplicação desktop
• RIA utiliza um modelo de distribuição de cliente rico –
distribuição de uma aplicação cliente compilada através
de um navegador
– Em vez de um modelo cliente-servidor leve – onde a visão do
usuário é em sua maior parte controlada pelo servidor
• Tipicamente são distribuídas através de um navegador
específico, um plug-in do navegador, uso extensivo de
JavaScript ou uma máquina virtual
Rich Internet Application (RIA)
• Usuários geralmente instalam um ambiente de software
(framework) antes de poder executar a aplicação, que
tipicamente realiza download, atualiza, verifica e executa
a RIA
– Esta é a principal diferença de alternativas baseadas em
HTML5/JavaScript, como Ajax, que utilizam funcionalidades
nativas do navegador para implementar interfaces comparáveis
• Plug-ins mais conhecidos:
– Adobe Flash, presente em 96% dos navegadores desktop (2011)
– JavaFX, com 76%
– Microsoft Silverlight, com 66%
– Java Applet, em desuso
Rich Internet Application (RIA)
• Estas plataformas limitam a quantidade de dados
baixados durante a inicialização a apenas o que é
necessário para mostrar a página
• O plug-in é baixado apenas uma vez, reduzindo o tempo
de carga da aplicação, requisitos de velocidade de
conexão e carga do servidor
• Muito utilizada para jogos nos navegadores
– Sons, vídeos, movimentos, gráficos, ...
• Principais problemas:
– Soluções proprietárias
– Concorrência com o HTML5
– Realmente precisamos disso em aplicações comerciais?
Desenvolvimento de Sistemas Web - Conceitos Básicos
Computação em Nuvem
• O conceito de computação em nuvem (em inglês, cloud
computing) refere-se à utilização da memória e das
capacidades de armazenamento e cálculo de
computadores e servidores compartilhados e interligados
por meio da Internet
• O armazenamento de dados é feito em serviços que
poderão ser acessados de qualquer lugar do mundo, a
qualquer hora, não havendo necessidade de instalação
de programas ou de armazenar dados
– O acesso a programas, serviços e arquivos é remoto, através da
Internet - daí a alusão à nuvem
– O uso desse modelo (ambiente) é mais viável do que o uso de
unidades físicas
Computação em Nuvem
• Num sistema operacional disponível na Internet, a partir
de qualquer computador e em qualquer lugar, pode-se
ter acesso a informações, arquivos e programas num
sistema único, independente de plataforma
– O requisito mínimo é um computador compatível com os
recursos disponíveis na Internet
– O PC torna-se apenas um chip ligado à Internet — a "grande
nuvem" de computadores — sendo necessários somente os
dispositivos de entrada (teclado, mouse) e saída (monitor)
Tipologia
• IaaS - Infrastructure as a Service ou Infraestrutura como
Serviço
– quando se utiliza uma percentagem de um servidor, geralmente com
configuração que se adeque à sua necessidade
• PaaS - Plataform as a Service ou Plataforma como Serviço
– utilizando-se apenas uma plataforma como um banco de dados, um
web-service, etc. (p.ex.: Windows Azure e Jelastic)
• DevaaS - Development as a Service ou Desenvolvimento como
Serviço
– as ferramentas de desenvolvimento tomam forma na computação em
nuvem como ferramentas compartilhadas e ferramentas de
desenvolvimento web-based
• SaaS - Software as a Service ou Software como Serviço
– uso de um software em regime de utilização web (p.ex.: Google Docs,
Microsoft SharePoint Online)
Tipologia
• CaaS - Communication as a Service ou Comunicação
como Serviço
– uso de uma solução de Comunicação Unificada hospedada em
Data Center do provedor ou fabricante (p.ex.: Microsoft Lync)
• DBaas - Data Base as a Service ou Banco de dados como
Serviço
– quando utiliza a parte de servidores de banco de dados como
serviço
• EaaS - Everything as a Service ou Tudo como Serviço
– quando se utiliza tudo, infraestrutura, plataformas, software,
suporte, enfim, o que envolve T.I.C. (Tecnologia da Informação e
Comunicação) como um serviço
Características
• Provisionamento dinâmico de recursos sob demanda,
com mínimo de esforço
• Escalabilidade
• Uso de "utilility computing", onde a cobrança é baseada
no uso do recurso ao invés de uma taxa fixa
• Visão única do sistema
• Distribuição geográfica dos recursos de forma
transparente ao usuário
Modelos de Implantação
• Público
– as nuvens públicas são aquelas que são executadas por terceiros
– as aplicações de diversos usuários ficam misturadas nos sistemas de
armazenamento
• Privado
– as nuvens privadas são aquelas construídas exclusivamente para um único
usuário (uma empresa, por exemplo)
– diferentemente de um data center privado virtual, a infraestrutura utilizada
pertence ao usuário, e, portanto, ele possui total controle sobre como as
aplicações são implementadas na nuvem
• Comunidade
– a infraestrutura de nuvem é compartilhada por diversas organizações e
suporta uma comunidade específica
• Híbrido
– nas nuvens híbridas temos uma composição dos modelos de nuvens públicas
e privadas
– elas permitem que uma nuvem privada possa ter seus recursos ampliados a
partir de uma reserva de recursos em uma nuvem pública
Vantagens
• A maior vantagem da computação em nuvem é a
possibilidade de utilizar software sem que estes estejam
instalados no computador
• Na maioria das vezes o usuário não precisa se preocupar com
o sistema operacional e hardware que está usando em seu
computador pessoal
• As atualizações do software são feitas de forma automática,
sem necessidade de intervenção do usuário
• O trabalho corporativo e o compartilhamento de arquivos se
tornam mais fáceis, uma vez que todas as informações se
encontram no mesmo "lugar", ou seja, na "nuvem
computacional"
• O software e os dados podem ser acessados em qualquer
lugar, basta apenas que haja acesso à Internet
Vantagens
• O usuário tem um melhor controle de gastos ao usar aplicativos,
pois a maioria dos sistemas de computação em nuvem fornece
aplicações gratuitamente e, quando não gratuitas, são pagas
somente pelo tempo de utilização dos recursos
– Não é necessário pagar por uma licença integral de uso de software
• Diminui a necessidade de manutenção da infraestrutura física de
redes locais cliente/servidor, bem como da instalação de software
nos computadores corporativos, pois esta fica a cargo do provedor
do software em nuvem, bastando que os computadores clientes
tenham acesso à Internet
• A infraestrutura necessária para uma solução de computação em
nuvem é bem mais enxuta do que uma solução tradicional de
hospedagem ou alojamento, consumindo menos energia,
refrigeração e espaço físico e consequentemente contribuindo para
a preservação e o uso racional dos recursos naturais
Desvantagens
• A maior desvantagem da computação em nuvem vem
fora do propósito desta, que é o acesso a Internet
– caso você perca o acesso, comprometerá todos os sistemas
embarcados
• Velocidade de processamento
– caso seja necessário uma grande taxa de transferência, se a
Internet não tiver uma boa banda, o sistema pode ser
comprometido
– um exemplo típico é com mídias digitais ou jogos
• Assim como todo tipo de serviço, ele é custeado
• Maior risco de comprometimento da privacidade do que
em armazenamento off-line
Desenvolvimento de Sistemas Web - Conceitos Básicos
Arquitetura em Uma Camada
• Nos tempos antigos do reinado do grande porte
(mainframes) e do computador pessoal independente,
um aplicativo era desenvolvido para ser usado em uma
única máquina
• Geralmente este aplicativo continha todas as
funcionalidades em um único módulo gerado por uma
grande quantidade de linhas de código e de manutenção
nada fácil
• A entrada do usuário, verificação, lógica de negócio e
acesso a banco de dados estava presente em um mesmo
lugar
• Podemos definir este tipo de aplicação como aplicação de
uma camada ou monolítica
Arquitetura em Uma Camada
Arquitetura em Duas Camadas
• A necessidade de compartilhar a lógica de acesso a dados
entre vários usuários simultâneos fez surgir as aplicações
em duas camadas
• Nesta estrutura a base de dados foi colocada em uma
máquina específica, separada das máquinas que
executavam as aplicações
• Nesta abordagem temos aplicativos instalados em
estações clientes contendo toda a lógica da aplicação
(clientes ricos ou gordos)
• Um grande problema neste modelo é o gerenciamento
de versões pois para cada alteração os aplicativos
precisam ser atualizados em todas as máquinas clientes
Arquitetura em Duas Camadas
Arquitetura em Três Camadas
• Com o advento da Internet houve um movimento para
separar a lógica de negócio da interface com o usuário
• A ideia é que os usuários da Web possam acessar as mesmas
aplicações sem ter que instalar estas aplicações em suas
máquinas locais
• Como a lógica do aplicativo, inicialmente contida no cliente
rico, não reside mais na máquina do usuário, este tipo de
cliente passou a ser chamado de cliente pobre ou magro (thin
client)
• Neste modelo o aplicativo é movido para o Servidor e um
navegador Web é usado como um cliente magro
• O aplicativo é executado em servidores Web com os quais o
navegador Web se comunica e gera o código HTML para ser
exibido no cliente
Arquitetura em Três Camadas
Camada de Apresentação
• É a chamada GUI (Graphical User Interface), ou
simplesmente interface
• Esta camada interage diretamente com o usuário, é
através dela que são feitas as requisições como consultas,
por exemplo
• Oferece conteúdo estático e conteúdo dinâmico
personalizado, que pode ser apresentado nos mais
variados formatos disponíveis, como HTML, Windows
Forms ou XML
• As classes dessa camada utilizam os serviços oferecidos
pela camada de negócios
Camada de Negócio/Aplicação
• Também chamada de Lógica empresarial, Regras de
negócio ou Funcionalidade
• É nela onde as funções e regras de todo o negócio são
implementadas
– Nela estão todas as classes inerentes ao domínio da aplicação
• Não existe uma interface para o usuário e seus dados são
voláteis, ou seja, para que algum dado seja mantido deve
ser utilizada a camada de dados
Camada de Dados
• A terceira camada é definida como o repositório das
informações e as classes que a manipulam
• É responsável pela persistência e acesso aos dados da
aplicação
• Esta camada recebe as requisições da camada de
negócios e seus métodos executam essas requisições em
um banco de dados
• Ela isola o resto da aplicação do meio de armazenamento
usado de maneira que, se o meio de armazenamento for
trocado, apenas as classes desta camada precisarão ser
modificadas ou substituídas
Objetivos da Arquitetura em Camadas
• Modularidade
– dividir a aplicação em módulos tão independentes quanto
possível
• Manutenibilidade
– reduzir o custo de manutenção da aplicação
• Extensibilidade
– permitir que novas funcionalidades sejam adicionadas sem
grande impacto nas já existentes
• Reusabilidade
– permitir que classes e componentes sejam reusados em outros
módulos da mesma aplicação ou em outras aplicações
Vantagens
• O desenvolvimento da aplicação é feita de forma rápida,
simples, fácil e com um custo mais baixo
• O acesso à fonte de dados esta separada em seu próprio
componente de forma que o código da aplicação de
apresentação não possui código SQL embutido
• A informação da conexão é mantida somente no serviço
XML, minimizando a manutenção do cliente
• A camada de acesso a dados pode ser atualizada em um
único local centralizado
– Não é preciso distribuir componentes ao cliente quando houver
alterações nesta camada
• O modelo de 3 camadas tornou-se a arquitetura padrão
para sistemas corporativos com base na Web
Desvantagem
• Manter a aplicação pode se tornar uma tarefa complexa
Evolução...
• Computação em
Nuvem representa
um retorno às
origens (terminais
“burros”)???
Desenvolvimento de Sistemas Web - Conceitos Básicos
Web Server
• Programa de computador responsável por aceitar
pedidos HTTP de clientes, geralmente os navegadores, e
servi-los com respostas HTTP, incluindo opcionalmente
dados, que geralmente são páginas Web, tais como
documentos HTML com objetos embutidos (imagens,
sons, etc.)
– ou um computador que executa um programa que provê a
funcionalidade descrita anteriormente
• O uso mais comum é a hospedagem de sites Web, mas
também podem ser usados para jogos, armazenamento
de dados, execução de aplicações empresariais,
manipulação de e-mail, FTP ou outros usos da Web
Web Servers Mais Populares
• Apache Tomcat da Apache
– http://tomcat.apache.org
• Internet Information Server (IIS) da Microsoft
– http://www.iis.net
• Nginx (engine-ex) da Nginx, Inc.
– http://nginx.com/
• Google Web Server (GWS) da Google
• Glassfish da Oracle
Mercado
Desenvolvimento de Sistemas Web - Conceitos Básicos
Bancos de Dados
• Um Sistema de Gerenciamento de Banco de Dados (SGBD) –
do inglês Data Base Management System (DBMS) – é o
conjunto de programas responsáveis pelo gerenciamento de
uma base de dados
• Seu principal objetivo é retirar da aplicação cliente a
responsabilidade de gerenciar o acesso, a manipulação e a
organização dos dados
• O SGBD disponibiliza uma interface para que seus clientes
possam incluir, alterar ou consultar dados previamente
armazenados
• Em bancos de dados relacionais a interface é constituída pelas
APIs (Application Programming Interface) ou drivers do SGBD,
que executam comandos na linguagem SQL (Structured Query
Language)
Principais SGBDs Pagos
• Oracle
• MySQL da Oracle
• Microsoft SQL Server
• Microsoft Access
• Sybase
• IBM DB2
• IBM Informix
• Teradata
• Ingres da Actian
• SimpleDb da Amazon
Principais SGBDs Gratuitos
• MySQL da Oracle
• MariaDB
• PostgreSQL
• SimpleDb da Amazon
• MongoDB
• Firebird
• SQLite
• Cassandra
Ranking
Fonte: http://db-engines.com/
Open Source
Desenvolvimento de Sistemas Web - Conceitos Básicos
IDE
• IDE, do inglês Integrated Development Environment ou
Ambiente Integrado de Desenvolvimento, é um programa
de computador que reúne características e ferramentas
de apoio ao desenvolvimento de software com o objetivo
de agilizar este processo
• Geralmente os IDEs facilitam a técnica de RAD (de Rapid
Application Development, ou Desenvolvimento Rápido de
Aplicações), que visa a maior produtividade dos
desenvolvedores
Características
• Editor
– edita o código-fonte do programa escrito na(s) linguagem(ns) que a
IDE dá suporte
• Compilador (compiler)
– compila o código-fonte do programa, editado em uma linguagem
específica e a transforma em linguagem de máquina
• Linker
– une os vários "pedaços" de código-fonte, compilados em linguagem
de máquina, em um programa executável que pode ser executado em
um computador ou outro dispositivo computacional
• Depurador (debugger)
– auxilia no processo de encontrar e corrigir defeitos no código-fonte
do programa, na tentativa de aprimorar a qualidade de software
Características
• Modelagem (modeling)
– criação do modelo de classes, objetos, interfaces, associações e
interações dos artefatos envolvidos no software
• Geração de código
– característica mais explorada em Ferramentas CASE, a geração de
código também é encontrada em IDEs, contudo com um escopo mais
direcionado a templates de código comumente utilizados para
solucionar problemas rotineiros
– Todavia, em conjunto com ferramentas de modelagem, a geração
pode gerar praticamente todo o código-fonte do programa com base
no modelo proposto, tornando muito mais rápido o processo de
desenvolvimento e distribuição do software
• Distribuição (deploy)
– auxilia no processo de criação do instalador do software, ou outra
forma de distribuição, seja discos ou via Internet
Características
• Testes Automatizados (automated tests)
– realiza testes no software de forma automatizada, com base em
scripts ou programas de testes previamente especificados,
gerando um relatório, assim auxiliando na análise do impacto
das alterações no código-fonte
• Refatoração (refactoring)
– consiste na melhoria constante do código-fonte do software,
seja na construção de código mais otimizado, mais limpo e/ou
com melhor entendimento pelos envolvidos no
desenvolvimento do software
IDEs Mais Utilizadas
• Microsoft Visual Studio
• Eclipse
• NetBeans
• Kate, gedit, Vim (editores de texto linux)
• Flash Builder
• IntelliJ IDEA
• Delphi
• ...
IDE x Linguagem de Programação
(http://programmers.stackexchange.com/)
• C# - Visual Studio, SharpDevelop
• Java - Eclipse, NetBeans, IDEA
• Objective-C - Xcode
• Delphi - RAD Studio
• Object Pascal - Delphi, Lazarus
• C, C++ - Visual Studio, Vim
• ASP - Visual Studio
• PL/SQL - RapidSQL, Oracle SQLDeveloper
• PHP - Eclipse, NetBeans, Nusphere PHPed
• Actionscript (AS2, AS3) - FlashDevelop
IDE x Linguagem de Programação
(http://programmers.stackexchange.com/)
• Flex - Flash Builder 4
• Python - Eclipse, IDLE
• Perl - Padre
• Common Lisp - Lispworks, Emacs
• Ruby - TextMate
• Haskell - Vim
• Fortran - Vim
• Visual Basic - Visual Studio
• Para melhor análise ver:
http://en.wikipedia.org/wiki/Comparison_of_integrated_developm
ent_environments
Desenvolvimento de Sistemas Web - Conceitos Básicos
Referências
• Wikipedia (http://pt.wikipedia.org/)
• ROBBINS, J. N. Learning Web Design 4th ed. O’Reilly,
2012.
UNIVERSIDADE ESTADUAL DO SUDOESTE DA BAHIA
CURSO DE CIÊNCIA DA COMPUTAÇÃO
DESENVOLVIMENTO DE SISTEMAS WEB – 2015.2
Fábio M. Pereira
(fabio.mpereira@uesb.edu.br)

Mais conteúdo relacionado

Mais procurados

Aula01 - Logica de Programação
Aula01 - Logica de ProgramaçãoAula01 - Logica de Programação
Aula01 - Logica de Programação
Jorge Ávila Miranda
 
Visualg
VisualgVisualg
Visualg
Pedro Silva
 
Introdução a programação para a Internet
Introdução a programação para a InternetIntrodução a programação para a Internet
Introdução a programação para a Internet
Leonardo Soares
 
Aula 1 - Introdução a POO
Aula 1 -  Introdução a POOAula 1 -  Introdução a POO
Aula 1 - Introdução a POO
Daniel Brandão
 
Sistemas operacionais
Sistemas operacionaisSistemas operacionais
Sistemas operacionais
vini_campos
 
Rede de computadores
Rede de computadoresRede de computadores
Rede de computadores
Jairo Soares Dolores Mosca
 
Lógica de programação { para iniciantes }
Lógica de programação { para iniciantes }Lógica de programação { para iniciantes }
Lógica de programação { para iniciantes }
Mariana Camargo
 
Curso de HTML5 - Aula 01
Curso de HTML5 - Aula 01   Curso de HTML5 - Aula 01
Curso de HTML5 - Aula 01
Léo Dias
 
Aula 02 - Introdução ao PHP
Aula 02 - Introdução ao PHPAula 02 - Introdução ao PHP
Aula 02 - Introdução ao PHP
Daniel Brandão
 
Protocolos de Redes
Protocolos de RedesProtocolos de Redes
Protocolos de Redes
Wellington Oliveira
 
Apresentação de Redes
Apresentação de RedesApresentação de Redes
Apresentação de Redes
CDP_Online
 
Redes de computadores
Redes de computadoresRedes de computadores
Redes de computadores
Jakson Silva
 
1.Introdução Banco de Dados
1.Introdução Banco de Dados1.Introdução Banco de Dados
1.Introdução Banco de Dados
vini_campos
 
Banco de Dados - Introdução - Projeto de Banco de Dados - DER
Banco de Dados - Introdução - Projeto de Banco de Dados - DERBanco de Dados - Introdução - Projeto de Banco de Dados - DER
Banco de Dados - Introdução - Projeto de Banco de Dados - DER
Rangel Javier
 
Programação orientada a objetos
Programação orientada a objetosProgramação orientada a objetos
Programação orientada a objetos
Cleyton Ferrari
 
Segurança da informação
Segurança da informaçãoSegurança da informação
Segurança da informação
Emerson Rocha
 
Aula 1 - Introdução ao Conteúdo de Banco de Dados
Aula 1 - Introdução ao Conteúdo de Banco de DadosAula 1 - Introdução ao Conteúdo de Banco de Dados
Aula 1 - Introdução ao Conteúdo de Banco de Dados
Henrique Nunweiler
 
Aula 1: Conceitos de redes sem fio
Aula 1: Conceitos de redes sem fioAula 1: Conceitos de redes sem fio
Aula 1: Conceitos de redes sem fio
camila_seixas
 
Slide internet
Slide   internetSlide   internet
Slide internet
Claudinéia da Silva
 
Introdução à sistemas distribuídos
Introdução à sistemas distribuídosIntrodução à sistemas distribuídos
Introdução à sistemas distribuídos
Faculdade Mater Christi
 

Mais procurados (20)

Aula01 - Logica de Programação
Aula01 - Logica de ProgramaçãoAula01 - Logica de Programação
Aula01 - Logica de Programação
 
Visualg
VisualgVisualg
Visualg
 
Introdução a programação para a Internet
Introdução a programação para a InternetIntrodução a programação para a Internet
Introdução a programação para a Internet
 
Aula 1 - Introdução a POO
Aula 1 -  Introdução a POOAula 1 -  Introdução a POO
Aula 1 - Introdução a POO
 
Sistemas operacionais
Sistemas operacionaisSistemas operacionais
Sistemas operacionais
 
Rede de computadores
Rede de computadoresRede de computadores
Rede de computadores
 
Lógica de programação { para iniciantes }
Lógica de programação { para iniciantes }Lógica de programação { para iniciantes }
Lógica de programação { para iniciantes }
 
Curso de HTML5 - Aula 01
Curso de HTML5 - Aula 01   Curso de HTML5 - Aula 01
Curso de HTML5 - Aula 01
 
Aula 02 - Introdução ao PHP
Aula 02 - Introdução ao PHPAula 02 - Introdução ao PHP
Aula 02 - Introdução ao PHP
 
Protocolos de Redes
Protocolos de RedesProtocolos de Redes
Protocolos de Redes
 
Apresentação de Redes
Apresentação de RedesApresentação de Redes
Apresentação de Redes
 
Redes de computadores
Redes de computadoresRedes de computadores
Redes de computadores
 
1.Introdução Banco de Dados
1.Introdução Banco de Dados1.Introdução Banco de Dados
1.Introdução Banco de Dados
 
Banco de Dados - Introdução - Projeto de Banco de Dados - DER
Banco de Dados - Introdução - Projeto de Banco de Dados - DERBanco de Dados - Introdução - Projeto de Banco de Dados - DER
Banco de Dados - Introdução - Projeto de Banco de Dados - DER
 
Programação orientada a objetos
Programação orientada a objetosProgramação orientada a objetos
Programação orientada a objetos
 
Segurança da informação
Segurança da informaçãoSegurança da informação
Segurança da informação
 
Aula 1 - Introdução ao Conteúdo de Banco de Dados
Aula 1 - Introdução ao Conteúdo de Banco de DadosAula 1 - Introdução ao Conteúdo de Banco de Dados
Aula 1 - Introdução ao Conteúdo de Banco de Dados
 
Aula 1: Conceitos de redes sem fio
Aula 1: Conceitos de redes sem fioAula 1: Conceitos de redes sem fio
Aula 1: Conceitos de redes sem fio
 
Slide internet
Slide   internetSlide   internet
Slide internet
 
Introdução à sistemas distribuídos
Introdução à sistemas distribuídosIntrodução à sistemas distribuídos
Introdução à sistemas distribuídos
 

Destaque

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
 
Engenharia de software para Web
Engenharia de software para WebEngenharia de software para Web
Engenharia de software para Web
Iuri Matos
 
Desenvolvimento de Sistemas Web - HTML5 - Introdução
Desenvolvimento de Sistemas Web - HTML5 - IntroduçãoDesenvolvimento de Sistemas Web - HTML5 - Introdução
Desenvolvimento de Sistemas Web - HTML5 - Introdução
Fabio Moura Pereira
 
Engenharia de Software para Aplicacões Web + Conceitos e Fundamentos de Phonegap
Engenharia de Software para Aplicacões Web + Conceitos e Fundamentos de PhonegapEngenharia de Software para Aplicacões Web + Conceitos e Fundamentos de Phonegap
Engenharia de Software para Aplicacões Web + Conceitos e Fundamentos de Phonegap
Artur Magalhães
 
Principais Tecnologias WEB
Principais Tecnologias WEBPrincipais Tecnologias WEB
Principais Tecnologias WEB
Softdesign Agência Web
 
Aula Prolog - 05
Aula Prolog - 05Aula Prolog - 05
Aula Prolog - 05
Fabio Moura Pereira
 
04 - Gerenciamento de Threads - II
04 -  Gerenciamento de Threads - II04 -  Gerenciamento de Threads - II
04 - Gerenciamento de Threads - II
Fabio Moura Pereira
 
Haskell - Introdução
Haskell - IntroduçãoHaskell - Introdução
Haskell - Introdução
Fabio Moura Pereira
 
Aula 05 - Java Script Básico
Aula 05 -  Java Script BásicoAula 05 -  Java Script Básico
Aula 05 - Java Script Básico
Fabio Moura Pereira
 
05 - Sincronização de Threads - I
05 - Sincronização de Threads - I05 - Sincronização de Threads - I
05 - Sincronização de Threads - I
Fabio Moura Pereira
 
Programação Concorrente - Gerenciamento de Threads - Parte II
Programação Concorrente - Gerenciamento de Threads - Parte IIProgramação Concorrente - Gerenciamento de Threads - Parte II
Programação Concorrente - Gerenciamento de Threads - Parte II
Fabio Moura Pereira
 
Curso de Desenvolvimento de Sistemas Web - (X)HTML
Curso de Desenvolvimento de Sistemas Web - (X)HTMLCurso de Desenvolvimento de Sistemas Web - (X)HTML
Curso de Desenvolvimento de Sistemas Web - (X)HTML
Fabio Moura Pereira
 
Aula de Desenvolvimento de Sistemas Web - CSS3
Aula de Desenvolvimento de Sistemas Web - CSS3Aula de Desenvolvimento de Sistemas Web - CSS3
Aula de Desenvolvimento de Sistemas Web - CSS3
Fabio Moura Pereira
 
Introdução ao desenvolvimento de páginas web estáticas
Introdução ao desenvolvimento de páginas web estáticasIntrodução ao desenvolvimento de páginas web estáticas
Introdução ao desenvolvimento de páginas web estáticas
Susana Oliveira
 
Curso de PHP - Objetos
Curso de PHP - ObjetosCurso de PHP - Objetos
Curso de PHP - Objetos
Fabio Moura Pereira
 
Aula de Prolog 07 - Estruturas de Dados
Aula de Prolog 07 - Estruturas de DadosAula de Prolog 07 - Estruturas de Dados
Aula de Prolog 07 - Estruturas de Dados
Fabio Moura Pereira
 
Aula de Prolog 08 - Unificação
Aula de Prolog 08 - UnificaçãoAula de Prolog 08 - Unificação
Aula de Prolog 08 - Unificação
Fabio Moura Pereira
 
Aula Prolog 03
Aula Prolog 03Aula Prolog 03
Aula Prolog 03
Fabio Moura Pereira
 
Aula Persistência 01 (Java)
Aula Persistência 01 (Java)Aula Persistência 01 (Java)
Aula Persistência 01 (Java)
Fabio Moura Pereira
 
Aula Tratamento de Exceções
Aula Tratamento de ExceçõesAula Tratamento de Exceções
Aula Tratamento de Exceções
Fabio Moura Pereira
 

Destaque (20)

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.
 
Engenharia de software para Web
Engenharia de software para WebEngenharia de software para Web
Engenharia de software para Web
 
Desenvolvimento de Sistemas Web - HTML5 - Introdução
Desenvolvimento de Sistemas Web - HTML5 - IntroduçãoDesenvolvimento de Sistemas Web - HTML5 - Introdução
Desenvolvimento de Sistemas Web - HTML5 - Introdução
 
Engenharia de Software para Aplicacões Web + Conceitos e Fundamentos de Phonegap
Engenharia de Software para Aplicacões Web + Conceitos e Fundamentos de PhonegapEngenharia de Software para Aplicacões Web + Conceitos e Fundamentos de Phonegap
Engenharia de Software para Aplicacões Web + Conceitos e Fundamentos de Phonegap
 
Principais Tecnologias WEB
Principais Tecnologias WEBPrincipais Tecnologias WEB
Principais Tecnologias WEB
 
Aula Prolog - 05
Aula Prolog - 05Aula Prolog - 05
Aula Prolog - 05
 
04 - Gerenciamento de Threads - II
04 -  Gerenciamento de Threads - II04 -  Gerenciamento de Threads - II
04 - Gerenciamento de Threads - II
 
Haskell - Introdução
Haskell - IntroduçãoHaskell - Introdução
Haskell - Introdução
 
Aula 05 - Java Script Básico
Aula 05 -  Java Script BásicoAula 05 -  Java Script Básico
Aula 05 - Java Script Básico
 
05 - Sincronização de Threads - I
05 - Sincronização de Threads - I05 - Sincronização de Threads - I
05 - Sincronização de Threads - I
 
Programação Concorrente - Gerenciamento de Threads - Parte II
Programação Concorrente - Gerenciamento de Threads - Parte IIProgramação Concorrente - Gerenciamento de Threads - Parte II
Programação Concorrente - Gerenciamento de Threads - Parte II
 
Curso de Desenvolvimento de Sistemas Web - (X)HTML
Curso de Desenvolvimento de Sistemas Web - (X)HTMLCurso de Desenvolvimento de Sistemas Web - (X)HTML
Curso de Desenvolvimento de Sistemas Web - (X)HTML
 
Aula de Desenvolvimento de Sistemas Web - CSS3
Aula de Desenvolvimento de Sistemas Web - CSS3Aula de Desenvolvimento de Sistemas Web - CSS3
Aula de Desenvolvimento de Sistemas Web - CSS3
 
Introdução ao desenvolvimento de páginas web estáticas
Introdução ao desenvolvimento de páginas web estáticasIntrodução ao desenvolvimento de páginas web estáticas
Introdução ao desenvolvimento de páginas web estáticas
 
Curso de PHP - Objetos
Curso de PHP - ObjetosCurso de PHP - Objetos
Curso de PHP - Objetos
 
Aula de Prolog 07 - Estruturas de Dados
Aula de Prolog 07 - Estruturas de DadosAula de Prolog 07 - Estruturas de Dados
Aula de Prolog 07 - Estruturas de Dados
 
Aula de Prolog 08 - Unificação
Aula de Prolog 08 - UnificaçãoAula de Prolog 08 - Unificação
Aula de Prolog 08 - Unificação
 
Aula Prolog 03
Aula Prolog 03Aula Prolog 03
Aula Prolog 03
 
Aula Persistência 01 (Java)
Aula Persistência 01 (Java)Aula Persistência 01 (Java)
Aula Persistência 01 (Java)
 
Aula Tratamento de Exceções
Aula Tratamento de ExceçõesAula Tratamento de Exceções
Aula Tratamento de Exceções
 

Semelhante a Desenvolvimento de Sistemas Web - Conceitos Básicos

Apostila internet
Apostila internetApostila internet
Apostila internet
Prof J.Trajano
 
Aula 01
Aula 01Aula 01
A internet é um conglomerado de redes em escala mundial de milhões de computa...
A internet é um conglomerado de redes em escala mundial de milhões de computa...A internet é um conglomerado de redes em escala mundial de milhões de computa...
A internet é um conglomerado de redes em escala mundial de milhões de computa...
r22u22b22e22n22
 
Html web denise_lima
Html web denise_limaHtml web denise_lima
Html web denise_lima
Denise Lima
 
Internet.ppt
Internet.pptInternet.ppt
Internet.ppt
wellintondepauloRoma
 
Internet.ppt
Internet.pptInternet.ppt
Internet.ppt
EbersonPacheco2
 
Teoria da internet slides 8 (Internet t2).ppt
Teoria da internet  slides 8 (Internet t2).pptTeoria da internet  slides 8 (Internet t2).ppt
Teoria da internet slides 8 (Internet t2).ppt
LinaKelly3
 
INTERNET - Histórico e Funcionamento
INTERNET - Histórico e FuncionamentoINTERNET - Histórico e Funcionamento
INTERNET - Histórico e Funcionamento
Christian Bisacchi Devezas
 
Internet
InternetInternet
Internet
Mateus Nogueira
 
A origem e evolução da Internet
A origem e evolução da InternetA origem e evolução da Internet
A origem e evolução da Internet
Pepe Rocker
 
Curso Básico de Internet - Parte I
Curso Básico de Internet - Parte ICurso Básico de Internet - Parte I
Curso Básico de Internet - Parte I
ABCursos OnLine
 
Tcp
TcpTcp
Histórico e Funcionamento da Internet
Histórico e Funcionamento da InternetHistórico e Funcionamento da Internet
Histórico e Funcionamento da Internet
Christian Devezas
 
Internet
InternetInternet
Internet
hendersonfaria
 
Internet
InternetInternet
Internet
Felipe Pereira
 
Programacao para Web I 02 Internet
Programacao para Web I 02  InternetProgramacao para Web I 02  Internet
Programacao para Web I 02 Internet
DESIGN DIGITAL UNIARA 2012
 
Internet.pdf
Internet.pdfInternet.pdf
Internet.pdf
Bandeira Jorge
 
Convergencia e interoperabilidade 2.2013
Convergencia e interoperabilidade 2.2013Convergencia e interoperabilidade 2.2013
Convergencia e interoperabilidade 2.2013
viviansg
 
Redes arquitetura tcp-ip parte 1
Redes   arquitetura tcp-ip parte 1Redes   arquitetura tcp-ip parte 1
Redes arquitetura tcp-ip parte 1
Felipe Pereira
 
A origem e evolução da Internet
A origem e evolução da InternetA origem e evolução da Internet
A origem e evolução da Internet
Pepe Rocker
 

Semelhante a Desenvolvimento de Sistemas Web - Conceitos Básicos (20)

Apostila internet
Apostila internetApostila internet
Apostila internet
 
Aula 01
Aula 01Aula 01
Aula 01
 
A internet é um conglomerado de redes em escala mundial de milhões de computa...
A internet é um conglomerado de redes em escala mundial de milhões de computa...A internet é um conglomerado de redes em escala mundial de milhões de computa...
A internet é um conglomerado de redes em escala mundial de milhões de computa...
 
Html web denise_lima
Html web denise_limaHtml web denise_lima
Html web denise_lima
 
Internet.ppt
Internet.pptInternet.ppt
Internet.ppt
 
Internet.ppt
Internet.pptInternet.ppt
Internet.ppt
 
Teoria da internet slides 8 (Internet t2).ppt
Teoria da internet  slides 8 (Internet t2).pptTeoria da internet  slides 8 (Internet t2).ppt
Teoria da internet slides 8 (Internet t2).ppt
 
INTERNET - Histórico e Funcionamento
INTERNET - Histórico e FuncionamentoINTERNET - Histórico e Funcionamento
INTERNET - Histórico e Funcionamento
 
Internet
InternetInternet
Internet
 
A origem e evolução da Internet
A origem e evolução da InternetA origem e evolução da Internet
A origem e evolução da Internet
 
Curso Básico de Internet - Parte I
Curso Básico de Internet - Parte ICurso Básico de Internet - Parte I
Curso Básico de Internet - Parte I
 
Tcp
TcpTcp
Tcp
 
Histórico e Funcionamento da Internet
Histórico e Funcionamento da InternetHistórico e Funcionamento da Internet
Histórico e Funcionamento da Internet
 
Internet
InternetInternet
Internet
 
Internet
InternetInternet
Internet
 
Programacao para Web I 02 Internet
Programacao para Web I 02  InternetProgramacao para Web I 02  Internet
Programacao para Web I 02 Internet
 
Internet.pdf
Internet.pdfInternet.pdf
Internet.pdf
 
Convergencia e interoperabilidade 2.2013
Convergencia e interoperabilidade 2.2013Convergencia e interoperabilidade 2.2013
Convergencia e interoperabilidade 2.2013
 
Redes arquitetura tcp-ip parte 1
Redes   arquitetura tcp-ip parte 1Redes   arquitetura tcp-ip parte 1
Redes arquitetura tcp-ip parte 1
 
A origem e evolução da Internet
A origem e evolução da InternetA origem e evolução da Internet
A origem e evolução da Internet
 

Mais de Fabio Moura Pereira

Aula Prolog 09 - Listas
Aula Prolog 09 - ListasAula Prolog 09 - Listas
Aula Prolog 09 - Listas
Fabio Moura Pereira
 
Aula de Prolog 06 - Recursão
Aula de Prolog 06 - RecursãoAula de Prolog 06 - Recursão
Aula de Prolog 06 - Recursão
Fabio Moura Pereira
 
Prolog 04 - Regras
Prolog 04 - RegrasProlog 04 - Regras
Prolog 04 - Regras
Fabio Moura Pereira
 
Aula Prolog 02
Aula Prolog 02Aula Prolog 02
Aula Prolog 02
Fabio Moura Pereira
 
Aula Prolog 01
Aula Prolog 01Aula Prolog 01
Aula Prolog 01
Fabio Moura Pereira
 
Programação Concorrente - Gerenciamento de Threads - Parte I
Programação Concorrente - Gerenciamento de Threads - Parte IProgramação Concorrente - Gerenciamento de Threads - Parte I
Programação Concorrente - Gerenciamento de Threads - Parte I
Fabio Moura Pereira
 
Programação Concorrente - Objetos e Concorrência
Programação Concorrente - Objetos e ConcorrênciaProgramação Concorrente - Objetos e Concorrência
Programação Concorrente - Objetos e Concorrência
Fabio Moura Pereira
 
Programação Concorrente - Introdução
Programação Concorrente - IntroduçãoProgramação Concorrente - Introdução
Programação Concorrente - Introdução
Fabio Moura Pereira
 
Aula Interface Gráfica do Usuário
Aula Interface Gráfica do UsuárioAula Interface Gráfica do Usuário
Aula Interface Gráfica do Usuário
Fabio Moura Pereira
 
Aula Java Swing
Aula Java SwingAula Java Swing
Aula Java Swing
Fabio Moura Pereira
 
Aula - Interfaces e Estilos de Interação
Aula - Interfaces e Estilos de InteraçãoAula - Interfaces e Estilos de Interação
Aula - Interfaces e Estilos de Interação
Fabio Moura Pereira
 
Aula Desenvolvimento de Jogos - Game Engine (Motor de Jogos)
Aula Desenvolvimento de Jogos - Game Engine (Motor de Jogos)Aula Desenvolvimento de Jogos - Game Engine (Motor de Jogos)
Aula Desenvolvimento de Jogos - Game Engine (Motor de Jogos)
Fabio Moura Pereira
 
Padrões de Projeto de Software
Padrões de Projeto de SoftwarePadrões de Projeto de Software
Padrões de Projeto de Software
Fabio Moura Pereira
 
Curso de PHP - Arrays
Curso de PHP - ArraysCurso de PHP - Arrays
Curso de PHP - Arrays
Fabio Moura Pereira
 
Desenvolvimento de Jogos - Game Design
Desenvolvimento de Jogos - Game DesignDesenvolvimento de Jogos - Game Design
Desenvolvimento de Jogos - Game Design
Fabio Moura Pereira
 
Desenvolvimento de Jogos - Mercado Parte 2
Desenvolvimento de Jogos - Mercado Parte 2Desenvolvimento de Jogos - Mercado Parte 2
Desenvolvimento de Jogos - Mercado Parte 2
Fabio Moura Pereira
 
Desenvolvimento de Jogos - Mercado Parte 1
Desenvolvimento de Jogos - Mercado Parte 1Desenvolvimento de Jogos - Mercado Parte 1
Desenvolvimento de Jogos - Mercado Parte 1
Fabio Moura Pereira
 
PHP - Funções
PHP - FunçõesPHP - Funções
PHP - Funções
Fabio Moura Pereira
 
PHP - Introdução
PHP - IntroduçãoPHP - Introdução
PHP - Introdução
Fabio Moura Pereira
 

Mais de Fabio Moura Pereira (19)

Aula Prolog 09 - Listas
Aula Prolog 09 - ListasAula Prolog 09 - Listas
Aula Prolog 09 - Listas
 
Aula de Prolog 06 - Recursão
Aula de Prolog 06 - RecursãoAula de Prolog 06 - Recursão
Aula de Prolog 06 - Recursão
 
Prolog 04 - Regras
Prolog 04 - RegrasProlog 04 - Regras
Prolog 04 - Regras
 
Aula Prolog 02
Aula Prolog 02Aula Prolog 02
Aula Prolog 02
 
Aula Prolog 01
Aula Prolog 01Aula Prolog 01
Aula Prolog 01
 
Programação Concorrente - Gerenciamento de Threads - Parte I
Programação Concorrente - Gerenciamento de Threads - Parte IProgramação Concorrente - Gerenciamento de Threads - Parte I
Programação Concorrente - Gerenciamento de Threads - Parte I
 
Programação Concorrente - Objetos e Concorrência
Programação Concorrente - Objetos e ConcorrênciaProgramação Concorrente - Objetos e Concorrência
Programação Concorrente - Objetos e Concorrência
 
Programação Concorrente - Introdução
Programação Concorrente - IntroduçãoProgramação Concorrente - Introdução
Programação Concorrente - Introdução
 
Aula Interface Gráfica do Usuário
Aula Interface Gráfica do UsuárioAula Interface Gráfica do Usuário
Aula Interface Gráfica do Usuário
 
Aula Java Swing
Aula Java SwingAula Java Swing
Aula Java Swing
 
Aula - Interfaces e Estilos de Interação
Aula - Interfaces e Estilos de InteraçãoAula - Interfaces e Estilos de Interação
Aula - Interfaces e Estilos de Interação
 
Aula Desenvolvimento de Jogos - Game Engine (Motor de Jogos)
Aula Desenvolvimento de Jogos - Game Engine (Motor de Jogos)Aula Desenvolvimento de Jogos - Game Engine (Motor de Jogos)
Aula Desenvolvimento de Jogos - Game Engine (Motor de Jogos)
 
Padrões de Projeto de Software
Padrões de Projeto de SoftwarePadrões de Projeto de Software
Padrões de Projeto de Software
 
Curso de PHP - Arrays
Curso de PHP - ArraysCurso de PHP - Arrays
Curso de PHP - Arrays
 
Desenvolvimento de Jogos - Game Design
Desenvolvimento de Jogos - Game DesignDesenvolvimento de Jogos - Game Design
Desenvolvimento de Jogos - Game Design
 
Desenvolvimento de Jogos - Mercado Parte 2
Desenvolvimento de Jogos - Mercado Parte 2Desenvolvimento de Jogos - Mercado Parte 2
Desenvolvimento de Jogos - Mercado Parte 2
 
Desenvolvimento de Jogos - Mercado Parte 1
Desenvolvimento de Jogos - Mercado Parte 1Desenvolvimento de Jogos - Mercado Parte 1
Desenvolvimento de Jogos - Mercado Parte 1
 
PHP - Funções
PHP - FunçõesPHP - Funções
PHP - Funções
 
PHP - Introdução
PHP - IntroduçãoPHP - Introdução
PHP - Introdução
 

Último

A perspectiva colaborativa e as novas práticas de inclusão. (1).pptx
A perspectiva colaborativa e as novas práticas de inclusão. (1).pptxA perspectiva colaborativa e as novas práticas de inclusão. (1).pptx
A perspectiva colaborativa e as novas práticas de inclusão. (1).pptx
marcos oliveira
 
Se A Música É O Alimento do Amor Não Parem de Tocar Luzia Gabriele.ppsx
Se A Música É O Alimento do Amor Não Parem de Tocar Luzia Gabriele.ppsxSe A Música É O Alimento do Amor Não Parem de Tocar Luzia Gabriele.ppsx
Se A Música É O Alimento do Amor Não Parem de Tocar Luzia Gabriele.ppsx
Luzia Gabriele
 
Noite Alva! José Ernesto Ferraresso.ppsx
Noite Alva! José Ernesto Ferraresso.ppsxNoite Alva! José Ernesto Ferraresso.ppsx
Noite Alva! José Ernesto Ferraresso.ppsx
Luzia Gabriele
 
Texto e atividade - O que fazemos com a água que usamos.
Texto e atividade -  O que fazemos com a água que usamos.Texto e atividade -  O que fazemos com a água que usamos.
Texto e atividade - O que fazemos com a água que usamos.
Mary Alvarenga
 
Caça-palavras e cruzadinha - Encontros consonantais.
Caça-palavras e cruzadinha -  Encontros consonantais.Caça-palavras e cruzadinha -  Encontros consonantais.
Caça-palavras e cruzadinha - Encontros consonantais.
Mary Alvarenga
 
Ideais do Ministério jovem Adventista pdf
Ideais do Ministério jovem Adventista pdfIdeais do Ministério jovem Adventista pdf
Ideais do Ministério jovem Adventista pdf
Anesio2
 
Relatório de Atividades 2021/2022 CENSIPAM.pdf
Relatório de Atividades 2021/2022 CENSIPAM.pdfRelatório de Atividades 2021/2022 CENSIPAM.pdf
Relatório de Atividades 2021/2022 CENSIPAM.pdf
Falcão Brasil
 
Relatório de Atividades 2017 CENSIPAM.pdf
Relatório de Atividades 2017 CENSIPAM.pdfRelatório de Atividades 2017 CENSIPAM.pdf
Relatório de Atividades 2017 CENSIPAM.pdf
Falcão Brasil
 
Slides Lição 2, Betel, A Igreja e a relevância, para a adoração verdadeira no...
Slides Lição 2, Betel, A Igreja e a relevância, para a adoração verdadeira no...Slides Lição 2, Betel, A Igreja e a relevância, para a adoração verdadeira no...
Slides Lição 2, Betel, A Igreja e a relevância, para a adoração verdadeira no...
LuizHenriquedeAlmeid6
 
Trabalho Colaborativo na educação especial.pdf
Trabalho Colaborativo na educação especial.pdfTrabalho Colaborativo na educação especial.pdf
Trabalho Colaborativo na educação especial.pdf
marcos oliveira
 
Resolução do Exame de Biologia UEM - 2008.
Resolução do Exame de Biologia UEM - 2008.Resolução do Exame de Biologia UEM - 2008.
Resolução do Exame de Biologia UEM - 2008.
mozalgebrista
 
Plano Analitico de Psicopedagogia -11 Classe- II Trimestre - 2024_014203.docx
Plano Analitico de Psicopedagogia -11 Classe- II Trimestre - 2024_014203.docxPlano Analitico de Psicopedagogia -11 Classe- II Trimestre - 2024_014203.docx
Plano Analitico de Psicopedagogia -11 Classe- II Trimestre - 2024_014203.docx
IsaiasJohaneSimango
 
Atividade Dias dos Pais - Meu Pai, Razão da Minha História.
Atividade Dias dos Pais -  Meu Pai, Razão da Minha História.Atividade Dias dos Pais -  Meu Pai, Razão da Minha História.
Atividade Dias dos Pais - Meu Pai, Razão da Minha História.
Mary Alvarenga
 
LEMBRANCINHA Para-MENSAGEM de -FERIAS.pdf
LEMBRANCINHA Para-MENSAGEM de -FERIAS.pdfLEMBRANCINHA Para-MENSAGEM de -FERIAS.pdf
LEMBRANCINHA Para-MENSAGEM de -FERIAS.pdf
LucliaMartins5
 
Manejo de plantas daninhas
Manejo de plantas daninhasManejo de plantas daninhas
Manejo de plantas daninhas
Geagra UFG
 
Alfabetização de adultos.pdf
Alfabetização de             adultos.pdfAlfabetização de             adultos.pdf
Alfabetização de adultos.pdf
arodatos81
 
Oficina de bases de dados - Dimensions.pdf
Oficina de bases de dados - Dimensions.pdfOficina de bases de dados - Dimensions.pdf
Oficina de bases de dados - Dimensions.pdf
beathrizalves131
 
TEORIAS UECE.pdf química geral nome de cientistas famosos da química
TEORIAS UECE.pdf química geral nome de cientistas famosos da químicaTEORIAS UECE.pdf química geral nome de cientistas famosos da química
TEORIAS UECE.pdf química geral nome de cientistas famosos da química
VictorEmanoel37
 
A experiência do professor. Publicado EM 08.07.2024
A experiência do professor. Publicado EM 08.07.2024A experiência do professor. Publicado EM 08.07.2024
A experiência do professor. Publicado EM 08.07.2024
Espanhol Online
 
Relatório de Atividades 2015 CENSIPAM.pdf
Relatório de Atividades 2015 CENSIPAM.pdfRelatório de Atividades 2015 CENSIPAM.pdf
Relatório de Atividades 2015 CENSIPAM.pdf
Falcão Brasil
 

Último (20)

A perspectiva colaborativa e as novas práticas de inclusão. (1).pptx
A perspectiva colaborativa e as novas práticas de inclusão. (1).pptxA perspectiva colaborativa e as novas práticas de inclusão. (1).pptx
A perspectiva colaborativa e as novas práticas de inclusão. (1).pptx
 
Se A Música É O Alimento do Amor Não Parem de Tocar Luzia Gabriele.ppsx
Se A Música É O Alimento do Amor Não Parem de Tocar Luzia Gabriele.ppsxSe A Música É O Alimento do Amor Não Parem de Tocar Luzia Gabriele.ppsx
Se A Música É O Alimento do Amor Não Parem de Tocar Luzia Gabriele.ppsx
 
Noite Alva! José Ernesto Ferraresso.ppsx
Noite Alva! José Ernesto Ferraresso.ppsxNoite Alva! José Ernesto Ferraresso.ppsx
Noite Alva! José Ernesto Ferraresso.ppsx
 
Texto e atividade - O que fazemos com a água que usamos.
Texto e atividade -  O que fazemos com a água que usamos.Texto e atividade -  O que fazemos com a água que usamos.
Texto e atividade - O que fazemos com a água que usamos.
 
Caça-palavras e cruzadinha - Encontros consonantais.
Caça-palavras e cruzadinha -  Encontros consonantais.Caça-palavras e cruzadinha -  Encontros consonantais.
Caça-palavras e cruzadinha - Encontros consonantais.
 
Ideais do Ministério jovem Adventista pdf
Ideais do Ministério jovem Adventista pdfIdeais do Ministério jovem Adventista pdf
Ideais do Ministério jovem Adventista pdf
 
Relatório de Atividades 2021/2022 CENSIPAM.pdf
Relatório de Atividades 2021/2022 CENSIPAM.pdfRelatório de Atividades 2021/2022 CENSIPAM.pdf
Relatório de Atividades 2021/2022 CENSIPAM.pdf
 
Relatório de Atividades 2017 CENSIPAM.pdf
Relatório de Atividades 2017 CENSIPAM.pdfRelatório de Atividades 2017 CENSIPAM.pdf
Relatório de Atividades 2017 CENSIPAM.pdf
 
Slides Lição 2, Betel, A Igreja e a relevância, para a adoração verdadeira no...
Slides Lição 2, Betel, A Igreja e a relevância, para a adoração verdadeira no...Slides Lição 2, Betel, A Igreja e a relevância, para a adoração verdadeira no...
Slides Lição 2, Betel, A Igreja e a relevância, para a adoração verdadeira no...
 
Trabalho Colaborativo na educação especial.pdf
Trabalho Colaborativo na educação especial.pdfTrabalho Colaborativo na educação especial.pdf
Trabalho Colaborativo na educação especial.pdf
 
Resolução do Exame de Biologia UEM - 2008.
Resolução do Exame de Biologia UEM - 2008.Resolução do Exame de Biologia UEM - 2008.
Resolução do Exame de Biologia UEM - 2008.
 
Plano Analitico de Psicopedagogia -11 Classe- II Trimestre - 2024_014203.docx
Plano Analitico de Psicopedagogia -11 Classe- II Trimestre - 2024_014203.docxPlano Analitico de Psicopedagogia -11 Classe- II Trimestre - 2024_014203.docx
Plano Analitico de Psicopedagogia -11 Classe- II Trimestre - 2024_014203.docx
 
Atividade Dias dos Pais - Meu Pai, Razão da Minha História.
Atividade Dias dos Pais -  Meu Pai, Razão da Minha História.Atividade Dias dos Pais -  Meu Pai, Razão da Minha História.
Atividade Dias dos Pais - Meu Pai, Razão da Minha História.
 
LEMBRANCINHA Para-MENSAGEM de -FERIAS.pdf
LEMBRANCINHA Para-MENSAGEM de -FERIAS.pdfLEMBRANCINHA Para-MENSAGEM de -FERIAS.pdf
LEMBRANCINHA Para-MENSAGEM de -FERIAS.pdf
 
Manejo de plantas daninhas
Manejo de plantas daninhasManejo de plantas daninhas
Manejo de plantas daninhas
 
Alfabetização de adultos.pdf
Alfabetização de             adultos.pdfAlfabetização de             adultos.pdf
Alfabetização de adultos.pdf
 
Oficina de bases de dados - Dimensions.pdf
Oficina de bases de dados - Dimensions.pdfOficina de bases de dados - Dimensions.pdf
Oficina de bases de dados - Dimensions.pdf
 
TEORIAS UECE.pdf química geral nome de cientistas famosos da química
TEORIAS UECE.pdf química geral nome de cientistas famosos da químicaTEORIAS UECE.pdf química geral nome de cientistas famosos da química
TEORIAS UECE.pdf química geral nome de cientistas famosos da química
 
A experiência do professor. Publicado EM 08.07.2024
A experiência do professor. Publicado EM 08.07.2024A experiência do professor. Publicado EM 08.07.2024
A experiência do professor. Publicado EM 08.07.2024
 
Relatório de Atividades 2015 CENSIPAM.pdf
Relatório de Atividades 2015 CENSIPAM.pdfRelatório de Atividades 2015 CENSIPAM.pdf
Relatório de Atividades 2015 CENSIPAM.pdf
 

Desenvolvimento de Sistemas Web - Conceitos Básicos

  • 1. UNIVERSIDADE ESTADUAL DO SUDOESTE DA BAHIA CURSO DE CIÊNCIA DA COMPUTAÇÃO DESENVOLVIMENTO DE SISTEMAS WEB – 2015.2 Fábio M. Pereira (fabio.mpereira@uesb.edu.br)
  • 2. Roteiro • Internet e Web • Cliente/Servidor • Navegação • URLs • Anatomia de Uma Página Web • Web Sites x Web Apps • Web 2.0 • Rich Internet Applications (RIA) • Computação em Nuvem • Arquitetura em Três Camadas • Web Server • Bancos de Dados • Frameworks e Linguagens • Referências
  • 4. Internet X Web • Internet – Uma rede de computadores conectados – Um esforço cooperativo governado por um sistema de padrões e regras – A finalidade de se conectar computadores – compartilhar informação – Existem várias maneiras pelas quais a informação pode ser passada entre computadores, incluindo e-mail, transferência de arquivos (FTP) e muitos outros modos especializados sobre os quais a Internet é construída – Estes métodos padronizados para transferência de dados ou documentos sobre uma rede são conhecidos como protocolos
  • 5. Internet X Web • Web – Originalmente chamada de World Wide Web, daí o “www” no endereço de sites – É apenas uma das maneiras de como a informação pode ser compartilhada na Internet – Ela é única por permitir que documentos possam ser ligados uns aos outros utilizando links de hipertexto – formando uma grande “teia” de informação conectada – A Web utiliza um protocolo chamado HTTP (HyperText Transfer Protocol), as primeiras quatro letras de todo endereço de site web
  • 6. Internet – Histórico • A pesquisa sobre a comutação de pacotes começou na década de 1960: – Redes de comutação de pacotes, como Mark I, no NPL no Reino Unido, ARPANET, CYCLADES, Merit Network, Tymnet e Telenet foram desenvolvidas em final dos anos 1960 e início dos anos 1970, usando uma variedade de protocolos • A ARPANET, em particular, levou ao desenvolvimento de protocolos para internetworking, onde várias redes separadas poderiam ser unidas em uma rede de redes • Os dois primeiros nós do que viria a ser a ARPANET foram interconectados entre o Network Measurement Center de Leonard Kleinrock na Escola de Engenharia e Ciências Aplicadas da UCLA e o sistema NLS de Douglas Engelbart no SRI International (SRI), em Menlo Park, Califórnia, em 29 de outubro de 1969
  • 7. Internet – Histórico • O terceiro nó da ARPANET era o Culler-Fried Interactive Mathematics Center da Universidade da Califórnia em Santa Bárbara e o quarto era o Departamento Gráfico da Universidade de Utah • Em um sinal precoce de crescimento futuro, já havia quinze sites conectados à jovem ARPANET até o final de 1971 • Em dezembro de 1974, o RFC (Request for Comments) 675 - Specification of Internet Transmission Control Program, de Vinton Cerf, Yogen Dalal e Carl Sunshine usou o termo Internet como uma abreviação para internetworking e RFCs posteriores repetiram esse termo • Em 1982, o Internet Protocol Suite (TCP/IP) foi padronizado e o conceito de uma rede mundial de redes TCP/IP totalmente interligadas chamado de Internet foi introduzido
  • 8. Internet – Histórico • O acesso à rede TCP/IP expandiu-se novamente em 1986, quando o National Science Foundation Network (NSFNET) proveu acesso a sites de supercomputadores nos Estados Unidos a partir de organizações de pesquisa e de educação, o primeiro a 56 kbit/s e, mais tarde, 1,5 Mbit/s e 45 Mbit/s • Os primeiros fornecedores de acesso à internet (ISPs) comerciais começaram a surgir no final dos anos 1980 e início dos anos 1990 • A ARPANET foi desmantelada em 1990 • A internet foi totalmente comercializada nos Estados Unidos em 1995, quando a NSFNET foi desmantelada, removendo as últimas restrições sobre o uso da internet para transportar o tráfego comercial • A internet começou uma rápida expansão para a Europa e Austrália em meados da década de 1980 e para a Ásia no final dos anos 1980 e início dos anos 1990
  • 9. Internet – Histórico • Durante a década de 1990, estimou-se que o tráfego na internet pública cresceu cerca 100% ao ano, enquanto estima-se que o crescimento anual do número de usuários seja de algo entre 20% e 50% • Gráfico mostrando a proporção de usuários de Internet a cada 100 pessoas:
  • 10. Internet – Brasil • A internet no Brasil se desenvolveu junto ao meio acadêmico e científico, e no seu início, o acesso era restrito a professores e funcionários de universidades e instituições de pesquisa • Somente no ano de 1995 a internet deixou de ser privilégio das universidades e da iniciativa privada para se tornar de acesso público • No Brasil existe o Comitê Gestor da Internet e um órgão para o registro de domínios (FAPESP - Fundação de Amparo à Pesquisa do Estado de São Paulo) • 57,6% da população tem acesso a Internet (Argentina – 55,8%, China – 45,8%, Índia – 25%, EUA – 81%, Japão – 79%, Alemanha – 84%, Suécia – 94%)
  • 11. Web - Histórico • A Organização Europeia para a Investigação Nuclear (CERN) foi a responsável pela invenção da World Wide Web • O responsável pela invenção chama-se Tim Berners-Lee, que construiu o seu primeiro computador na Universidade de Oxford, onde se formou em 1976 • Quatro anos depois, tornava-se consultor de engenharia de software no CERN e escrevia o seu primeiro programa para armazenamento de informação – chamava-se Enquire e, embora nunca tenha sido publicada, foi a base para o desenvolvimento da Web • Em 1989, propôs um projeto de hipertexto que permitia às pessoas trabalhar em conjunto, combinando o seu conhecimento numa rede de documentos – Foi esse projeto que ficou conhecido como a World Wide Web
  • 12. Web - Histórico • A Web funcionou primeiro dentro do CERN, e no Verão de 1991 foi disponibilizada mundialmente • Em 1994 Berners-Lee criou o World Wide Web Consortium (W3C - http://www.w3.org/), onde atualmente assume a função de diretor • Mais tarde, e em reconhecimento dos serviços prestados para o desenvolvimento global da Web, Tim Berners-Lee foi nomeado cavaleiro pela rainha da Inglaterra
  • 14. Cliente/Servidor • Por disponibilizar documentos sob demanda, alguns computadores são conhecidos como servidores • Mais precisamente, o servidor é o software (não o computador em si) que permite aos computadores se comunicarem com outros computadores – Embora seja comum utilizar a palavra “servidor” para se referir também ao computador • O papel do software servidor é esperar por uma requisição de informação, então reter e enviar a informação de volta tão rápido quanto possível • Não há nada de especial com o computador em si – é o software servidor que faz tudo acontecer
  • 15. Cliente/Servidor • Para que um computador possa fazer parte da Web, ele deve estar rodando um software especial para servidor Web que permita a manipulação de transações HTTP – Servidores Web também são conhecidos como servidores HTTP • Existem muitas opções de software, mas os dois mais populares são: – Apache (de código aberto) – livremente disponível para computadores baseados em Unix, Mac OS e Windows – Microsoft Internet Information Services (IIS) – parte da família de soluções de servidores da Microsoft – Glassfish da Oracle
  • 16. Cliente/Servidor • Para todo computador e dispositivo (modem, roteador, smartphone, carros, etc.) conectados à Internet é atribuído um único endereço IP (Internet Protocol) numérico – Por exemplo, o computador que hospeda oreilly.com tem o endereço IP 208.201.239.100 • Como esses números podem confundir, felizmente o Domain Name System (DNS) foi desenvolvido para permitir a nós nos referirmos a um servidor pelo seu nome de domínio, no caso “orelly.com” – O endereço IP é útil para software, enquanto o nome de domínio é mais acessível para humanos • Combinar o texto dos nomes de domínios com seus respectivos endereços IP numéricos é o trabalho de um servidor DNS
  • 17. Cliente/Servidor • É possível configurar o servidor web para responder a mais de um nome de domínio – Mapeados para um único endereço IP • Permitindo que vários sites compartilhem um único servidor • Questões para discussão: – Quais outros tipos de software para servidor você conhece? – Qual a relação entre configuração do computador servidor (equipamento) e tipo de serviço oferecido?
  • 18. Fim dos Endereços IP • A IANA, organização que designa números IP, distribuiu o seu último pacote de endereços IP em 3 de fevereiro de 2011 – Não existem mais IPs no estilo ###.###.###.### (chamado IPv4), que tem a capacidade de produzir 4.3 bilhões de endereços únicos, que parecia suficiente quando o “experimento” da Internet foi inicialmente concebido em 1977 • Não havia como os criadores poderem antecipar que um dia cada telefone, televisão e objetos em uma prateleira de uma loja, poderiam solicitar um endereço IP • A solução é um novo formato (IPv6, já em funcionamento) que permite que trilhões de números IP únicos sejam utilizados • O IPv6 é incompatível com a rede atual baseada em IPv4 – Então ela irá operar como um tipo de Internet paralela à que temos hoje – Eventualmente, IPv4 irá desaparecer, mas alguns dizem que isto demorará décadas
  • 20. Navegação • O software que faz as requisições é chamado de cliente • Pessoas utilizam navegadores desktop, navegadores móveis e outras tecnologias assistivas (como leitores de telas), como clientes para acessar documentos na Web • O servidor retorna o documento para o navegador (também conhecido como agente do usuário), para que possa ser exibido • A requisição e a resposta são manipuladas pelo protocolo HTTP – Embora falemos em “documentos”, HTTP pode ser usado para transferir imagens, filmes, arquivos de áudio, dados, scripts, e todos os outros recursos utilizados na construção de sites e aplicações Web
  • 21. Server-side vs. Client-side • Frequentemente em web-design, ouvimos referências a aplicações “client-side” (lado cliente) ou “server-side” (lado servidor) • Estes termos são utilizados para indicar qual máquina realiza o processamento: – Aplicações “client-side” rodam na máquina do usuário – Aplicações e funções “server-side” utilizam o poder de processamento de computadores servidores
  • 22. Navegação • É comum pensar em um navegador como uma janela em um monitor com uma página exibida nele – Estes são conhecidos como navegadores gráficos ou de desktop – Por um longo período de tempo foram a única forma de acesso à Web • Os navegadores mais populares de desktop incluem: Internet Explorer, Chrome, Firefox, Safari e Opera • Atualmente mais e mais pessoas estão acessando a Web utilizando navegadores criados dentro de telefones móveis ou tablets
  • 23. Navegação • É também importante manter em mente experiências alternativas na Web • Usuários com deficiência de visão devem poder ouvir o conteúdo de uma página Web através de um leitor de tela, ou simplesmente tornando o texto extremamente grande • Usuários com mobilidade limitada podem utilizar dispositivos assistivos para acessar links e digitar • Os sites que construirmos devem poder ser acessados e utilizáveis por todos os usuários, independentemente de suas experiências de navegação
  • 24. Navegação • Mesmo em navegadores desktop páginas podem parecer e funcionar de maneira diferente de navegador para navegador • Isto ocorre pela variedade de suporte à tecnologias Web e a habilidade do usuário para atribuir suas próprias preferências de navegação
  • 25. Intranets e Extranets • Quando pensamos em um site Web, geralmente assumimos que ele está acessível a qualquer pessoa navegando na Web • Entretanto, muitas empresas se utilizam das vantagens do compartilhamento e troca de informações dos sites Web apenas dentro de seus próprios negócios • Estas redes especiais baseadas na Web são chamadas de Intranets – Elas são criadas e funcionam como sites Web comuns, mas utilizam dispositivos de segurança especiais (chamados firewalls) que previnem o acesso externo – Intranets possuem vários usos, como acesso a informações de recursos humanos ou de bancos de dados de inventário
  • 26. Intranets e Extranets • Uma Extranet, assim como uma Intranet, somente pode ser acessada por usuários selecionados, mas fora da empresa – São informações corporativas acessadas, de forma limitada, pela Internet • Por exemplo, uma fábrica pode fornecer a seus clientes uma senha que permita que eles verifiquem a situação de seus pedidos no banco de dados de pedidos da empresa • A senha determina qual parte da informação da empresa está disponível
  • 28. URLs • Cada página ou recurso na Web possui seu próprio endereço especial chamado de URL, acrônimo de Uniform Resource Locator (Localizador Padrão de Recursos) • Algumas URLs são curtas, outras podem parecer com enormes strings de caracteres separados por pontos, traços e barras
  • 29. Partes de uma URL 1. http:// – Indica o protocolo utilizado para a operação – As letras HTTP indicam ao servidor para utilizar o Hypertext Transfer Protocol, ou entrar no “modo Web” 2. www.example.com – Identifica o site Web por seu nome de domínio – O nome do domínio é example.com – A parte “www.” do início é o nome de um host (máquina) em particular naquele domínio – O nome do host “www” se tornou uma convenção, mas não é uma regra, e muitas vezes pode ser omitido – Pode haver mais de um site Web em um mesmo domínio, por exemplo, development.example.com, clients.example.com
  • 30. Partes de uma URL 3. /2012/samples/first.html – Caminho absoluto através das pastas no servidor, onde está localizado o documento HTML, first.html – As palavras separadas por barras são os nomes das pastas, iniciando na pasta raiz do host (como indicado pelo sinal /) – Como a Internet originalmente foi projetada para rodar no sistema operacional Unix, a maneira atual de fazer as coisas ainda seguem muitas regras e convenções do Unix, como a / para separar nomes de pastas
  • 31. Arquivos default • Obviamente, nem todas as URLs possuem tanta informação • Muitos endereços não incluem um nome de arquivo, simplesmente apontam para uma pasta – http://www.oreilly.com – http://jendesign.com/resume/ • Quando isto ocorre, o servidor busca por um documento default, tipicamente chamado de index.html • Assim o exemplo anterior seria visto como: – http://www.oreilly.com/index.html – http://jendesign.com/resume/index.html • O nome do arquivo padrão pode variar e depende de como o servidor está configurado – Neste exemplo o nome é index.html, mas poderia ser default.htm
  • 32. Arquivos default • Se utilizarmos programação do lado servidor, o arquivo padrão poderia ser nomeado index.php ou index.asp • Uma outra coisa a ser notada no primeiro exemplo é a falta da barra para indicar uma pasta – Quando a barra é omitida, o servidor simplesmente a adiciona se encontrar uma pasta com aquele nome • O arquivo índice também é utilizado para segurança: – Alguns servidores (dependendo da configuração) mostram o conteúdo da pasta caso o arquivo padrão não seja encontrado – Uma das maneiras de evitar que pessoas fiquem fuçando em seus arquivos é colocar um arquivo índice em todas as pastas
  • 34. Anatomia de Uma Página Web • A página Web simples apresentada a seguir, apesar de parecer como uma única página coerente, é construída a partir de quatro arquivos separados: – Um documento HTML (index.html), uma folha de estilos (style sheet – kitchen.css), e dois gráficos (foods.gif e spoon.gif)
  • 35. Documentos HTML • Páginas Web são geralmente geradas por documentos de textos simples, formados por marcas (tags) especiais (indicadas pelos sinais < e >) que descrevem cada elemento da página • Adicionar tags descritivas a um documento é conhecido como “marcar” o documento – Páginas Web utilizam uma linguagem de marcação conhecida como HyperText Markup Language (HTML), que foi criada especialmente para documentos com links de hipertexto • HTML define dúzias de elementos de texto que compõem um documento, como cabeçalhos, parágrafos, texto enfatizado, e claro, links • Também existem elementos para adicionar informação sobre o documento (como o seu título), mídia (como imagens e vídeos) e componentes (widgets) para criação de formulários, apenas para citar alguns
  • 36. Documentos HTML • Pior ainda é o fato de que existem várias versões de HTML em uso hoje em dia • A mais fortemente estabelecida é a 4.01 e seu “parente” mais próximo XHTML 1.0 • Mas já está em funcionamento a versão mais recente, HTML5, que foi projetada para um melhor desenvolvimento de aplicações Web e que está gradualmente ganhando suporte dos navegadores
  • 37. Introdução Rápida a HTML • Comparando a página com o seu código... – http://www.learningwebdesign.com/4e/materials/chapter02/ki tchen.html
  • 39. Introdução Rápida a HTML • Primeiro devemos notar que o texto marcado (entre < e >) não é mostrado na página final – O navegador mostra apenas o que estiver entre as tags – o conteúdo do elemento – a marcação é escondida • A tag fornece o nome do elemento HTML – Geralmente uma abreviação, como “h1” para “heading level 1”, ou “em” para “emphasized text” • Em segundo lugar, devemos notar que a maioria das tags HTML aparecem em pares em volta do conteúdo do elemento – No nosso exemplo, <h1> indica que o texto seguinte deve ser um cabeçalho de nível 1 – </h1> indica o final do cabeçalho
  • 40. Introdução Rápida a HTML • Alguns elementos, conhecidos como elementos vazios, não possuem conteúdo – No exemplo, a tag <hr> indica um elemento vazio que informa ao navegador para “inserir um divisor temático aqui” (na maioria dos navegadores, uma linha horizontal – horizontal rule)
  • 41. Inserindo Imagens • Obviamente, um arquivo HTML não pode conter imagens, então cada imagem deve estar em um arquivo separado • As imagens são colocadas entre o texto através do elemento image do HTML (img), que informa ao navegador onde encontrar o gráfico (sua URL) – Quando o navegador encontra o elemento img, ele faz uma outra requisição ao servidor pelo arquivo de imagem – Vídeos e outros arquivos de mídias embutidos são tratados geralmente da mesma forma
  • 42. Inserindo Imagens • A montagem da página geralmente acontece de maneira instantânea, aparecendo como uma página completa carregada de uma só vez – Em conexões lentas ou páginas que incluam imagens ou arquivos de mídia grandes, o processo de montagem pode ser mais aparente, com imagens aparecendo depois do texto – A página pode ser até mesmo redesenhada quando novas imagens chegam (a não ser que possamos construir a página de maneira a prevenir este acontecimento)
  • 43. Trabalhando com Estilos • Próximo do início do documento HTML existe um elemento link que aponta para o documento de folha de estilo kitchen.css • Esta folha de estilos inclui poucas linhas de instruções para a forma como a página deve parecer no navegador • São instruções de estilo escritas de acordo com as regras CSS (Cascading Style Sheets) • CSS permite que designers adicionem instruções de estilo visual (conhecidas como apresentação do documento) no texto de marcação (estrutura do documento em terminologia de projeto Web)
  • 44. Trabalhando com Estilos • Note a diferença da página exemplo com e sem estilo:
  • 47. Adicionando Comportamento • Em uma página Web, além da estrutura e da apresentação, existe também um componente de comportamento que define como as coisas funcionam • Na Web comportamentos são definidos por uma linguagem de script chamada JavaScript • Muitos projetistas Web recorrem a profissionais mais experientes para adicionar funcionalidade aos seus sites • Entretanto, saber como escrever JavaScript está se tornando mais essencial à profissão de “Web designer”
  • 49. Web Sites x Web Apps • Nas últimas duas décadas a Internet cresceu, expandiu, explodiu e tornou impossível ignorá-la, tornando qualquer teclado sem conexão com a Internet muitas vezes inútil • Nos últimos anos, surgiu na Web um novo termo que pode ser tanto interessante como confuso ao mesmo tempo: “Web app” • Hoje, existe um debate na comunidade sobre onde termina o “Web site” e onde começa a “Web app” • Apresentamos um resumo do artigo de Ciprian Borodescu sobre a opinião de diferentes figuras influentes no domínio de tecnologia Web e da discussão sobre a “app-ification” da Web – http://www.visionmobile.com/blog/2013/07/web-sites-vs-web-apps- what-the-experts-think/
  • 50. Definição • Na era da pré-app-história, a palavra “aplicação” era aplicada a sites Web que forneciam interações avançadas a seus usuários e capacidades previamente disponíveis apenas através de software instalado – Exemplos iniciais de aplicações Web incluem Webmail, Google Maps e Google Docs • Comparados à Web clássica, por exemplo blogs e sites de notícias, Web apps permitiam uma experiência rica do usuário e acesso a capacidades avançadas dos navegadores • Hoje, páginas de sites Web ainda podem ser referenciadas como Web apps, mas está mais focada na tarefa que na tecnologia em si – “O use case de uma aplicação é sempre FAZER alguma coisa” (Christian Heilmann)
  • 51. Definição • Uma Web app é sempre voltada a tarefas: – Pensando em smartphones ou tablets, uma aplicação poderia ter como objetivo realizar uma tarefa específica, como fazer uma ligação, verificar o e-mail ou encontrar um táxi próximo • Algumas definições simples: – Web sites são somente leitura (read only), Web apps são de leitura-escrita (read-write) – Web sites são para consumo, Web apps são para criação
  • 52. Atributos de Uma Web App • Auto-contida • Interface do usuário rica/interativa, possivelmente imitando a interface nativa do dispositivo • Utilizar capacidades avançadas do dispositivo – Localização geográfica, integração com câmera ou outras tecnologias • Orientação à ação em vez de orientação à informação • Não utilizar pesadamente (ou esconder quando possível) operações do navegador (botão voltar, recarregar, barra de endereços) • Funcionar offline – Por exemplo, utilizando HTML5 ApplicationCache, armazenamento local ou bancos de dados indexados
  • 53. “App-ification” da Web • Existe um número crescente de desenvolvedores mobile de Web apps • Baseado em uma pesquisa da Developer Economics de 2014 com mais de 7.000 desenvolvedores... – 71% dos desenvolvedores para plataformas móveis desenvolvem para Android – 37% utilizam HTML5 como plataforma – 83% desenvolvem para tablets, mas apenas 12% tratam esta plataforma como alvo principal – 60% estão “abaixo da linha de pobreza das apps” – ganham menos de $500 por aplicação por mês – 23% dos desenvolvedores HTML5 desenvolvem Web apps, comparados a 38% que desenvolvem Web sites • Como disse Sir Tim Berners-Lee em 2012: “the solution is in your hands: develop web apps!”
  • 55. Web 2.0 • Termo polêmico criado pela O’Reilly Media em 2004 para designar uma segunda geração de comunidades e serviços tendo como conceito a “Web como plataforma” • Embora o termo tenha uma conotação de uma nova versão para a Web, ele não se refere à atualização nas suas especificações técnicas, mas a uma mudança na forma como ela é encarada por usuários e desenvolvedores, ou seja, o ambiente de interação e participação que hoje engloba inúmeras linguagens e motivações
  • 56. Definição de Tim O’Reilly "Web 2.0 é a mudança para uma internet como plataforma, e um entendimento das regras para obter sucesso nesta nova plataforma. Entre outras, a regra mais importante é desenvolver aplicativos que aproveitem os efeitos de rede para se tornarem melhores quanto mais são usados pelas pessoas, aproveitando a inteligência coletiva"
  • 57. Regras • Beta perpétuo – o software não é um artefato e sim um processo de comprometimento com seus usuários • Pequenas peças frouxamente unidas – abra seus dados e serviços para que sejam reutilizados por outros – reutilize dados e serviços de outros sempre que possível • Software acima do nível de um único dispositivo • Dados são o novo “Intel inside” – infoware X software
  • 58. Regras • Software usados na Internet como serviços e não vendidos como pacotes – Pagos mensalmente como uma conta de água – A Web é a plataforma, o software um serviço • Experiência do usuário mais rica – interfaces mais rápidas e mais fáceis de usar • Posicionamento do usuário: você controla os seus próprios dados • Arquitetura de participação – aproveitamento da inteligência coletiva – muitos serviços online pretendem oferecer além de um ambiente de fácil publicação e espaço para debates, recursos para a gestão coletiva do trabalho comum – não é uma ideia nova e sim um dos princípios da Internet desde a sua criação
  • 61. Rich Internet Application (RIA) • Aplicação de Internet Rica • Aplicações Web que possuem muitas das características de software de aplicação desktop • RIA utiliza um modelo de distribuição de cliente rico – distribuição de uma aplicação cliente compilada através de um navegador – Em vez de um modelo cliente-servidor leve – onde a visão do usuário é em sua maior parte controlada pelo servidor • Tipicamente são distribuídas através de um navegador específico, um plug-in do navegador, uso extensivo de JavaScript ou uma máquina virtual
  • 62. Rich Internet Application (RIA) • Usuários geralmente instalam um ambiente de software (framework) antes de poder executar a aplicação, que tipicamente realiza download, atualiza, verifica e executa a RIA – Esta é a principal diferença de alternativas baseadas em HTML5/JavaScript, como Ajax, que utilizam funcionalidades nativas do navegador para implementar interfaces comparáveis • Plug-ins mais conhecidos: – Adobe Flash, presente em 96% dos navegadores desktop (2011) – JavaFX, com 76% – Microsoft Silverlight, com 66% – Java Applet, em desuso
  • 63. Rich Internet Application (RIA) • Estas plataformas limitam a quantidade de dados baixados durante a inicialização a apenas o que é necessário para mostrar a página • O plug-in é baixado apenas uma vez, reduzindo o tempo de carga da aplicação, requisitos de velocidade de conexão e carga do servidor • Muito utilizada para jogos nos navegadores – Sons, vídeos, movimentos, gráficos, ... • Principais problemas: – Soluções proprietárias – Concorrência com o HTML5 – Realmente precisamos disso em aplicações comerciais?
  • 65. Computação em Nuvem • O conceito de computação em nuvem (em inglês, cloud computing) refere-se à utilização da memória e das capacidades de armazenamento e cálculo de computadores e servidores compartilhados e interligados por meio da Internet • O armazenamento de dados é feito em serviços que poderão ser acessados de qualquer lugar do mundo, a qualquer hora, não havendo necessidade de instalação de programas ou de armazenar dados – O acesso a programas, serviços e arquivos é remoto, através da Internet - daí a alusão à nuvem – O uso desse modelo (ambiente) é mais viável do que o uso de unidades físicas
  • 66. Computação em Nuvem • Num sistema operacional disponível na Internet, a partir de qualquer computador e em qualquer lugar, pode-se ter acesso a informações, arquivos e programas num sistema único, independente de plataforma – O requisito mínimo é um computador compatível com os recursos disponíveis na Internet – O PC torna-se apenas um chip ligado à Internet — a "grande nuvem" de computadores — sendo necessários somente os dispositivos de entrada (teclado, mouse) e saída (monitor)
  • 67. Tipologia • IaaS - Infrastructure as a Service ou Infraestrutura como Serviço – quando se utiliza uma percentagem de um servidor, geralmente com configuração que se adeque à sua necessidade • PaaS - Plataform as a Service ou Plataforma como Serviço – utilizando-se apenas uma plataforma como um banco de dados, um web-service, etc. (p.ex.: Windows Azure e Jelastic) • DevaaS - Development as a Service ou Desenvolvimento como Serviço – as ferramentas de desenvolvimento tomam forma na computação em nuvem como ferramentas compartilhadas e ferramentas de desenvolvimento web-based • SaaS - Software as a Service ou Software como Serviço – uso de um software em regime de utilização web (p.ex.: Google Docs, Microsoft SharePoint Online)
  • 68. Tipologia • CaaS - Communication as a Service ou Comunicação como Serviço – uso de uma solução de Comunicação Unificada hospedada em Data Center do provedor ou fabricante (p.ex.: Microsoft Lync) • DBaas - Data Base as a Service ou Banco de dados como Serviço – quando utiliza a parte de servidores de banco de dados como serviço • EaaS - Everything as a Service ou Tudo como Serviço – quando se utiliza tudo, infraestrutura, plataformas, software, suporte, enfim, o que envolve T.I.C. (Tecnologia da Informação e Comunicação) como um serviço
  • 69. Características • Provisionamento dinâmico de recursos sob demanda, com mínimo de esforço • Escalabilidade • Uso de "utilility computing", onde a cobrança é baseada no uso do recurso ao invés de uma taxa fixa • Visão única do sistema • Distribuição geográfica dos recursos de forma transparente ao usuário
  • 70. Modelos de Implantação • Público – as nuvens públicas são aquelas que são executadas por terceiros – as aplicações de diversos usuários ficam misturadas nos sistemas de armazenamento • Privado – as nuvens privadas são aquelas construídas exclusivamente para um único usuário (uma empresa, por exemplo) – diferentemente de um data center privado virtual, a infraestrutura utilizada pertence ao usuário, e, portanto, ele possui total controle sobre como as aplicações são implementadas na nuvem • Comunidade – a infraestrutura de nuvem é compartilhada por diversas organizações e suporta uma comunidade específica • Híbrido – nas nuvens híbridas temos uma composição dos modelos de nuvens públicas e privadas – elas permitem que uma nuvem privada possa ter seus recursos ampliados a partir de uma reserva de recursos em uma nuvem pública
  • 71. Vantagens • A maior vantagem da computação em nuvem é a possibilidade de utilizar software sem que estes estejam instalados no computador • Na maioria das vezes o usuário não precisa se preocupar com o sistema operacional e hardware que está usando em seu computador pessoal • As atualizações do software são feitas de forma automática, sem necessidade de intervenção do usuário • O trabalho corporativo e o compartilhamento de arquivos se tornam mais fáceis, uma vez que todas as informações se encontram no mesmo "lugar", ou seja, na "nuvem computacional" • O software e os dados podem ser acessados em qualquer lugar, basta apenas que haja acesso à Internet
  • 72. Vantagens • O usuário tem um melhor controle de gastos ao usar aplicativos, pois a maioria dos sistemas de computação em nuvem fornece aplicações gratuitamente e, quando não gratuitas, são pagas somente pelo tempo de utilização dos recursos – Não é necessário pagar por uma licença integral de uso de software • Diminui a necessidade de manutenção da infraestrutura física de redes locais cliente/servidor, bem como da instalação de software nos computadores corporativos, pois esta fica a cargo do provedor do software em nuvem, bastando que os computadores clientes tenham acesso à Internet • A infraestrutura necessária para uma solução de computação em nuvem é bem mais enxuta do que uma solução tradicional de hospedagem ou alojamento, consumindo menos energia, refrigeração e espaço físico e consequentemente contribuindo para a preservação e o uso racional dos recursos naturais
  • 73. Desvantagens • A maior desvantagem da computação em nuvem vem fora do propósito desta, que é o acesso a Internet – caso você perca o acesso, comprometerá todos os sistemas embarcados • Velocidade de processamento – caso seja necessário uma grande taxa de transferência, se a Internet não tiver uma boa banda, o sistema pode ser comprometido – um exemplo típico é com mídias digitais ou jogos • Assim como todo tipo de serviço, ele é custeado • Maior risco de comprometimento da privacidade do que em armazenamento off-line
  • 75. Arquitetura em Uma Camada • Nos tempos antigos do reinado do grande porte (mainframes) e do computador pessoal independente, um aplicativo era desenvolvido para ser usado em uma única máquina • Geralmente este aplicativo continha todas as funcionalidades em um único módulo gerado por uma grande quantidade de linhas de código e de manutenção nada fácil • A entrada do usuário, verificação, lógica de negócio e acesso a banco de dados estava presente em um mesmo lugar • Podemos definir este tipo de aplicação como aplicação de uma camada ou monolítica
  • 77. Arquitetura em Duas Camadas • A necessidade de compartilhar a lógica de acesso a dados entre vários usuários simultâneos fez surgir as aplicações em duas camadas • Nesta estrutura a base de dados foi colocada em uma máquina específica, separada das máquinas que executavam as aplicações • Nesta abordagem temos aplicativos instalados em estações clientes contendo toda a lógica da aplicação (clientes ricos ou gordos) • Um grande problema neste modelo é o gerenciamento de versões pois para cada alteração os aplicativos precisam ser atualizados em todas as máquinas clientes
  • 79. Arquitetura em Três Camadas • Com o advento da Internet houve um movimento para separar a lógica de negócio da interface com o usuário • A ideia é que os usuários da Web possam acessar as mesmas aplicações sem ter que instalar estas aplicações em suas máquinas locais • Como a lógica do aplicativo, inicialmente contida no cliente rico, não reside mais na máquina do usuário, este tipo de cliente passou a ser chamado de cliente pobre ou magro (thin client) • Neste modelo o aplicativo é movido para o Servidor e um navegador Web é usado como um cliente magro • O aplicativo é executado em servidores Web com os quais o navegador Web se comunica e gera o código HTML para ser exibido no cliente
  • 81. Camada de Apresentação • É a chamada GUI (Graphical User Interface), ou simplesmente interface • Esta camada interage diretamente com o usuário, é através dela que são feitas as requisições como consultas, por exemplo • Oferece conteúdo estático e conteúdo dinâmico personalizado, que pode ser apresentado nos mais variados formatos disponíveis, como HTML, Windows Forms ou XML • As classes dessa camada utilizam os serviços oferecidos pela camada de negócios
  • 82. Camada de Negócio/Aplicação • Também chamada de Lógica empresarial, Regras de negócio ou Funcionalidade • É nela onde as funções e regras de todo o negócio são implementadas – Nela estão todas as classes inerentes ao domínio da aplicação • Não existe uma interface para o usuário e seus dados são voláteis, ou seja, para que algum dado seja mantido deve ser utilizada a camada de dados
  • 83. Camada de Dados • A terceira camada é definida como o repositório das informações e as classes que a manipulam • É responsável pela persistência e acesso aos dados da aplicação • Esta camada recebe as requisições da camada de negócios e seus métodos executam essas requisições em um banco de dados • Ela isola o resto da aplicação do meio de armazenamento usado de maneira que, se o meio de armazenamento for trocado, apenas as classes desta camada precisarão ser modificadas ou substituídas
  • 84. Objetivos da Arquitetura em Camadas • Modularidade – dividir a aplicação em módulos tão independentes quanto possível • Manutenibilidade – reduzir o custo de manutenção da aplicação • Extensibilidade – permitir que novas funcionalidades sejam adicionadas sem grande impacto nas já existentes • Reusabilidade – permitir que classes e componentes sejam reusados em outros módulos da mesma aplicação ou em outras aplicações
  • 85. Vantagens • O desenvolvimento da aplicação é feita de forma rápida, simples, fácil e com um custo mais baixo • O acesso à fonte de dados esta separada em seu próprio componente de forma que o código da aplicação de apresentação não possui código SQL embutido • A informação da conexão é mantida somente no serviço XML, minimizando a manutenção do cliente • A camada de acesso a dados pode ser atualizada em um único local centralizado – Não é preciso distribuir componentes ao cliente quando houver alterações nesta camada • O modelo de 3 camadas tornou-se a arquitetura padrão para sistemas corporativos com base na Web
  • 86. Desvantagem • Manter a aplicação pode se tornar uma tarefa complexa
  • 87. Evolução... • Computação em Nuvem representa um retorno às origens (terminais “burros”)???
  • 89. Web Server • Programa de computador responsável por aceitar pedidos HTTP de clientes, geralmente os navegadores, e servi-los com respostas HTTP, incluindo opcionalmente dados, que geralmente são páginas Web, tais como documentos HTML com objetos embutidos (imagens, sons, etc.) – ou um computador que executa um programa que provê a funcionalidade descrita anteriormente • O uso mais comum é a hospedagem de sites Web, mas também podem ser usados para jogos, armazenamento de dados, execução de aplicações empresariais, manipulação de e-mail, FTP ou outros usos da Web
  • 90. Web Servers Mais Populares • Apache Tomcat da Apache – http://tomcat.apache.org • Internet Information Server (IIS) da Microsoft – http://www.iis.net • Nginx (engine-ex) da Nginx, Inc. – http://nginx.com/ • Google Web Server (GWS) da Google • Glassfish da Oracle
  • 93. Bancos de Dados • Um Sistema de Gerenciamento de Banco de Dados (SGBD) – do inglês Data Base Management System (DBMS) – é o conjunto de programas responsáveis pelo gerenciamento de uma base de dados • Seu principal objetivo é retirar da aplicação cliente a responsabilidade de gerenciar o acesso, a manipulação e a organização dos dados • O SGBD disponibiliza uma interface para que seus clientes possam incluir, alterar ou consultar dados previamente armazenados • Em bancos de dados relacionais a interface é constituída pelas APIs (Application Programming Interface) ou drivers do SGBD, que executam comandos na linguagem SQL (Structured Query Language)
  • 94. Principais SGBDs Pagos • Oracle • MySQL da Oracle • Microsoft SQL Server • Microsoft Access • Sybase • IBM DB2 • IBM Informix • Teradata • Ingres da Actian • SimpleDb da Amazon
  • 95. Principais SGBDs Gratuitos • MySQL da Oracle • MariaDB • PostgreSQL • SimpleDb da Amazon • MongoDB • Firebird • SQLite • Cassandra
  • 99. IDE • IDE, do inglês Integrated Development Environment ou Ambiente Integrado de Desenvolvimento, é um programa de computador que reúne características e ferramentas de apoio ao desenvolvimento de software com o objetivo de agilizar este processo • Geralmente os IDEs facilitam a técnica de RAD (de Rapid Application Development, ou Desenvolvimento Rápido de Aplicações), que visa a maior produtividade dos desenvolvedores
  • 100. Características • Editor – edita o código-fonte do programa escrito na(s) linguagem(ns) que a IDE dá suporte • Compilador (compiler) – compila o código-fonte do programa, editado em uma linguagem específica e a transforma em linguagem de máquina • Linker – une os vários "pedaços" de código-fonte, compilados em linguagem de máquina, em um programa executável que pode ser executado em um computador ou outro dispositivo computacional • Depurador (debugger) – auxilia no processo de encontrar e corrigir defeitos no código-fonte do programa, na tentativa de aprimorar a qualidade de software
  • 101. Características • Modelagem (modeling) – criação do modelo de classes, objetos, interfaces, associações e interações dos artefatos envolvidos no software • Geração de código – característica mais explorada em Ferramentas CASE, a geração de código também é encontrada em IDEs, contudo com um escopo mais direcionado a templates de código comumente utilizados para solucionar problemas rotineiros – Todavia, em conjunto com ferramentas de modelagem, a geração pode gerar praticamente todo o código-fonte do programa com base no modelo proposto, tornando muito mais rápido o processo de desenvolvimento e distribuição do software • Distribuição (deploy) – auxilia no processo de criação do instalador do software, ou outra forma de distribuição, seja discos ou via Internet
  • 102. Características • Testes Automatizados (automated tests) – realiza testes no software de forma automatizada, com base em scripts ou programas de testes previamente especificados, gerando um relatório, assim auxiliando na análise do impacto das alterações no código-fonte • Refatoração (refactoring) – consiste na melhoria constante do código-fonte do software, seja na construção de código mais otimizado, mais limpo e/ou com melhor entendimento pelos envolvidos no desenvolvimento do software
  • 103. IDEs Mais Utilizadas • Microsoft Visual Studio • Eclipse • NetBeans • Kate, gedit, Vim (editores de texto linux) • Flash Builder • IntelliJ IDEA • Delphi • ...
  • 104. IDE x Linguagem de Programação (http://programmers.stackexchange.com/) • C# - Visual Studio, SharpDevelop • Java - Eclipse, NetBeans, IDEA • Objective-C - Xcode • Delphi - RAD Studio • Object Pascal - Delphi, Lazarus • C, C++ - Visual Studio, Vim • ASP - Visual Studio • PL/SQL - RapidSQL, Oracle SQLDeveloper • PHP - Eclipse, NetBeans, Nusphere PHPed • Actionscript (AS2, AS3) - FlashDevelop
  • 105. IDE x Linguagem de Programação (http://programmers.stackexchange.com/) • Flex - Flash Builder 4 • Python - Eclipse, IDLE • Perl - Padre • Common Lisp - Lispworks, Emacs • Ruby - TextMate • Haskell - Vim • Fortran - Vim • Visual Basic - Visual Studio • Para melhor análise ver: http://en.wikipedia.org/wiki/Comparison_of_integrated_developm ent_environments
  • 107. Referências • Wikipedia (http://pt.wikipedia.org/) • ROBBINS, J. N. Learning Web Design 4th ed. O’Reilly, 2012.
  • 108. UNIVERSIDADE ESTADUAL DO SUDOESTE DA BAHIA CURSO DE CIÊNCIA DA COMPUTAÇÃO DESENVOLVIMENTO DE SISTEMAS WEB – 2015.2 Fábio M. Pereira (fabio.mpereira@uesb.edu.br)