SlideShare uma empresa Scribd logo
Curso Técnico de Desenvolvimento de Sistemas
Professor: LuizAntonio
Aula- Fundamentosdo Desenvolvimento WEB
Conteúdo: Estático e atualizado pelos
webmastes;
Tecnologia: limitada;
Desenvolvimento: focado no visual e na
construção gráfica (quase artesanal);
Serviços: Apenas uma vitrine, nenhuma
interação do usuário.
Conteúdo: A publicação de artigos e notícias se
torna automatizado;
Tecnologia: Evolução das tecnologias e
surgimento de outras;
Desenvolvimento: Surgem softwares (como os
interpretadores) que ajudam em algumas partes
do processo;
Serviços: Surgem as primeiras aplicações
comerciais, os usuários já tem alguma
interatividade. Início do uso dos Emails.
Conteúdo: Ainda mais dinâmico, mais customizável
e mais abrangente, com alta utilização de
multimídia (Música, video e animações);
Tecnologia: Tecnologia começa a se tornar padrão
com (HTML, CSS, XML). A era do Flash. Os
navegadores alcançam níveis satisfatórios de
recursos;
Desenvolvimento: Surgem novos softwares que
ajudam em algumas partes do processo e os
Interpretadores de códigos passam a ser padrão
de mercado;
Serviços: Deixam de ser vitrines e se tornam
aplicações profissionais e comerciais.
Conteúdo: Em sua grande maioria livre;
• Tecnologia: Padrões muito mais próximos ao W3C
(World Wide Web Consorcium); Surgimento do AJAX
(Javascript e XML), consolidação do padrão XML;
Desenvolvimento: Mais automatizado, mais
ferramentas de desenvolvimento, muito mais
produtivo. Seja no cliente ou no Servidor.
Serviços: O uso de recursos como o Ajax, deixam os
sites com aparência de aplicações. Os usuários tem
muito mais interação com os sites, conquistam mais
poder e liberdade
Reportagens e referências:
- https://canaltech.com.br/internet/veja-como-eram-os-
sites-dessas-24-empresas-nos-anos-90-62851/
- https://www.linkdesignbrasil.com/a-evolucao-da-internet-
ate-os-dias-atuais/
- https://www.brasilcode.com.br/melhores-linguagens-de-
programacao-para-aprender-em-2021/
Desenvolver pra web resume-
se a criar interfaces (páginas)
que dão acesso a um conteúdo
local ou externo, sendo este
através de requisições e
respostas (troca de dados).
Velocidade e disseminação de
informação;
Rápidos resultados em virtude da gama
de ferramentas disponíveis;
Portabilidade absoluta;
Manutenção facilitada;
Visualização de dados sem comunicação
externa (conteúdo estático)
A partir da troca de dados, entre um cliente e
um servidor (conteúdo dinâmico)
Arquitetura client-server (cliente-
servidor): requisição - resposta
Uma página web constitui-se de três
camadas:
◦ Conteúdo
◦ Apresentação
◦ Comportamento
A divisão em camadas, além de ser uma boa
prática, facilita o trabalho do desenvolvedor
e nos oferece mais performance ao projeto.
Modelo de desenvolvimento
em camadas: organização
de código, facilitação do
trabalho
Camada fundamental de formatação,
edição e organização do conteúdo
principal do site;
Na ampla maioria dos desenvolvimentos é feito
em HTML.
HTML é a linguagem responsável por exibir
e estruturar os dados. Pode ser codificado
num editor de texto, framework e/ou
interpretador de código;
Deve ser sempre o mesmo
código, independentemente do dispositivo
ou programa que acessa a página.
Camada de formatação visual e design da
página. É composta por elementos visuais
e gráficos, como cores, imagens, estilos,
layouts, etc.
É construída a partir de uma linguagem
chamada CSS(Cascading Style Sheet –
Folha de estilos encadeados)
CSSé a parte do código que cuida do
layout, design e formatação da página e seus
componentes;
Uso simples, intuitivo, fluido;
Pode mudar de acordo com o dispositivo ou
programa que está acessando a página, ou
até mesmo com as preferências do usuário.
item {
cor: vermelho;
tamanho: 2;
}
parágrafo {
destaque: negrito;
alinhamento: centralizado;
}
É a camada que permite melhorar a interação
do usuário com a página;
Composta principalmente pela linguagem de
programação JavaScript e pode ficar restrita
a determinados dispositivos ou programas e
executada através de compiladores,
interpretadores, frameworks ou anexada
numa outra linguagem de programação
como script complementar;
JavaScript é linguagem de programação de
altíssimo nível, mais voltada para a Web,
que oferece inúmeros recursos para uma
página;
Quanto mais avançada for a usabilidade da
linguagem, mais avançada deverá ser a
ferramenta e até o navegador utilizado;
resultado = pergunta(
);
se (resultado = = sim) {
sair();
} senão {
permanecer();
}
Modelo de desenvolvimento
em camadas: linguagens
utilizadas
Servidores
Web, BD Internet
Aplicação
Cliente com
Web Browser
É um conjunto de normas e recomendações
para o desenvolvimento web que visam
padronizar e, assim, facilitar a programação
e acesso.
Um consórcio chamado W3C (World Wide
Web Consortium), que foi criado para tornar
a Web "universal", criando padrões;
Écomposto por empresas na área de
tecnologias pra Web;
O maior problema que enfrentamos hoje,
quando estamos desenvolvendo uma
aplicação web, é a incompatibilidade de
nossos projetos entre navegadores.
Quando a Web surgiu, navegadores
começaram a adicionar recursos que apenas
ele possuíam, no intuito de atrair
desenvolvedores;
O problema era que todos os navegadores
eram usados. E o usuário tem direito a ter
acesso onde ele quiser;
Internet Explorer e Netscape Navigator, os
mais usados na época, travaram uma
disputa comercial acirrada que resultou
na despadronização web, onde cada site
tinha que ter uma versão para cada
navegador, prejudicando o trabalho do
desenvolvedor web.
Os desenvolvedores web passaram a programar
novos navegadores afim de atender suas
demandas específicas;
Os navegadores estão cada vez mais
aprimorados e atendendo a demandas de
interpretação de códigos, padronização de páginas e
outras configurações.
As interfaces do usuário dos navegadores têm muito
em comum. Entre os elementos comuns às interfaces
do usuário estão:
•Barra de endereço para inserção do URI
•Botões voltar e avançar
•Opções para adicionar favoritos
•Botões atualizar e parar para atualizar e parar o
carregamento dos documentos atuais
•Botão Início que o leva à página inicial
1.A interface do usuário , que inclui a barra de endereço, o botão
voltar/avançar, o menu de favoritos, etc. Todas as áreas do display do
navegador, exceto a janela principal em que você visualiza a página
solicitada.
2.O mecanismo de navegação , que faz a triagem das ações entre a
interface do usuário e o mecanismo de renderização.
3.O mecanismo de renderização, responsável pela exibição do conteúdo
solicitado. Por exemplo, se o conteúdo solicitado estiver em HTML, ele é
responsável pela análise do HTML e do CSS e pela exibição do conteúdo
analisado na tela.
4.Networking, utilizado para chamadas de rede, como solicitações HTTP.
Possui interface independente de plataforma e sub-implementações para
cada plataforma.
5. Back-end da interface do usuário, utilizada para desenhar
widgets básicos como caixas de combinação e janelas. Exibe
uma interface genérica que não é específica à plataforma. Sob
a interface, utiliza os métodos da interface do usuário do
sistema operacional.
6. Intérprete JavaScript Utilizado para analisar e executar o
código JavaScript.
7. Armazenamento de dados. Esta é uma camada
persistente. O navegador precisa salvar dados de diversos
tipos no disco rígido, como cookies. A nova especificação
HTML (HTML5) define "banco de dados da web", que é um
banco de dados completo (embora leve) no navegador.
Fonte: Geek360
Fonte: CityGlobeTour
Fonte:
https://www.youtube.com/watch?v=3qz5XuMTHDU&ab_c
hannel=VidaemGr%C3%A1fico (Canal Vida em Gráfico)
HTML
CSS
Javascript
XML
...
<html>
<head>
<title>Título da Página</title>
</head>
<body>
Esta é minha primeira página.
</body>
</html>
<html>
<head>
<link href="pagina.css" rel="stylesheet"
type="text/css" / >
<title>Título da Página</title>
</head>
<body>
Esta é minha primeira página.
</body>
</html>
body {
background-color :
#ffffff;
color : #000000;
}
<html>
<body>
<script type="text/javascript">
for (i = 0; i < 5; i++)
{
document.write("Alo você !!!")
document.write("<br />")
}
</script>
</body>
</html>
<?xml version="1.0" encoding="UTF-8"?>
<livros>
<livro isbn=“0001”>
<titulo>JavaServer Pages</titulo>
<autor>Nick Todd</autor>
<editora>Campus</editora>
<assunto>JSP</assunto>
</livro>
<livro isbn=“0002”>
<titulo>Meu pé de laranja
lima</titulo>
<editora>Vozes</editora>
<autor>Brilhante</autor>
</livro>
</livros>
Necessidade dos websites oferecerem
conteúdos dinâmicos e atualizados
Ciclo de vida da informações trafegadas entre
servidor e cliente (escopo)
Linguagens de script
◦ JSP
◦ ASP
◦ PHP
◦ Perl
Servidores Web
◦ IIS
◦ Apache
◦ Tomcat
Servidor web mais utilizado no mundo
atualmente
Software Livre
Escrito em C
Executa diversas linguagens script: PhP, Perl,
ASP, etc.
Possui suporte nativo ao MySQL
Implementação de referência para
JSP/Servlets (Java)
Escrito em Java
Devido à sua simplicidade e fácil instalação, é
comumente utilizado em cursos para
desenvolvimento web
Estes servidores oferecem recursos comuns
a diferentes aplicações
(autenticação, conexão à BDs, suporte a
transação, etc)
Pensando-se numa arquitetura em
camadas, um servidor de aplicação é um
servidor que hospeda e oferece serviços
para outras aplicações
Com isso, espera-se que os
desenvolvedores poupem tempo para
implementação da lógica do negócio
Formato padrão, baseado em
XML
Tem sido adotado por websites que
disponibilizam informações na rede, como
sites de jornais, blogs, sites
institucionais, etc.
Hoje existem diversos leitores (agregadores)
de RSS:browsers, programas de e-
mail, softwares, etc ..
Proposta:
◦ Integração de sistemas através do uso de XML
sobre HTTP
Tecnologias:
◦ XML
◦ WSDL(Web Service Description Language)
◦ SOAP (Simple Object Access Protocol)
Vantagens:
◦ Integração com baixo acoplamento
◦ Independe das linguagens de implementação
Alura – www.alura.com.br
BrasilCode – www.brasilcode.com.br
gobacklog – https://gobacklog.com/
eufacoprogramas – https://eufacoprogramas.com
becode – www.becode.com.br
linhadecodigo – http://www.linhadecodigo.com.br/
DankiCode – https://blog.dankicode.com/

