Introdu

1
Introdução à Programação para Web

• Carlos Bazilio
• Depto de Ciência e Tecnologia
• Pólo Universitário de Rio das Ostras
• Universidade Federal Fluminense

2
Objetivo

• Apresentar aos participantes alguns conceitos
  básicos atuais relacionados à programação e
  programação para web
• Introduzir algumas tecnologias, suas vantagens e
  desvantagens

3
Lição para um Profissional de Computação

• Prostituam-se! Prostituam-se quando o assunto
  for linguagem de programação, IDE, metodologia,
  arquitetura, ou qualquer outro tipo de escolha!

4
Arquitetura
5
Execução no Cliente (Browser)

• HTML
• CSS
• Javascript
• XML
• XSLT
• Tableless
• ...

6
HTML
lthtmlgt ltheadgt lttitlegtTítulo da
Páginalt/titlegt lt/headgt ltbodygt Esta é
minha primeira página. lt/bodygt lt/htmlgt
7
CSS
lthtmlgt ltheadgt ltlink href"pagina.css"
rel"stylesheet" type"text/css" /gt
lttitlegtTítulo da Páginalt/titlegt lt/headgt
ltbodygt Esta é minha primeira página.
lt/bodygt lt/htmlgt
8
CSS pagina.css
body background-color ffffff color
000000

• Demonstração http//www.csszengarden.com/

9
Tableless

• Padrão que vem sendo adotado na web para uso
  massivo de htmlcss
• Além, não utilizar tabelas html para construção
  de conteúdo diferente de tabela (origem do nome)
• Naturalmente, este uso não deveria ser evitado se
  o que se deseja é construir uma tabela
• Exemplo http//www.stopdesign.com/present/2004/dd
  w-seattle/tables/?no15

