1
Programação e Designer WEBpara WEB
Introdução
Prof. Rodrigo [email protected]
Apresentação
Prof. Rodrigo Rocha – [email protected]
Ementa
I t d ã hi t t• Introdução a hipertexto.
• A linguagem HTML.
• Ambientes para programação em HTML.
• Linguagem de Programação PHP.
• Conceitos de acessibilidade e usabilidade para Web.
2
Bibliografia
Livro texto• MELO, Alexandre Altair De; NASCIMENTO, Mauricio G.F. PHP
PROFISSIONAL : APRENDA A DESENVOLVER SISTEMAS PROFISSIONAIS ORIENTADOS A OBJETOS COM PADRÕES DE PROJETOS. 1ª ed. São Paulo: Novatec, 2007
• BUDD, Andy; MOLL, Cameron; COLLISON, Simon. Criando Páginas Web com CSS : Soluções avançadas para padrões WEB.1ª ed. São Paulo: Pearson Education, 2007
• ZELDMAN, Jeffrey. Projetando Web Sites Compatíveis. 1.ed. Rio de Janeiro: Campus, 2003.
ComplementarComplementar• ANSELMO, Fernando. PhP4 e MySQL: maior, melhor e
totalmente sem cortes. 1.ed. Florianópolis: Visual Books, 2002.
• NIELSEN, Jakob. Projetando Websites: a prática da simplicidade. 1.ed. Rio de Janeiro: Campus, 2000.
• DAMASCENO, Anielle. Webdesign: teoria e prática. 1.ed. Florianópolis: Visual Books, 2003.
Metodologia e Avaliação
Metodologia• Aula expositiva• Dinâmicas de grupo
D b t• Debates• Exercício em classe• Laboratório
Avaliação• 40%
Atividades (3,0)Avaliação (7,0)
• 60%Atividades (3,0)Avaliação Oficial (7,0)
4
A era da informação
Mundo que muda rapidamente• Especialmente na área da tecnologia da
informação e computaçãoinformação e computação
Agricultura• Passado: 100 acres para produção agrícola
• Hoje: 1 acre (otimização e desempenho)
1950 – inicio da era da informação• Desenvolvimento do computador
1990 – popularização dos computadores• Internet
Ambiente WEB
História• 1960. Rand Corporation
Pesquisa patrocinada pela força aéra americana
Como desenvolver uma rede de comunicação distribuída– Robusta
– Consiga sobreviver a um ataque nuclear
• ARPANETAgência do departamento de defesa americano
4 pontos de comunicação entre faculdades amercianas
Percursor da internetPercursor da internet
• Transmission Control Protocol/Internet Protocol (TCP/IP)Conjunto de protocolos de comunicação
Conectar redes separadas em uma grande rede
Inicialmente somente serviços básicos– Correio eletrônico, transferência de arquivos e login remoto
6
Será que existe algum tipo de programação ?
WebServer
Smtp
DNS DNS
Servidor de Arquivos
Firewall
Scripts
W bS i WebServices
WebMail
Intranet
Extranet
Definindo alguns termos Endereço IP
• Endereço lógico que referência uma máquina no protocolo TCP/IP
WebBrowser• Navegador (“lê” páginas em html)
• Navegadores antigos (http://browsers.evolt.org/)
WebServer• Servidor que mantém as páginas hospedadas
• Possui um serviço que roda na porta 80. Ex: Apache, IIS, TomCat
HTTP• Protocolo de transferência de hipertexto
FTP FTP• Serviço de transferência de arquivos
DNS• Tradução de Nomes em endereço IP
SMTP e POP• Protocolos de transferência de mensagens (e-mail)
7
Ambiente WEB “estático”
Servidor• IIS
• Apache
Cliente Cliente• Browser
IE
FireFox
Chrome
Opera
Safari
Ambiente Web “Dinâmico”
Servidor Web
Cliente• Navegadores
S id d BD Servidores de BD
8
“Aparelhinhos” interessantes
O menor servidor Web do mundohttp://www-ccs.cs.umass.edu/~shri/iPic.html
Porta retratos IPhttp://www.ceiva.com/
Tostadeira habilitada para a Web +Previsão do tempohttp://dancing-man.com/robin/toasty/
fonte: www.nuperc.unifacs.br/suruagy/redes
Geladeira com acesso a internethttp://www.lge.com
Segurança Ataques a aplicativos web . Fonte: http://www.milw0rm.com
9
E a questão de segurança
Seu firewall cuida dos problemas na programação das aplicações web?
World Wide Web
História• 1991, Berners Lee (Cern) e colaboradoresIntroduziu o conceito de WWWIntroduziu o conceito de WWW
Ajudaram na adoção de padrões da web
Hypertext Transfer Protocol (HTTP)
Hypertext Markup Language (HTML)
Universal Resource Locator (URL)
DefiniçãoDefinição• sistema de hipertexto gráfico que roda sobre a
Internet, e éGlobal, interativo, dinâmico, mutiplataforma, distribuído
(Lymay; Colburn, 2006)
10
Sistema de Hypertexto
“Permite a você ler e navegar por texto e informações visuais de uma maneira não linear”• Pular de um ponto a outro
• Obter mais informações
• Voltar
• Navegar entre tópicos
Navegação através de hyperlinks (links)
Gráfico e fácil de navegar
Passado• “navegadores” via DOS
• MOSAIC Primeiros navegadores gráficos Primeiros navegadores gráficos
11
Histórico da Internet
Webpage da empresa
Histórico dos sites da empresa• http://www.archive.org
Multi-plataforma
Não importa a arquitetura do computador
Acesso via “qualquer dispositivo”
12
Distribuído
Não tem um servidor de arquivos central
Todos os dados são armazenados em inúmeros hosts espalhados pela Internet
C d h t i id tifi ã (IP) (DNS) Cada hosts possui uma identificação (IP) ou nome (DNS)
Dinâmico
Conteúdo muda a todo momento• Help desk
• Mecanismos de pesquisas
• Sites de notícias relacionamentos etc• Sites de notícias, relacionamentos, etc..
13
Interativo Ter uma resposta a sua ação.
Exemplos:• Navegação
• Chats
• Educação a distância
• Voz sobre IP
WebServer
Software que responde a requisições HTTP
“Entrega” páginas para o web browser do clientecliente
“Hospeda domínios”• Página estáticas: html
• Páginas dinâmicas
Exemplos:Exemplos:• Internet Information Server IIS
• Apache
• Apache TomCat
14
Exercícios
Estime a quantidade de dispositivos “diferentes” que poderão surgir nos próximos anos e suas funcionalidades.anos e suas funcionalidades.
Processo de registro de um domínio
Registrar o nome do domínio• Nacional
http://www.registro.br
• InternacionalInternacional Várias empresas são credenciadas (http://www.internic.com/alpha.html)
2 servidores de DNS• Traduzem o nome www.seila.com para um endereço IP 200.200.20.1
• Consultando servidores DNS nslookup www.seila.com.br
nslookup –type=NS
Consultando a página• GET http://a.b.c/HTTP/1.1 <enter>
• Host: a.b.c <enter>
• Connection: close <enter>