Você está na página 1de 70

INTRODUO A

PROGRAMAO WEB COM


CONEXO A BANCO DE
DADOS
2012
Tutor: SILVIO FERNANDES M. VASCONCELOS
(79) 9929-2920
silviofmv@yahoo.com.br
silvio_fm@msn.com (Uso s pra entrar no MSN)

Fone:

Programao Web 2012


Esta
apresentao
demonstrar a definio de
programa, suas declaraes
de
variveis,
constantes,
arrays
(vetores)
e
operadores:
Lgicos,
aritmticos e relacionais.
As estruturas:
- Condicionais;
- Repetio;
- Try-catch ()

Tambm
os
programas
necessrios
para
o
desenvolvimento e execuo
de aplicao web, bem como
a utilizao do JSP.

DEFINIO E UTILIZAO

Definio
Programao um conjunto de
instrues dada ao computador e uma
determinada linguagem numa certa
ordem para que possa ser executado
uma determinada tarefa.

Variveis
Para guardarmos esses dados, precisamos
solicitar ao computador que ele reserve um
espao na memria para nosso uso.

REGRAS

EXEMPLOS

Inicie sempre por uma


caractere alfabtico,
nunca por nmero

Nome (correto)
1nome (errado)

No utilize caracteres
especiais
como , ( ) / *; +.

Nome (M); N*B

A sintaxe para a declarao de variveis


em Java dada abaixo:

No coloque espaos em
branco
ou hfen entre nomes.

salario-bruto

Sintaxe:

Utilize, se necessrio,
underline

salario_bruto

Crie suas variveis com


nomes sugestivos.

Se vai guardar salrio de


funcionrios, d
varivel
o nome salario.

A forma de solicitar ao computador que


reserve memria chamada de declarao
de variveis.

tipo_da_variavel nome_da_variavel = valor inicial / objeto;


Exemplo:
String nome = "";
int idade = 0;
Vector vt = new Vector();

OBS: Lembrando que java case


sensitive, isto , letra maiscula
diferente de letra minscula.

Tipos de variveis
Tipo

Descrio

boelean

Pode assumir dois valores: true ou false.

char

Caractere em notao Unicode de 16 bits. Serve para a armazenagem de dados alfanumricos.


Tambm pode ser usado como um dado inteiro com valores na faixa entre 0 e 65535.

String

Armazena caractere em notao de 16 bits. Serve para a armazenagem de dados alfanumricos.


Tambm pode ser usado como um dado inteiro com valores na faixa entre 0 e 65535.

int

Tipo numrico inteiro, pode assumir valores numa faixa de -32768 a +32767, ocupa 2 byte
de memria.

short

Armazena nmeros inteiros de 16 bits em notao de complemento de dois. Os valores


possvels cobrem a faixa de -2-15=-32.768 a 215-1=32.767.

long

Aloca inteiros de 64 bits. Pode assumir valores entre -263 e 263-1.

float

Representa nmeros em notao de ponto flutuante, normalizada em preciso simples de


32bits. O menor valor positivo representado por esse tipo 1.40239846e-46 e o maior
3.40282347e+38.

double

Representa nmeros em notao de ponto flutuante normalizada em preciso dupla de 64 bits


em conformidade com a norma IEEE 754-1985. O menor valor positivo representvel
4.94065645841246544e-324 e o maior 1.7976931348623157e+308.

Arrays (vetores)
Arrays so conjuntos de variveis
com o mesmo nome e diferenciadas
entre si por um ndice. Eles so teis
para
manipularmos
grandes
quantidades de dados de um
mesmo tipo, pois evitam a
declarao de diversas variveis.
Sintaxe:
Tipo_da_Variavel[] nome_da_variavel ;

1 Exemplo:
String[] nome;
int[] idade;
2 Exemplo:
String[][] nome;
int[][] idade;

OBS: Lembrando que o java j tem um objeto chamado


Vector que cira vertor com seus mtodos (funes) pr
definidas.

Estrutura de atribuio
Comando de Atribuio:
Para armazenar um determinado
valor durante a execuo do
programa. Para isso, utilizamos o
comando de atribuio que, em Java,
representado por igual (=),
conforme sintaxe abaixo:
Sintaxe: identificador = expresso
identificador
Nome da varivel ou constante a ser utilizada
expresso
Valor ou expresso a ser armazenado (veremos ainda
neste captulo que podemos ter expresses
aritmticas e expresses lgicas).

Exemplo:
String nome = "";
double nota = 0.0;
nome = "Silvio";
nota = 9.5;

Operadores aritmticos, lgicos e


relacionais.
Operadores relacionais

Operadores aritmticos
Operad Operao
or
Matemtica

Operad Operao Relacional


or

Adio

==

Igual

Subtrao

!=

Diferente

Diviso

>

Maior

Multiplicao

>=

Maior ou igual

Resto da diviso inteira

<

Menor

Potenciao

<=

Menor ou igual

Operadores lgicos
Operad Operao lgica
or
&&

E (Disjuno)

||

OU (Conjuno)

NO (Negao)