Mais conteúdo relacionado

Semelhante a Projeto Web - Aula 1 - Fundamentos do Dev WEB.pptx

Desenvolvimento web com software livre
Desenvolvimento web com software livreDesenvolvimento web com software livre
Desenvolvimento web com software livre
Ruan Carvalho
 
HTML5- Road Show TI - Senac Jaboticabal
HTML5- Road Show TI -  Senac Jaboticabal HTML5- Road Show TI -  Senac Jaboticabal
HTML5- Road Show TI - Senac Jaboticabal
Clécio Bachini
 
Firefox - Developer's Best Friend // Fisl2008
Firefox - Developer's Best Friend // Fisl2008Firefox - Developer's Best Friend // Fisl2008
Firefox - Developer's Best Friend // Fisl2008
Clauber Stipkovic
 
Introdução de web
Introdução de webIntrodução de web
Introdução de web
Sedu
 
HTML5 - Road Show TI Experience 2012
HTML5 - Road Show TI Experience 2012HTML5 - Road Show TI Experience 2012
HTML5 - Road Show TI Experience 2012
Fábio Flatschart
 
HTML5 - A nova fronteira no desenvolvimento de aplicações WEB
HTML5 - A nova fronteira no desenvolvimento de aplicações WEBHTML5 - A nova fronteira no desenvolvimento de aplicações WEB
HTML5 - A nova fronteira no desenvolvimento de aplicações WEB
Fábio Flatschart
 
