introdução às aplicações para web · introduÇÃo Às aplicaÇÕes para web professor: rhavy...
TRANSCRIPT
INTRODUÇÃO ÀS
APLICAÇÕES PARA WEB
Professor: Rhavy Maia Guedes
E-mail: [email protected], rhavymg.wordpress.com
Material cedido pelo prof. Francisco Dantas Nobre
Neto
Sites vs Aplicativos Web
Aplicativos Web:
Possui maior interatividade com o usuário:
Recebimento, processamento e devolução da informação.
São leitura e escrita;
Além de apresentar conteúdo, também realiza alguma
tarefa no servidor:
Criação de conta de usuário, pagamento de uma compra.
Além de uma linguagem client side, geralmente,
possui também uma server side:
Java (Servlets/JSP ou JSF), PHP, Python, etc.
Agenda
Sites vs Aplicativos Web
Servidores Web
Endereços IPs e DNS
Páginas Web
Sites vs Aplicativos Web
Client
Side
Requisição HTTP
Resposta HTTP (Página Web, Imagens, JavaScript, etc)
Server
Side
Navegador
(Firefox, Chrome, IE)
Servidor Web
(Apache, IIS)
Servidores Web
As aplicações desenvolvidas para Web devem
estar disponíveis em um computador que tenha um
servidor Web:
Esses computadores podem estar na Internet ou na
Intranet.
Servidores Web
Ao acessar uma página Web, é realizada uma
troca de mensagens entre o cliente (navegador) e o
servidor (Web), através do protocolo HTTP:
Uma requisição HTTP é enviada ao servidor, solicitando
determinado recurso no servidor Web;
Ao responder, o servidor Web envia uma resposta
HTTP, com os recursos solicitados pela requisição.
Alguns exemplos de servidores Web são:
Apache; IIS (Microsoft).
Servidores Web
Requisição em alto nível.
Servidores Web
Entendendo a requisição.
Endereços IPs e DNS
Em uma rede, os dispositivos conectados a ela possuem
um endereço IP:
Dentro de uma organização (Intranet), quem controla a
distribuição é a organização;
Na Internet, os provedores de acesso (ISP) controlam os
endereços IPs.
E, para acessar um servidor Web, você poderá digitar
o IP da máquina que possui o servidor instalado:
Ou digitar o nome do domínio:
www.ifpb.edu.br; www.google.com. O servidor DNS fará a tradução
do nome (domínio) para o
endereço IP.
Páginas Web
Para desenvolver páginas Web, utilizamos a
linguagem HTML:
HyperText Markup Language;
Atualmente, está na versão 5 (HTML 5);
Para disponibilizar seu HTML na Internet, lembre-se,
você deverá ter um computador com um servidor Web
instalado!
O seu arquivo HTML deve ter
extensão .html ou .htm!
Páginas Web
Exemplo de documento HTML.
<!DOCTYPE html>
<html>
<head>
<title>Primeira Página Web</title>
</head>
<body>
<h1>Minha primeira página Web</h1>
<p>Aqui vai um parágrafo...</p>
<img src=“web.gif” />
</body>
</html>
aula01.html
B
A
C
D
A
B
C
D
Páginas Web
Entendendo um documento HTML.
<!DOCTYPE html>
<html>
<head>
<title>Primeira Página Web</title>
</head>
<body>
<h1>Minha primeira página Web</h1>
<p>Aqui vai um parágrafo...</p>
<img src=“web.gif” />
</body>
</html>
B
A
C
D
B
A
C
D
Título da página Web:
aparece na barra de
títulos do seu navegador
Cabeçalho do texto
Parágrafo
Imagem adicionada no documento:
Deve estar na mesma pasta
do arquivo aula01.html
<html>, <head>, <title>, <body>,
<h1>, <p>, <img> são os
Marcadores (ou Tags) HTML!
aula01.html
Páginas Web
O que acontece se salvarmos o arquivo abaixo
como aula01_1.html, e abri-lo no navegador?
Sobre HTML e JavaScript
HTML (abreviação para a expressão inglesa HyperText Markup Language,
que significa Linguagem de Marcação de Hipertexto) é uma linguagem de
marcação utilizada para produzir páginas na Web.
Cascading Style Sheets (ou simplesmente CSS) é uma linguagem de
folhas de estilo utilizada para definir a apresentação de documentos
escritos em uma linguagem de marcação, como HTML ou XML. Seu
principal benefício é prover a separação entre o formato e o conteúdo de
um documento.
JavaScript é uma linguagem de programação interpretada. Foi
originalmente implementada como parte dos navegadores web para
que scripts pudessem ser executados do lado do cliente.
Páginas Web
Não saiu como esperávamos. Por quê?
Faltaram os marcadores HTML
no arquivo aula01_1.html
Páginas Web
Adição de marcadores HTML.
<!DOCTYPE html>
<html><head><title>Página alterada</title></head>
<body>
<h1>Sobre HTML e JavaScript</h1>
<p>HTML (abreviação para a expressão inglesa HyperText Markup
Language, que significa Linguagem de Marcação de Hipertexto) é
uma linguagem de marcação utilizada para produzir páginas na Web.</p>
<p>Cascading Style Sheets (ou simplesmente CSS) é uma linguagem de
folhas de estilo utilizada para definir a apresentação de documentos
escritos em uma linguagem de marcação, como HTML ou XML. Seu
principal benefício é prover a separação entre o formato e o conteúdo de
um documento.</p>
<p>JavaScript é uma linguagem de programação interpretada. Foi
originalmente implementada como parte dos navegadores web para
que scripts pudessem ser executados do lado do cliente.</p>
</body></html>
Páginas Web
Documento ajustado.
Referências
Apostila da K19. Desenvolvimento Web com HTML, CSS e
JavaScript. Disponível gratuitamente em
http://www.k19.com.br/downloads/apostilas/basica/k19-k02-
desenvolvimento-web-com-html-css-e-javascript.
Elisabeth Robson; Eric Freeman. Head First HTML and CSS!.
O’reilly.2012.