Estrutura Condicional if ( ) {}
(Deciso)
A sintaxe de deciso em Java dada
abaixo:
Sintaxe:
if (condio) {
{Bloco de comandos executados se for verdadeira}

}
else {
{Bloco de comandos executados se for falsa}

Caso voc no queira executar qualquer


comando se a condio for falsa,
suprima toda a clusula else :
if (condio) {
{Bloco de comandos executados se verdadeira}
}
Exemplo:
double nota = 7.5;
if (nota >= 7) {
System.out.println( Aprovado);
} else {
System.out.println(Reprovado);
}

Estrutura Condicional switch ()(Deciso


Multiplas)
A sintaxe de deciso em Java dada
abaixo:
Sintaxe:
switch (expresso) {
case possibilidade1:

O comando case um substituto mais


elegante e mais legvel para switch
mltiplos.
A expresso (ou possibilidade) dever
ser de tipo com o tamanho mximo de 2
bytes (Byte, Char,Word ou Int) .

bloco_de_instruo1;
break;

Segue um exemplo :

case possibilidade2 :
bloco_de_instruo2;

int numero1 = 10, numero2 = 5, resultado=0;

break;

char ch;

case possibilidadeN :
bloco_de_instruoN;
break;
default :
bloco_de_instruo;
}

Estrutura Condicional switch ()(Deciso


Multiplas)
switch (ch) {
case "+":
resultado = numero1 + numero 2;
break;
case "-" :
resultado = numero1 - numero 2;
break;
case "/" :
resultado = numero1 / numero 2;
break;
case "*" :
resultado = numero1 / numero 2;
break;
default :
System.out.println("Operao invlida...");
}

Estrutura Repetio for ()


A sintaxe de repetio em Java
dada abaixo:

Segue um exemplo :
for (int conta = 0;conta < 10;conta++) {
System.out.println(conta);

Sintaxe:
for (int contador =0; condio; incremento) {
{bloco_de_instrues};
}

contador uma varivel inteira com


valor inicial;
condio a condio para o
encerramento do loop;
incremento esse incrementa ou
decrementa o valor do contador cada
vez que o bloco de instrues
executado.

Estrutura de Repetio wile ()


A sintaxe de repetio em Java
dada abaixo:

for falsa o bloco_de_instrues no ser


executado nenhuma vez.

Sintaxe:

Segue exemplo:

while (expresso) {
{bloco_de_instrues}
}

int conta = 0;
while (conta < 10) {
System.out.println(conta);

Note que o bloco_de_instrues


executado enquanto a expresso for
verdadeira.
Note que como a expresso
avaliada antes da execuo do
bloco_de_instrues, se a expresso

conta++;
}

Estrutura try-catch()
A sintaxe de seleo em Java dada
abaixo:
Sintaxe:
try {
squncia_de_instrues
}
catch (exceo ) {
bloco_a_ser_executado_no_caso_de_erros
}

Esta estrutura nos permite tratar de


forma conveniente os erros ocorridos
no programa. Sem ela, ocorrendo um
erro, o Java dispara o seu mecanismo
de tratamento de excees,
normalmente emite uma

mensagem de erro em ingls e no nos


dando chance de recuperao. Com
esta estrutura podemos detectar o
erro,
fornecer
uma mensagem
inteligvel e permitir o retorno rotina
onde ocorreu o erro e permitir, por
exemplo, a possibilidade de digitao.

Mtodos
Mtodos so rotinas que recebem valores,
passados como parmetros, a partir da
unidade ou fora dela, e retornam apenas
um valor como resultado, ou no retorna
nada, somente executa as instrues. Os
mtodos so definidas obedecendo
seguinte sintaxe:

Mtodo s executando:
public void NomeDoModo() {
{bloco de instrues}
}
Exemplo:
// Metodo que cria a conexao com o banco de dados
public void Conexao() {
try {

Mtodo retornado valor:

Class.forName("com.mysql.jdbc.Driver");

public tipo de retorno NomeDoModo(tipo variavel,


tipo variavel) {
{bloco de instrues}

con
=
DriverManager.getConnection("jdbc:mysql://localhost:33
06/agenda","root", "");

con.setAutoCommit(false);

Exemplo:

stmt = con.createStatement();

// Mtodo que retona a hora do Sistema

public String HoraSistema() {

catch (Exception ex) {ex.printStackTrace();}

Calendar data = Calendar.getInstance();

}
return

(data.getTime().toString().substring(11,19));
}

APLICAO WEB

Aplicao Web
Antes de instalarmos a IDE NetBeans, precisamos instalar primeiro:
Java JDK 6 (superior): Compilador Java.
TomCat 5 (superior): Servidor de aplicao web.
Eclipse: IDE de desenvolvimento de aplicao Java.

JAVA JDK 6 (superior)


Para o desenvolvimento de aplicativos utilizando o Java, necessrio a
instalao do compilador Java, das APIs e da JVM. Que isso tudo j vem no
pacote Java JDK. A instalao do ambiente segue o mesmo esquema da
instalao de qualquer produto para Windows. Podendo ser feito o download da
verso mais apropriada via ftp ou http e executar o arquivo, para que o produto
se instale. As verses para Windows, Linux e Solaris pode ser obtido em:
http://java.sun.com

Aplicao Web
TOMCAT 5 (superior)
Tomcat um servidor de pginas JSP e Servlets. Desenvolvido pela fundao
Apache, no projeto Jakarta, seu cdigo aberto e o programa gratuito. Pode ser
obtido em http://jakarta.apache.org.
O que JSP ?
JSP significa Java Server Pages. Esta tecnologia usada para servir contedo
dinmico para o usurio, usando lgica e dados no lado do servidor. JSP faz parte
da plataforma J2EE (Java 2 Enterprise Edition) e juntamente com os Java
Servlets e Java Beans pode ser usada para desenvolver aplicaes web eficientes,
escalveis e seguras rapidamente. E usando o Java para Web, nos permite utilizar o
modelo de desenvolvimento de trs camadas, que so elas:
Interface: Referisse a tela do usurio;
Regra de negcio: a comunicao entre a interface e banco de dados;

Aplicao Web
Banco de dados: Onde ser guardo as informaes como mensagens e

contedos.
Pois esse modelo permite que mais de um profissional de reas diferentes trabalhem
no mesmo programa sem atrapalhar um ao outro, como por exemplo, pode ter
um profissional em design desenvolvendo a interface (tela), um na rea de
programao web criando as classes (regra de negcios) e outro especialista em
banco de dados, assim dando mais agilidade no comunicao dos dados com o
programa.
1. JSP Tags
Numa olhada rpida, JSP parece com HTML (ou XML), ambos contm texto
encapsulado entre tags, que so definidas entre os smbolos < e >. Mas enquanto
as tags HTML so processadas pelo navegador do cliente para mostrar a pgina,
as tags de JSP so usadas pelo servidor web para gerar contedo dinmico. A
seguir esto os tipos de tags vlidos em JSP:

Aplicao Web
1.1. Aes JSP
Executam diversas funes e estendem a capacidade de JSP. Usam sintaxe parecida
com XML, e so usadas (entre outras coisas) para manipular Java Beans. Abaixo
segue algumas delas:
<jsp:forward>
Este elemento transfere o objeto request contendo informao da requisio do
cliente de uma pgina JSP para outro arquivo. Este pode ser um arquivo HTML,
outro arquivo JSP ou um servlet, desde que faa parte da mesma aplicao.
Sintaxe:
<jsp:forward page="(URL relativa | <%= expresso %>)" />

Aplicao Web
Ou
<jsp:forward page="(URL relativa | <%= expresso %>)" >
<jsp:param name="nome do parmetro" value="(valor do parmetro| <%=
expresso %>)" />
</jsp:forward>
<jsp:getProperty>
Este elemento captura o valor da propriedade de um bean usando o mtodo get da
propriedade e mostra o valor na pgina JSP. necessrio criar ou localizar o bean
com <jsp:useBean> antes de usar <jsp:getProperty>.
Sintaxe:
<jsp:getProperty name="nome do objeto (bean)" property="nome da
propriedade" />

Aplicao Web
<jsp:useBean>

Localiza ou instancia um componente. Primeiro tenta localizar uma instncia do


bean. Se no existe, instancia ele a partir da classe especificada. Para localizar ou
instanciar o bean, so seguidos os seguintes passos, nesta ordem:
1. Tenta localizar o bean com o escopo e o nome especificados.
2. Define uma varivel de referncia ao objeto com o nome especificado.
3. Se o bean for encontrado, armazena uma referncia ao objeto na varivel. Se foi
especificado o tipo, converte o bean para este tipo.
4. Se no encontrar, instancia-o pela classe especificada, armazenando uma
referncia ao objeto na nova varivel.
5. Se o bean tiver sido instanciado (ao invs de localizado), e ele tem tags de corpo
(entre <jsp:useBean> e </jsp:useBean>), executa estas tags.

Aplicao Web
Sintaxe:
<jsp:useBean id="nome da instancia" scope="page|request|
session|application" class="package.class" />
<jsp:setProperty>

O elemento <jsp:setProperty> ajusta o valor de uma ou mais propriedades em um


bean, usando os mtodos de ajuste (set) dele. necessrio declarar o bean com
<jsp:useBean> antes de ajustar uma propriedade. Estas duas aes trabalham
juntas, portanto o nome de instncia usada nas duas deve ser igual.

Aplicao Web
Sintaxe:
<jsp:setProperty name="nome de instncia do bean"
{ property="*" |
property="nome da propriedade" [ param="nome do
parmetro" ] |
property="nome da propriedade" value="{string | <%=
expresso %>}"
}
/>
1.2. Diretivas
So instrues processadas quando a pgina JSP compilada em um servlet.
Diretivas so usadas para ajustar instrues no nvel da pgina, inserir dados de
arquivos externos, e especificar tag libraries. Diretivas so definidas entre <%@ e
%>. Existem trs tipos de diretivas:

Aplicao Web
Include
Inclui um arquivo esttico em uma pgina JSP.
Sintaxe:
<%@ include file="relativeURL" %>
Page
Define atributos que so aplicados a todo o arquivo JSP, e a todos os seus arquivos
includos estaticamente.

Aplicao Web
Sintaxe:
<%@ page
[ language="java" ]
[ extends="package.class" ]
[ import="{package.class | package.*}, ..." ]
[ session="true|false" ]
[ buffer="none|8kb|sizekb" ]
[ autoFlush="true|false" ]
[ isThreadSafe="true|false" ]
[ info="text" ]
[ errorPage="URL relativa" ]
[ contentType="mimeType [ ;charset=characterSet ]" |
"text/html ; charset=ISO-8859-1" ]
[ isErrorPage="true|false" ]
%>

Aplicao Web
1.3. Declaraes
So similares com as declaraes de variveis em Java, e definem variveis para
uso subsequente em expresses ou scriptlets. So definidas entre <%! e %>.
Sintaxe:
<%! int x = 0; declarao; ... %>
1.4. Expresses
Contm um comando vlido da linguagem Java que avaliado, convertido para um
String, e inserido onde a expresso aparece no arquivo JSP. No usado ponte e
vrgula para terminar a expresso, e s pode haver uma entre <%= e %>.
Sintaxe:
<%= pessoa.getNome() %>

Aplicao Web
1.5. Scriptlets
So blocos de cdigo Java embutidos numa pgina JSP. O cdigo do scriptlet
inserido literalmente no servlet gerado pela pgina. definido entre <% e %>.
Sintaxe:
<% int x = 0; x = 4 * 9; String str = "PET"; ...%>
1.6. Comentrios
So similares aos comentrios HTML, mas so tirados da pgina quando o arquivo
JSP compilado em servlet. Isto significa que os comentrios JSP no aparecem no
cdigo fonte da pgina visualizada pelo navegador do usurio. Comentrios em
HTML so feitos entre <! e >, enquanto comentrios em JSP so entre <% e
%>

Aplicao Web
ECLIPSE 3.5 (superior)
O Eclipse IDE um ambiente de desenvolvimento integrado gratuito e e de
cdigo aberto para desenvolve-dores de software. O IDE executado em muitas
plataformas, como Windows, Linux, Solaris e MacOS. fcil de instalar e usar.
O Eclipse oferece aos desenvolvedores todas as ferramentas necessrias para criar
aplicativos profissionais de desktop, empresariais, Web e mveis multiplataformas.
Podendo ser baixado em:
http://www.eclipse.org/downloads/packages/release/galileo/r

DEFINIO E UTILIZAO
DO HTML

Definio
Os comandos em HTML so
chamados de tags, e eles iro dizer ao
navegador como o texto, a
informao e as imagens sero
formatadas e exibidas. Por exemplo,
uma tag pode dizer que um
determinado texto ser exibido em
negrito, itlico e com um tipo de
fonte qualquer. Alm de formatao
de texto uma tag tambm pode dizer
que na verdade um determinado
bloco desse texto est ligado um
endereo para outra pgina Web. As
tags HTML so identificadas pelos
smbolos <> (em uma tag de abertu-

ra) e <I> (em uma tag de


fechamento). Ou seja, quando voc
especifica uma tag de abertura para a
formatao de um bloco de texto,
voc dever tambm, specificar a tag
de fechamento, logo no fmal desse
bloco de texto. Portanto, a maioria
das tags so duplas. O formato mais
comum : <NOME DA TAG>
contedo </NOME DA TAG>.
As tags HTML no so sensveis a
maisculas e minsculas, ou seja,
tanto faz escrever <HTML> <Html>
<html> <HtMI>.

Estrutura do documento em
HTML

Um programa HTML dividido em


trs partes bsicas: a estrutura principal, o
cabealho e corpo de texto.
Estrutura Principal
Cabealho
Corpo de Texto

A estrutura bsica de um documento


HTML so as linhas obrigatrias e
essenciais para um bom funcionamento de
uma pgina Web. Observe a seguir essa
estrutura:

<HTML>

<HEAD>
<TITLE> Titulo da pgina </TITLE>
</HEAD>
<BODY>
Aqui ser montada a pgina.
</BODY>
</HTML>

Tag <BODY>
Atravs de atributos da tag
<BODY>, podemos definir cores para
os textos, links e para o fundo das
pginas, bem como uma imagem de
fundo para um documento.
Atributos da tag body:
bgcolor cor de fundo da pgina.

Se no for indicada uma cor de fundo,


o navegador exibir o valor padro,
que pode ser cinza ou branco.
Exemplo: <body bgcolor = cor>
text: cor do texto do
documento. O valor padro preto.
Exemplo: <BODY TEXT = cor>

background: indica o endereo da

imagem que ser aplicada no fundo da


pgina. Exemplo: <body background =
caminho do arquivo>
Lembrando que no precisa repetir
varias vezes o comando (tag) para cada
atributo, digita somente o comando uma
vez e depois seus atributis separado de
espao em cada para cada um.
Exemplo:
<body text=red link= blue
background=imagem.jpg >

Tag <BR>
Quando voc precisar forar uma
quebra de linha em uma frase, voc
poder utilizar a tag <BR>. Isso
porque, quando voc utiliza a tag
<P>, ela acrescenta uma linha em
branco entre os dois pargrafos. A tag
<BR> no precisa de uma tag de
fechamento. Um uso comum para o
elemento <BR> em pgina, seria na
descrio de um endereo postal:
Exemplo:
<P>Casa Verde <BR> Av. 21 de
Julho, 66 <BR> Bairro Centro <BR>
CEP: 16550-000
</P>

Observe que no importa a forma


como escrevemos o cdigo no editor, a
formatao ser definida pelas tags.

Tag <P>
A tag <P> delimita os pargrafos e
insere uma linha em branco entre eles.
Isso porque, o interpretador de HTML
no sabe onde um pargrafo termina e
outro comea. Ento se voc digitar
um bloco de texto sem utilizar a tag
<P>, esse mesmo bloco de texto ser
exibido como uma longa linha de
texto na pgina. A tag <P> possui a
tag de fechamento </P>, porm o seu
uso opcional.
Exemplo:
<P ALIGN= "right"
STYLE="color: red; font-family:
Arial; font-size: 14pt">
Este pargrafo </P>

Atributos da tag p:
align: esse atributo define uma

posio de alinhamento para o elemento


que est sendo formatado pela tag. Os
valores do atributo podem ser: LEFT
(esquerda), CENTER (centralizado),
RIGHT
(direita)
ou
JUSTIFY(justificado).
style: os valores desse atributo

alteram as propriedades: cor, fonte,


tamanho, sublinhado e estilo do texto
marcado.

Cores para Web


Para alterar a cor de link.s, tabelas,
textos, entre outros, necessrio
atribuir um valor para o atributo que
define a cor. Os valores das cores so
especificados
por
padres
alfanumricos, no modo de cor RGB
(Red vermelho, Green - verde e
Blue -azul) com base hexadecimal.
Por exemplo, a cor branca
representada pelo valor FFFFFF, j o
preto, que a ausncia de cores,
representado pelo valor 000000. As
cores podem ser especificadas pelo
seu valor e tambm usando o seu
prprio nome.

Tag <FONT>...</FONT>
utilizada para modificar
propriedades das fontes. Essa tag
um recipiente cujo contedo
renderizado
com
caractersticas
particulares definidas por seus
atributos.
Atributos da tag <font>...</font>:
color = "valor": atributo que

ajusta a cor de todo o texto que est


localizado entre as tags <FONT> ...
</FONT>. Exemplo: <FONT COLOR
= "#FFCC99"> ... </FONT>

size = "valor": utilizado para


especificar um tamanho em pontos para
fonte que ser apresentada. possvel
utilizar um valor inteiro ou relativo. Os
valores inteiros vo de 1 a 7. Os valores
relativos, utilizam o tamanho da fonte
padro do navegador para se ajustar na
tela. Por exemplo, se o tamanho da fonte
padro do navegador for 3, voc poder
especificar um valor + 3, para que a
fonte seja trs vezes maior que a fonte
padro do navegador. Porm, o tamanho
da fonte ser sempre ajustado dentro da
faixa de valores de 1 a 7. Exemplo:

<FONT SIZE= "3">..... </FONT>


<FONT SIZE= "+3">....</FONT>

Tag s<B>...</B>, <I>...</I>,


<S>...</S> e <U>...</U>
utilizada para aplicar o efeito de
Negrito em todo bloco de texto entre
<B>....</B>.
utilizada para aplicar o efeito de
Itlico em todo bloco de texto entre
<I>....</I>.
utilizada para aplicar o efeito de
trachado em todo bloco de texto entre
<S>....</S>.
utilizada para aplicar o efeito de
Sublinhado em todo bloco de texto
entre <U>....</U>.

LINK
Com a linguagem HTML
possvel criar documentos com o
conceito de hipertexto, ou seja,
documentos que se comunicam com
outros documentos. Por meio de
ligaes especiais conhecidas como
links ou hiperlinks. Essas ligaes
podem ser entre elementos do prprio
documento, como reas ou sees
distintas do documento, ou em outra
pgina da Web. A utilizao de links
facilita muito a criao de pginas
extensas, ou sites com muitas pginas,
pois por meio deles possvel acessar
rapidamente o assunto desejado. Para
compreender melhor imagine uma
pgina que contenha um assunto divi-

dido em tpicos e que tenha no incio


da pgina um sumrio indicando cada
tpico, como em um livro. Para
acessar um assunto especfico basta
clicar sobre o tpico desejado e ele
ser exibido imediatamente. Nas
pginas da Web os links so muito
utilizados para que o visitante possa
acessar as vrias pginas do site.

Tag <A>...</A>
A tag utilizada para criar um link
a tag <A>, mas para que um texto ou
imagem receba uma ligao
necessrio utilizar os atributos dessa
tag.
Atributos da tag <a>...</a>:
href : o atributo da tag <A>

utilizado para criar links o HREF.


Esse atributo o responsvel por
determinar o destino do link. A
criao de um link bsico realizada
com o seguinte cdigo:
<A HREF = "URL" > Texto </A>

Onde:
URL - o caminho absoluto ou
relativo do documento de destino;
Texto - um bloco de texto ou
imagem que ser utilizado como a
ligao entre o elemento especificado
no atributo HREF e o documento que
possui o link. Resumindo, o texto
que ser clicado pelo usurio para que
o link possa funcionar.
Veja um exemplo de um link:
<A
HREF="http://www.editoraviena.com.
br> Visite nosso site </A>

Tag <A>...</A>
target: O atributo TARGET

utilizado para especificar como o


documento ou a pgina de destino do
link devem ser carregados. Ao clicar
em um link, o resultado poder ser
exibido na janela atual do navegador,
em uma nova janela ou em uma
moldura nomeada.
Veja a seguir os valores pr-definidos
para o atributo TARGET.
_blank: carrega o documento
vinculado em uma janela nova do
navegador;

_parent: carrega o documento


vinculado na moldura me
(frameset) ou na janela da moldura
que contm o link. Se a moldura onde
est o link no estiver aninhada, o
documento vinculado ser carregado
na janela inteira do navegador;
_self: carrega o documento vinculado
na mesma moldura ou janela que o
link est localizado. Esse destino o
padro, portanto geralmente no
necessrio especific-lo;

Tag <A>...</A>
_top: carrega o documento vinculado
na janela inteira do navegador,
removendo, por conseguinte, todas as
molduras. tratado como _self, se
no existir nenhum frameset na janela.
Veja a seguir como criar um link que
ser aberto em uma nova janela do
navegador:
<A
HREF="produtos.htm"
TARGET="_blank"> Clique aqui para
abrir a pgina de produtos em uma
nova janela.
</A>

Dessa forma, quando o usurio


clicar no link criado anteriormente, o
documento "produtos.htm" ser aberto
e carregado em uma nova janela do
navegador, sem que o usurio perca o
contedo da janela atual.

Tag <IMG>
Para inserir imagens em documentos
HTML, necessrio utilizar a tag
<IMG>. Este elemento possui muitos
atributos que possibilitam ajustar o
posicionamento
de
imagens
corretamente em blocos de texto.
possvel tambm especificar se a
imagem ser apresentada com bordas
e ainda, especificar a imagem
alternativa. No necessrio utilizar
uma tag de fechamento quando se
insere imagens atravs do elemento
<IMG>. Portanto, quando for inserir
imagens em documentos HTML, no
utilize a tag de fechamento </IMG>,
at porque, isso deve gerar resultados
indesejados.

Para inserir uma imagem em um


documento obrigatrio utilizar junto
com a tag <IMG> o atributo SRC.
Esse atributo essencial para colocar
uma imagem em uma pgina HTML,
e por isso alguns autores j o
considera parte da tag: <IMG SRC>.
Veja a sintaxe seguir:
<IMG SRC = "URL imagem>
Exemplo:
<IMG SRC ="Evolucao03.jpg>

Tag <IMG>
Atributo da tag <img>:
WIDTH e HEIGHT: Os atributos
WIDTH e HEIGHT definem,
respectivamente, a largura e a altura
da imagem. Eles reservam espao para
uma imagem em uma pgina durante
o carregamento desta em um
navegador. Embora sejam opcionais
estes atributos devem ser sempre
utilizados, pois, o navegador j deixa
reservado o espao da imagem, tendo
como base os valores especificados
nos atributos. Caso contrrio, o
navegador s saber o valor das
dimenses da imagem, aps o
carregamento das mesmas.

Os valores atribudos a WIDTH e


HEIGHT podem ser em pixels ou em
porcentagem. Nesse ltimo caso insira
o caractere de porcentagem (%) na
frente do valor. Acompanhe o
exemplo a seguir:
<IMG SRC =
WIDTH = "150">

"torredipisa.gif"

No exemplo acima, a primeira


imagem "torredipisa.gif" foi definida
com 150 pixels de largura. Quando
utilizamos apenas o atributo WIDTH,
a imagem tem suas dimenses
alteradas proporcionalmente, ou seja,
a altura da imagem "torredipisa. gif"
foi alterada de modo que no ficasse
distorcida para a largura de150 pixels.

Tag <IMG>
<IMG SRC = "torredipisa.gif"
WIDTH = "150" HEIGHT = "120">
Se voc no souber as dimenses
corretas da imagem, o mais sensato
utilizar somente um dos atributos,
WIDTH ou HEIGHT, pois assim a
imagem no ficar distorcida.
Para inserir imagens em documentos
HTML, necessrio utilizar a tag
<IMG>. Este elemento possui muitos
atributos que possibilitam ajustar o
posicionamento
de
imagens
corretamente em blocos de texto.
possvel tambm especificar se a
imagem ser apresentada com bordas
e ainda, especificar a imagem
alternativa.

No necessrio utilizar uma tag


de fechamento quando se insere
imagens atravs do elemento <IMG>.
Portanto, quando for inserir imagens
em documentos HTML, no utilize a
tag de fechamento </IMG>, at
porque, isso deve gerar resultados
indesejados.

Tag <TABLE>...</TABLE>
A tag utilizada para inserir uma
tabela a <TABLE>. Para essa tag
obrigatrio utilizar a t ag de
fechamento </TABLE>. Alm da tag
<TABLE> so necessrias mais duas
tags para a construo de uma tabela:
<TD></TD> e <TR></TR>. A tag
<TD> responsvel por criar clulas
e a tag <TR> responsvel pelas
linhas.
Veja a seguir, um exemplo de uma
tabela simples em HTML:

<TABLE BORDER = 1> <!


Inicia a tabela>
<TR> <! Inicia a primeira
linha>
<TD> Nome </TD> <!
Incio e fim de uma clula>
<TD> Sobrenome </TD>
</TR> <! Finaliza a
primeira linha>
<TR> <! Inicia a segunda
linha>
<TD> Joo </TD>
<TD> Silva </TD>
</TR> <! Finaliza a
segunda linha>

Tag <TABLE>...</TABLE>
Atributo da tag <table>:
align:
Este
atributo
determina como a tabela ser
alinhada no corpo da pgina.
Existem trs possveis valores
para esse atributo.

Exemplo: <TABLE ALIGN


"center"> ... </TABLE>

So eles:
left: alinha a tabela para o

lado esquerdo.
center: alinha a tabela no

centro;
rigth: alinha a tabela para o

lado direito.

bgcolor: Este atributo


permite definir uma cor de
fundo para toda a rea de
uma tabela ou para uma rea
menor
que
deve
ser
destacada. A cor de fundo
definida nesse atributo
exibida atrs do contedo da
tabela.

Exemplo: <TABLE BGCOLOR =


"red"> ... </TABLE>

Tag <FORM>...<FORM>
A tag HTML utilizada para
a criao de formulrios a
<FORM></FORM>. Esta tag
delimita o contedo de um
formulrio e contm uma
seqncia
de
elementos
utilizados para a coleta de
informaes. Voc pode inserir
a
maioria
de
tags
de
formatao
dentro
dos
formulrios,
tags
de
pargrafos, tabelas, imagens,
listas. Porm no permitido
que sejam inseridos outros
formulrios.
Atributo da tag <table>:

action: Esse atributo

utilizado para especificar a


URL do script que ir
processar o contedo do
formulrio.
Observe o exemplo:
<FORM ACTION =
"mailto:endereo@correio.co
m.br"> ... </FORM>

Tag <FORM>...<FORM>
A tag HTML utilizada para
a criao de formulrios a
<FORM></FORM>. Esta tag
delimita o contedo de um
formulrio e contm uma
seqncia
de
elementos
utilizados para a coleta de
informaes. Voc pode inserir
a
maioria
de
tags
de
formatao
dentro
dos
formulrios,
tags
de
pargrafos, tabelas, imagens,
listas. Porm no permitido
que sejam inseridos outros
formulrios.
atributo da tag <table>:
action: Esse atributo

Observe o exemplo:
<FORM ACTION =
"mailto:endereo@correio.co
m.br"> ... </FORM>
Nesse exemplo os dados do
formulrio
sero
enviados
para o endereo de e-mail
especificado. O script de
processamento tambm pode
ser um arquivo.
Exemplo: <FORM
ACTION="processa.php"> ...
</FORM>

Tag <FORM>...<FORM>
method:
O
atributo
METHOD utilizado para
especificar o mtodo de envio
do contedo do formulrio. H
dois mtodos possveis de
serem utilizados: GET ou
POST. Ambos os mtodos
transferem o contedo do
formulrio
para
ser
processado por um script no
servidor remoto. Porm, cada
um utilizado para uma
aplicao especfica. Veja a
seguir a diferena entre eles:

GET: o mtodo GET envia o


contedo
do
formulrio
anexado a URL especificada
no
atributo
ACTION.

mente pequeno. Isso porque,


o contedo mximo de dados
transmitidos em uma URL
de aproximadamente 8192
caracteres. Caso o contedo
ultrapasse esse valor, os
dados do formulrio podem
chegar truncados ao seu
destino, causando resultados
inesperados.
POST: esse mtodo envia o
contedo do formulrio no
corpo de uma mensagem.
Permite que seja enviada uma
grande
quantidade
de
informao para um script que
ir processar o formulrio. Em
geral, so utilizados trs tipos

Objetos do formulrio
Um formulrio composto
por
vrios
elementos
responsveis por receber as
informaes digitadas pelo
usurio.
Esses
elementos
sero apresentados nos itens
a seguir.

Tag <INPUT>
A
tag
<INPUT>

responsvel por inserir uma


variedade de campos de
entrada de dados em um
formulrio. O que define qual
mecanismo de entrada a tag
est
adicionando
no
formulrio o valor atribudo
ao seu atributo TYPE, e pode
ser botes, campos de texto
etc.
atributo da tag <imput>:
TYPE: especifica o tipo

de campo que ser criado;


VALUE: criar um valor

NAME:
nomeia
cada
elemento de um formulrio.
Isso necessrio para que o
script que ir processar o
formulrio possa manipular
cada elemento;

SIZE: muda o tamanho do

elemento definido em TYPE.


o atributo TYPE que define
qual elemento ser adicionado
ao
formulrio
pela
tag
<INPUT>.

Tag <INPUT> - Campo Texto


(TEXT)
Um campo de texto
inserido em um formulrio
atribuindo o valor TEXT ao
atributo TYPE. Esse tipo de
campo pode ser utilizado para
receber dados do tipo: nomes
de
usurio,
endereos,
telefone etc. Veja a seguir o
cdigo necessrio para a
criao de um campo de
entrada de texto:
Exemplo:
Nome:<INPUT TYPE =
"text" NAME = "login" SIZE =
"30">

Tag <INPUT> - Campo Senha


(PASSWORD)
Este tipo de campo de
texto utilizado para entrada
de
dados
sigilosos.
Normalmente, utiliza-se esse
tipo de campo para requisitar
a senha de um usurio.
Quando o usurio comea a
digitar as informaes nesse
campo, os caracteres vo
sendo "mascarados" por um
caractere especfico, como,
por exemplo, o asterisco (*).

Exemplo:
Nome:<INPUT TYPE =
password" NAME = senha

Tag <INPUT> - Campo Seleo


(CHECKBOX)
Uma caixa de seleo ou
"checkbox" utilizada para
configurar objetos de seleo
predefinidos. Ou seja, cada
opo possui uma caixa de
seleo e o usurio dica na
caixa de seleo para fazer a
escolha.
Nas
caixas
de
seleo, o usurio alterna
cada resposta para Ativa ou
Inativa. As opes das caixas
de
seleo
funcionam
independentemente.
O
usurio
poder
selecionar
mais de uma opo em um
grupo de caixas de seleo.

Para criar um conjunto de


itens
para
seleo,

necessrio manter o mesmo


nome no atributo NAME para
todas as caixas de seleo de
um
conjunto,
mudando
apenas os valores de cada
atributo VALUE de cada caixa
de seleo.
Exemplo:
<INPUT TYPE = checkbox"
NAME = tipo > Alfabtico

Tag <INPUT> - Campo Opo


(RADIO)
Os
botes
de
opo
funcionam como um grupo e
fornecem valores de seleo
mutuamente exclusivos.
possvel selecionar apenas
uma opo em um grupo de
botes de opo. O nome
definido para o atributo NAME
deve ser o mesmo para todos
os botes de um grupo, e os
valores do atributo VALUE
deve ser diferente para cada
um deles, como nas caixas de
seleo.
Exemplo:

Tag <INPUT> - Botes SUBMIT e


RESET
Os botes controlam as
operaes relacionadas aos
formulrios. Para criar um
boto de ao, voc utilizar a
tag <INPUT>. No atributo
TYPE dessa tag, voc poder
especificar trs possveis tipos
de boto de ao: SUBMIT,
RESET e BUTTON.
SUBMIT: boto utilizado
para enviar as informaes
que o usurio digitou para a
URL especificada no atributo
ACTION da tag <FORM>;
RESET: boto utilizado

BUTTON: utilizado para criar


um boto que disparar uma
ao que ser processada por
um script que pode estar
embutido na prpria pgina.
Exemplos:
<INPUT TYPE = submit"
NAME = botao1
value=enviar>
<INPUT TYPE = reset"
NAME
=
botao1
value=limpar>
<INPUT TYPE = button"

Tag <TEXTAREA> ... </TEXTAREA>


O campo rea de texto
fornece ao usurio uma rea
maior, na qual possvel
digitar uma mensagem. Para
criar um campo de texto de
mltiplas linhas, utiliza-se a
tag
<TEXTAREA></TEXTAREA>.
Essa tag possui dois atributos,
ROWS
e
COLS,
que
especificam, respectivamente,
o nmero mximo de linhas e
colunas que se deseja mostrar
para o usurio. Se o texto
digitado
ultrapassar
as
definies,
o
campo
se
estende de acordo com a

Exemplo:
<TEXTAREA
NAME="mensagem"
COLS="40" ROWS="5">
Insira o texto aqui.
</TEXTAREA>

Tag <SELECT> ... </ SELECT >


Quando desejar apresentar
diversas opes ao usurio
em um espao limitado, utilize
uma lista de opes ou menu.
Embora as listas e menus de
formulrios
sejam
criados
utilizando
a
mesma
tag
<SELECT></SELECT>, estes
componentes fornecem ao
usurio
recursos
de
funcionalidade
diferentes.
Acompanhe a sintaxe da tag
<SELECT>:

Exemplos:
<SELECT NAME="CORES">
<OPTION
VALEU="AZUL">Azul</OPTIO
N>
<OPTION
VALEU="VERMELHO">Vermel
ho</OPTION>
<OPTION
VALEU="AMARELO">Amarelo
</OPTION>
</SELECT>

NAME: atributo obrigatrio


para a identificao da lista;
OPTION: cria cada item da

BANCO DE DADOS

Banco de Dados
Banco de Dados: uma coleo de
dados inter-relacionados, representando informaes sobre um domnio
especfico.
Exemplos: lista telefnica, controle
do acervo de uma biblioteca, sistema
de controle dos recursos humanos de
uma empresa.
Sistema de Gerenciamento de
Bancos de Dados (SGBD): um
software com recursos especficos
para facilitar a manipulao das
infor-

maes dos bancos de dados e o


desenvolvimento
de
programas
aplicativos.
Exemplos: Oracle, SqlServer, MySql,
FireBird, PosterGre.

Banco de Dados
Tabelas: Os bancos de dados relacionais so compostos de relaes, mais
comumente chamadas de tabelas. Uma tabela exatamente o que o nome
sugere - uma tabela de dados. Se alguma vez utilizou uma planilha eletrnico, j
utilizou uma tabela relacional.
Toda tabela composta por colunas, cada uma correspondendo a um fragmento
diferente de dados e linhas que correspondem a registros individuais.
Colunas/campo: Cada coluna na tabela tem um nome nico e contm dados
diferentes. Cada coluna tem um tipo de dados associados. As colunas so
comumente chamadas de campos ou atributos.
Linhas/registro: Cada linha em uma tabela representa um registro diferente. Por
causa do formato tabular, todas elas tm os mesmos atributos. As linhas tambm
so comumente chamadas de registros ou tuplas.
Valores: Cada linha consiste em um conjunto de valores individuais que
correspondem a colunas. Cada valor deve ter o tipo de dados especificado pela
sua coluna.
Chave: A coluna de identificao em uma tabela chamada de chave ou chave

Banco de Dados
Normalmente os bancos de dados consistem em mltiplas tabelas e utilizam uma
chave como uma referncia de uma tabela para outra. O termo de banco de
dados relacional para esse relacionamento chave estrangeira. O identificador
de uma tabela, quando aparece em outra tabela, referido como uma chave
estrangeira.
Exemplo:

Tabela
Coluna/Campo

Linha/Regitro

Valores

Cod_i Nome
d

telefone

Silvio Fernandes

(79)
99999999

Patrcia Elizabeth

(79)
88888888

Anthony

(79)

Banco de Dados FireBird


O Firebird um poderoso banco de
dados Cliente/Servidor relacional que
compatvel com SQL-ANSI-92, e
foi desenvolvido para ser um banco
de dados independente de plataformas
e de sistemas operacionais. Este
banco de dados, dispensa maiores
estruturas dentro da empresa, (DBA /
Preparao), onde basta instalar o
software e usar-lo, sem a interferncia
freqente
de
profissionais,
especializados na manuteno do
banco de dados de produo.
Onde usaremos o FireBird para criar
nosso banco de dados que iremos
cadastrar os comprimissos.

Sabendo-se que na linguagem SQL so


usados cinco comando principais, so
eles:
create
insert into
update
delete from
select

Comandos em SQL
Create: Serve para criar tabela no banco de dados.
Ex: create table tabela (
cod_id int not null,

Nome
Tipo
No permite ser nulo

nome varchar(40) not null,


telefone varchar(14),
primary key (cod_id)
);

Insert into: Serve para adicionar(incluir) dados na tabela.


Ex: insert into tabela(cod_id,nome,telefone) Values (1, Silvio Fernandes, (79)
99999999)
Update: Serve para alterar(mudar) dados na tabela.

Ex: update tabela set nome=Andre Silva where cod_id=1

Comandos em SQL
Delete from: Serve para excluir(apagar) dados na tabela.
Ex: delete from tabela (para apagar todos os registro da tabela)
detete from tabela where cod_id = 1 (para apagar somente o registro que o cdigo
for igual a 1)
Select: Serve para selecionar(mostrar) dados na tabela.

Ex: select * from tabela (mostrar todos os dados da tabela inteira)


select * from tabela where cod_id=1 (mostrar os dados da tabela que o
cdigo for igual a 1)
Com isso, vamos criar agora o nosso banco de dados chamado db_dados, com
uma tabela chamada dad_dados no MySql Query Browser. Sabendo que a tabela
seguir a estrutura a baixo.

Tabela dos Dados de Compromisso

Generation e Triges do Fire Bird


Para tornar um campo da tabela do
tipo
Auto-Emcremente,
ser
necessrio criar um generation e uma
trige no Firebird. Como exemplo a
baixo:

OBRIGADO PELA
ATENO !!!

Você também pode gostar