Ferramentas Livres para Desenvolvimento Web
Ferramentas Livres para Desenvolvimento WebFerramentas Livres para Desenvolvimento Web
Ferramentas Livres para Desenvolvimento Web
igorpimentel
 
Introdução a HTML5
Introdução a HTML5Introdução a HTML5
Introdução a HTML5
Salvador Torres
 
HTML 5 e Open Web Platform
HTML 5 e Open Web PlatformHTML 5 e Open Web Platform
HTML 5 e Open Web Platform
Ana Carolina Gracioso
 
Joomla
JoomlaJoomla
A Linguagem Php
A Linguagem PhpA Linguagem Php
A Linguagem Php
Joaquim Vieira
 
Seminário de Desenvolvimento Mobile - Etec Cafelândia
Seminário de Desenvolvimento Mobile - Etec CafelândiaSeminário de Desenvolvimento Mobile - Etec Cafelândia
Seminário de Desenvolvimento Mobile - Etec Cafelândia
Diego Cavalca
 
Fundamentos de arquitetura Web
Fundamentos de arquitetura WebFundamentos de arquitetura Web
Fundamentos de arquitetura Web
Denis L Presciliano
 
Web Tools Pt B R
Web Tools Pt  B RWeb Tools Pt  B R
Web Tools Pt B R
guestb9d145
 
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
 