10
JavaScript
lthtmlgt ltbodygt ltscript type"text/javascript"gt
for (i 0 i lt 5 i) document.write("Al
o você !!!") document.write("ltbr
/gt") lt/scriptgt lt/bodygt lt/htmlgt
11
JavaScript
lthtmlgt ltheadgt ltscript type"text/javascript"
gt function alo(k) var s ""
for (i 0 i lt k i)
s s "Alo você !!!" s s "ltbr
/gt" return s
lt/scriptgt lttitlegtAlouuuuuult/titlegt lt/headgt
ltbodygt ltscript type"text/javascript"gt
document.write(alo(4)) lt/scriptgt
lt/bodygt lt/htmlgt
12
XML
lt?xml version"1.0" encoding"UTF-8"?gt ltlivrosgt lt
livro isbn0001gt lttitulogtJavaServer
Pageslt/titulogt ltautorgtNick Toddlt/autorgt ltedito
ragtCampuslt/editoragt ltassuntogtJSPlt/assuntogt lt/li
vrogt ltlivro isbn0002gt lttitulogtMeu pé de
laranja limalt/titulogt lteditoragtVozeslt/editoragt
ltautorgtBrilhantelt/autorgt lt/livrogt lt/livrosgt
13
XSLT
lt?xml version"1.0" encoding"UTF-8"?gt ltxslstyles
heet version"2.0" xmlnsxsl"http//www.w3.org/19
99/XSL/Transform" xmlnsxs"http//www.w3.org/2001
/XMLSchema" xmlnsfn"http//www.w3.org/2005/xpath
-functions"gt ltxsloutput method"xml"
version"1.0" encoding"ISO-8859-1"
indent"yes"/gt ltxsltemplate match"/"gt lthtmlgt
ltheadgtlttitlegtMeus livroslt/titlegtlt/headgt ltbodygt
lttable border"1"gt lttrgtltthgtTítulolt/thgtltthgtAuto
rlt/thgtlt/trgt ltxslfor-each select"//livro"gt
lttrgt lttdgtltxslvalue-of select"titulo"/gtlt/tdgt
lttdgtltxslvalue-of select"autor"/gtlt/tdgt lt
/trgt lt/xslfor-eachgt lt/tablegtlt/bodygtlt/htmlgt
lt/xsltemplategt lt/xslstylesheetgt
14
Execução no Cliente (Browser)

• Inferno dos web-designers compatibilidade
  entre browsers!
• Firefox
• Opera
• Internet Explorer (IECA)
• Konqueror

15
Execução no Servidor

• 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

16
Execução no Servidor
_ PHP ASP JSP
General PHP Hypertext Preprocessor Active Server Pages Java Server Pages
supported language(s) own script language JScript, VBScriptor 5 different Java
specifications runs on almost any platform webserver extension (IIS) no platform restrictions
functionality functionality by modules modularly built of COM-objects reusable components and tags
security complex code -gt complex securityopen source complex code -gt complex securityno open source complex code -gt complex securityopen source
performance interpreted language precompiled code(?) compiled to Servlets in bytecode (interpreted)
database connectivity MySQL-drivers included ActiveX data objects(ADO) by "JDBC" (MSQL, Oracle, Sybase)
17
Execução no Servidor

• Servidores Web
• IIS
• Apache
• Tomcat

18
IIS

• Internet Information Server
• Microsoft
• Famoso por apresentar diversos problemas de
  segurança no passado

19
Apache

• Servidor web mais utilizado no mundo atualmente
  (Fonte Netcraft)
• Software Livre
• Escrito em C
• Executa diversas linguagens script PhP, Perl,
  ASP, etc.
• Possui suporte nativo ao MySQL
• Permite definição de módulos para extensão do
  servidor
• Exemplo suporte para JSP

20
Tomcat

• 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

21
Servidores de Aplicação

• 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

22
Servidores de Aplicação

• Exemplos
• Java JBoss (Red Hat), WebLogic (BEA), WebSphere
  (IBM), Geronimo (Apache), Sun Application Server
  (SUN), Glassfish (baseado no da SUN)
• Microsoft .NET Framework

23
Afins

• RSS
• Web Services
• AJAX

24
RSS

• Really Simple Syndication
• 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 ..

25
RSS
26
Web Services

• 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

27
Web Services
28
Web Services
29
AJAX

• Asynchronous Javascript And XML
• Construção de páginas mais dinâmicas através de
  chamadas assíncronas ao servidor
• Não é uma tecnologia, mas sim uma combinação de
  tecnologias
• XHTML CSS XML XSLT XMLHttpRequest e
  JavaScript

30
AJAX
31
AJAX
32
AJAX
33
Padrões de Projeto

• Um padrão de projeto é uma solução comum para um
  problema comum encontrado no desenvolvimento de
  software (Sun)
• Sedimentação do conceito com o lançamento do
  livro Design Patterns Elements of Reusable
  Object-Oriented Software
• Não está amarrado a nenhuma linguagem OO.

34
Padrões de Projeto (GoF Gang of Four)
35
Padrões de Projeto

• A utilização desses padrões usualmente implica em
  algumas vantagens
• Facilidade de comunicação padrões possuem nomes,
  os quais resumem uma solução que deve ser de
  conhecimento comum entre equipes de
  desenvolvimento
• Credibilidade sua implementação estará
  utilizando soluções amplamente testadas e
  aprovadas
• Facilidade de manutenção padrões tendem a
  reduzir o acoplamento entre componentes, o que
  implica num sistema de fácil manutenção

36
Padrões de Projeto Exemplo Façade
37
import java.util. / "Façade" / class
UserfriendlyDate GregorianCalendar gcal
public UserfriendlyDate(String isodate_ymd)
String a isodate_ymd.split("-")
gcal new GregorianCalendar(Integer.valueOf(
a0).intValue(),
Integer.valueOf(a1).intValue()-1 / !!! /,
Integer.valueOf(a2).intValue())
public void addDays(int days)
gcal.add(Calendar.DAY_OF_MONTH, days)
public String toString() return new
Formatter().format("1tY-1tm-1td",
gcal).toString() / "Client" / class
FacadePattern public static void
main(String args)
UserfriendlyDate d new UserfriendlyDate("1980-08
-20") System.out.println("Date "d)
d.addDays(20)
System.out.println("20 days after "d)
38
MVC (Model-View-Controller)

• http//java.sun.com/blueprints/patterns/MVC-detail
  ed.html

39
Nosso Plano
40
Links Interessantes

• http//www.w3schools.com/
• Site com tutoriais on-line rápidos e com muita
  qualidade
• http//del.icio.us/carlosbazilio
• Meus links favoritos disponibilizados on-line
• http//en.wikipedia.org/wiki/Design_Patterns
• Wikipedia sobre Design Patterns
• http//www.hideout.com.br/usp/semacomp2005/slides/
  minicurso.html
• Slides de um minicurso sobre programação em web
  2.0