Projeto Indiana
Projeto IndianaProjeto Indiana
Projeto Indiana
hellequin
 
Aplicativo aula03
Aplicativo aula03Aplicativo aula03
Aplicativo aula03
Cláudio Amaral
 
Curso web faveni aula 19 - Introdução a CMS
Curso web faveni aula 19 - Introdução a CMSCurso web faveni aula 19 - Introdução a CMS
Curso web faveni aula 19 - Introdução a CMS
Luis Marcelo Zanlucki
 
Html5 - Notas de aula
Html5 - Notas de aulaHtml5 - Notas de aula
Html5 - Notas de aula
clodiney cruz
 
Técnicas e processos - HTML / CSS - aula 1
Técnicas e processos - HTML / CSS - aula 1Técnicas e processos - HTML / CSS - aula 1
Técnicas e processos - HTML / CSS - aula 1
Ritielle de Souza
 

Semelhante a Projeto Web - Aula 1 - Fundamentos do Dev WEB.pptx (20)

Desenvolvimento web com software livre
Desenvolvimento web com software livreDesenvolvimento web com software livre
Desenvolvimento web com software livre
 
HTML5- Road Show TI - Senac Jaboticabal
HTML5- Road Show TI -  Senac Jaboticabal HTML5- Road Show TI -  Senac Jaboticabal
HTML5- Road Show TI - Senac Jaboticabal
 
Firefox - Developer's Best Friend // Fisl2008
Firefox - Developer's Best Friend // Fisl2008Firefox - Developer's Best Friend // Fisl2008
Firefox - Developer's Best Friend // Fisl2008
 
Introdução de web
Introdução de webIntrodução de web
Introdução de web
 
HTML5 - Road Show TI Experience 2012
HTML5 - Road Show TI Experience 2012HTML5 - Road Show TI Experience 2012
HTML5 - Road Show TI Experience 2012
 
HTML5 - A nova fronteira no desenvolvimento de aplicações WEB
HTML5 - A nova fronteira no desenvolvimento de aplicações WEBHTML5 - A nova fronteira no desenvolvimento de aplicações WEB
HTML5 - A nova fronteira no desenvolvimento de aplicações WEB
 
Ferramentas Livres para Desenvolvimento Web
Ferramentas Livres para Desenvolvimento WebFerramentas Livres para Desenvolvimento Web
Ferramentas Livres para Desenvolvimento Web
 
Introdução a HTML5
Introdução a HTML5Introdução a HTML5
Introdução a HTML5
 
HTML 5 e Open Web Platform
HTML 5 e Open Web PlatformHTML 5 e Open Web Platform
HTML 5 e Open Web Platform
 
Joomla
JoomlaJoomla
Joomla
 
A Linguagem Php
A Linguagem PhpA Linguagem Php
A Linguagem Php
 
Seminário de Desenvolvimento Mobile - Etec Cafelândia
Seminário de Desenvolvimento Mobile - Etec CafelândiaSeminário de Desenvolvimento Mobile - Etec Cafelândia
Seminário de Desenvolvimento Mobile - Etec Cafelândia
 
Fundamentos de arquitetura Web
Fundamentos de arquitetura WebFundamentos de arquitetura Web
Fundamentos de arquitetura Web
 
Web Tools Pt B R
Web Tools Pt  B RWeb Tools Pt  B R
Web Tools Pt B R
 
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
 
Projeto Indiana
Projeto IndianaProjeto Indiana
Projeto Indiana
 
Aplicativo aula03
Aplicativo aula03Aplicativo aula03
Aplicativo aula03
 
Curso web faveni aula 19 - Introdução a CMS
Curso web faveni aula 19 - Introdução a CMSCurso web faveni aula 19 - Introdução a CMS
Curso web faveni aula 19 - Introdução a CMS
 
Html5 - Notas de aula
Html5 - Notas de aulaHtml5 - Notas de aula
Html5 - Notas de aula
 
Técnicas e processos - HTML / CSS - aula 1
Técnicas e processos - HTML / CSS - aula 1Técnicas e processos - HTML / CSS - aula 1
Técnicas e processos - HTML / CSS - aula 1
 

Projeto Web - Aula 1 - Fundamentos do Dev WEB.pptx

  • 1. Curso Técnico de Desenvolvimento de Sistemas Professor: LuizAntonio Aula- Fundamentosdo Desenvolvimento WEB
  • 2. Conteúdo: Estático e atualizado pelos webmastes; Tecnologia: limitada; Desenvolvimento: focado no visual e na construção gráfica (quase artesanal); Serviços: Apenas uma vitrine, nenhuma interação do usuário.
  • 3. Conteúdo: A publicação de artigos e notícias se torna automatizado; Tecnologia: Evolução das tecnologias e surgimento de outras; Desenvolvimento: Surgem softwares (como os interpretadores) que ajudam em algumas partes do processo; Serviços: Surgem as primeiras aplicações comerciais, os usuários já tem alguma interatividade. Início do uso dos Emails.
  • 4. Conteúdo: Ainda mais dinâmico, mais customizável e mais abrangente, com alta utilização de multimídia (Música, video e animações); Tecnologia: Tecnologia começa a se tornar padrão com (HTML, CSS, XML). A era do Flash. Os navegadores alcançam níveis satisfatórios de recursos; Desenvolvimento: Surgem novos softwares que ajudam em algumas partes do processo e os Interpretadores de códigos passam a ser padrão de mercado; Serviços: Deixam de ser vitrines e se tornam aplicações profissionais e comerciais.
  • 5. Conteúdo: Em sua grande maioria livre; • Tecnologia: Padrões muito mais próximos ao W3C (World Wide Web Consorcium); Surgimento do AJAX (Javascript e XML), consolidação do padrão XML; Desenvolvimento: Mais automatizado, mais ferramentas de desenvolvimento, muito mais produtivo. Seja no cliente ou no Servidor. Serviços: O uso de recursos como o Ajax, deixam os sites com aparência de aplicações. Os usuários tem muito mais interação com os sites, conquistam mais poder e liberdade
  • 6. Reportagens e referências: - https://canaltech.com.br/internet/veja-como-eram-os- sites-dessas-24-empresas-nos-anos-90-62851/ - https://www.linkdesignbrasil.com/a-evolucao-da-internet- ate-os-dias-atuais/ - https://www.brasilcode.com.br/melhores-linguagens-de- programacao-para-aprender-em-2021/
  • 7. Desenvolver pra web resume- se a criar interfaces (páginas) que dão acesso a um conteúdo local ou externo, sendo este através de requisições e respostas (troca de dados).
  • 8. Velocidade e disseminação de informação; Rápidos resultados em virtude da gama de ferramentas disponíveis; Portabilidade absoluta; Manutenção facilitada;
  • 9. Visualização de dados sem comunicação externa (conteúdo estático) A partir da troca de dados, entre um cliente e um servidor (conteúdo dinâmico) Arquitetura client-server (cliente- servidor): requisição - resposta
  • 10.
  • 11.
  • 12.
  • 13.
  • 14.
  • 15.
  • 16.
  • 17.
  • 18.
  • 19.
  • 20.
  • 21.
  • 22.
  • 23. Uma página web constitui-se de três camadas: ◦ Conteúdo ◦ Apresentação ◦ Comportamento A divisão em camadas, além de ser uma boa prática, facilita o trabalho do desenvolvedor e nos oferece mais performance ao projeto.
  • 24. Modelo de desenvolvimento em camadas: organização de código, facilitação do trabalho
  • 25. Camada fundamental de formatação, edição e organização do conteúdo principal do site; Na ampla maioria dos desenvolvimentos é feito em HTML.
  • 26. HTML é a linguagem responsável por exibir e estruturar os dados. Pode ser codificado num editor de texto, framework e/ou interpretador de código; Deve ser sempre o mesmo código, independentemente do dispositivo ou programa que acessa a página.
  • 27. Camada de formatação visual e design da página. É composta por elementos visuais e gráficos, como cores, imagens, estilos, layouts, etc. É construída a partir de uma linguagem chamada CSS(Cascading Style Sheet – Folha de estilos encadeados)
  • 28. CSSé a parte do código que cuida do layout, design e formatação da página e seus componentes; Uso simples, intuitivo, fluido; Pode mudar de acordo com o dispositivo ou programa que está acessando a página, ou até mesmo com as preferências do usuário.
  • 29. item { cor: vermelho; tamanho: 2; } parágrafo { destaque: negrito; alinhamento: centralizado; }
  • 30. É a camada que permite melhorar a interação do usuário com a página; Composta principalmente pela linguagem de programação JavaScript e pode ficar restrita a determinados dispositivos ou programas e executada através de compiladores, interpretadores, frameworks ou anexada numa outra linguagem de programação como script complementar;
  • 31. JavaScript é linguagem de programação de altíssimo nível, mais voltada para a Web, que oferece inúmeros recursos para uma página; Quanto mais avançada for a usabilidade da linguagem, mais avançada deverá ser a ferramenta e até o navegador utilizado;
  • 32. resultado = pergunta( ); se (resultado = = sim) { sair(); } senão { permanecer(); }
  • 33. Modelo de desenvolvimento em camadas: linguagens utilizadas
  • 34.
  • 36.
  • 37. É um conjunto de normas e recomendações para o desenvolvimento web que visam padronizar e, assim, facilitar a programação e acesso.
  • 38. Um consórcio chamado W3C (World Wide Web Consortium), que foi criado para tornar a Web "universal", criando padrões; Écomposto por empresas na área de tecnologias pra Web;
  • 39. O maior problema que enfrentamos hoje, quando estamos desenvolvendo uma aplicação web, é a incompatibilidade de nossos projetos entre navegadores.
  • 40. Quando a Web surgiu, navegadores começaram a adicionar recursos que apenas ele possuíam, no intuito de atrair desenvolvedores; O problema era que todos os navegadores eram usados. E o usuário tem direito a ter acesso onde ele quiser;
  • 41. Internet Explorer e Netscape Navigator, os mais usados na época, travaram uma disputa comercial acirrada que resultou na despadronização web, onde cada site tinha que ter uma versão para cada navegador, prejudicando o trabalho do desenvolvedor web.
  • 42. Os desenvolvedores web passaram a programar novos navegadores afim de atender suas demandas específicas; Os navegadores estão cada vez mais aprimorados e atendendo a demandas de interpretação de códigos, padronização de páginas e outras configurações.
  • 43. As interfaces do usuário dos navegadores têm muito em comum. Entre os elementos comuns às interfaces do usuário estão: •Barra de endereço para inserção do URI •Botões voltar e avançar •Opções para adicionar favoritos •Botões atualizar e parar para atualizar e parar o carregamento dos documentos atuais •Botão Início que o leva à página inicial
  • 44. 1.A interface do usuário , que inclui a barra de endereço, o botão voltar/avançar, o menu de favoritos, etc. Todas as áreas do display do navegador, exceto a janela principal em que você visualiza a página solicitada. 2.O mecanismo de navegação , que faz a triagem das ações entre a interface do usuário e o mecanismo de renderização. 3.O mecanismo de renderização, responsável pela exibição do conteúdo solicitado. Por exemplo, se o conteúdo solicitado estiver em HTML, ele é responsável pela análise do HTML e do CSS e pela exibição do conteúdo analisado na tela. 4.Networking, utilizado para chamadas de rede, como solicitações HTTP. Possui interface independente de plataforma e sub-implementações para cada plataforma.
  • 45. 5. Back-end da interface do usuário, utilizada para desenhar widgets básicos como caixas de combinação e janelas. Exibe uma interface genérica que não é específica à plataforma. Sob a interface, utiliza os métodos da interface do usuário do sistema operacional. 6. Intérprete JavaScript Utilizado para analisar e executar o código JavaScript. 7. Armazenamento de dados. Esta é uma camada persistente. O navegador precisa salvar dados de diversos tipos no disco rígido, como cookies. A nova especificação HTML (HTML5) define "banco de dados da web", que é um banco de dados completo (embora leve) no navegador.
  • 46.
  • 50.
  • 52. <html> <head> <title>Título da Página</title> </head> <body> Esta é minha primeira página. </body> </html>
  • 53. <html> <head> <link href="pagina.css" rel="stylesheet" type="text/css" / > <title>Título da Página</title> </head> <body> Esta é minha primeira página. </body> </html>
  • 55. <html> <body> <script type="text/javascript"> for (i = 0; i < 5; i++) { document.write("Alo você !!!") document.write("<br />") } </script> </body> </html>
  • 56. <?xml version="1.0" encoding="UTF-8"?> <livros> <livro isbn=“0001”> <titulo>JavaServer Pages</titulo> <autor>Nick Todd</autor> <editora>Campus</editora> <assunto>JSP</assunto> </livro> <livro isbn=“0002”> <titulo>Meu pé de laranja lima</titulo> <editora>Vozes</editora> <autor>Brilhante</autor> </livro> </livros>
  • 57. Necessidade dos websites oferecerem conteúdos dinâmicos e atualizados Ciclo de vida da informações trafegadas entre servidor e cliente (escopo) Linguagens de script ◦ JSP ◦ ASP ◦ PHP ◦ Perl
  • 58. Servidores Web ◦ IIS ◦ Apache ◦ Tomcat
  • 59. Servidor web mais utilizado no mundo atualmente Software Livre Escrito em C Executa diversas linguagens script: PhP, Perl, ASP, etc. Possui suporte nativo ao MySQL
  • 60. Implementação de referência para JSP/Servlets (Java) Escrito em Java Devido à sua simplicidade e fácil instalação, é comumente utilizado em cursos para desenvolvimento web
  • 61. Estes servidores oferecem recursos comuns a diferentes aplicações (autenticação, conexão à BDs, suporte a transação, etc) Pensando-se numa arquitetura em camadas, um servidor de aplicação é um servidor que hospeda e oferece serviços para outras aplicações Com isso, espera-se que os desenvolvedores poupem tempo para implementação da lógica do negócio
  • 62. Formato padrão, baseado em XML Tem sido adotado por websites que disponibilizam informações na rede, como sites de jornais, blogs, sites institucionais, etc. Hoje existem diversos leitores (agregadores) de RSS:browsers, programas de e- mail, softwares, etc ..
  • 63.
  • 64. Proposta: ◦ Integração de sistemas através do uso de XML sobre HTTP Tecnologias: ◦ XML ◦ WSDL(Web Service Description Language) ◦ SOAP (Simple Object Access Protocol) Vantagens: ◦ Integração com baixo acoplamento ◦ Independe das linguagens de implementação
  • 65. Alura – www.alura.com.br BrasilCode – www.brasilcode.com.br gobacklog – https://gobacklog.com/ eufacoprogramas – https://eufacoprogramas.com becode – www.becode.com.br linhadecodigo – http://www.linhadecodigo.com.br/ DankiCode – https://blog.dankicode.com/