Aplicativo aula03

Aula 003

Aplicativos

PRONATEC

Programa Nacional de Acesso ao

Ensino Técnico e Emprego

PRONATEC

Programa Nacional de Acesso

ao Ensino Técnico e Emprego

1. PROGRAMAÇÃO• Programar em informática é criar processos que o computador

executará com a finalidade de gerar os resultados esperados pelo usuário que pediu a construção desse mesmo software

• Essa criação deve partir baseando-se em um projeto de análise prévio, feito por um Analista/Projetista.

• Com o modelo Lógico e Físico em mãos o programador parte para a criação dos módulos que somados comporão o sofware

• Os módulos podem ser criados usando diversos compiladores e linkeditores diferentes dependendo da necessidade do usuário que deve estar bem definida pelo projeto lógico do analista

• Por exemplo se o usuário precisa de um site o compilador poderá ser o Java, ou usar programação com script server side como por exemplo o PHP ou ASP

• Se o usuário não precisa que o sistema fique on line na internet mas somente funcione na sua rede local pode-se optar por um desenvolvimento Client/Sever com Delphi ou Visual Basic

2. PROGRAMAÇÃO - Conceitos• Script: é o mesmo que programa, uma sequência de

comandos para o processador feitos em uma linguagem de programação, geralmente voltadas para a internet ou servidores.

• Client Side: dizemos que um script é client sidequando o computador do usuário, onde ele está estánavegando é quem o executa para produzir resultados no próprio navegador.

• Server Side: é um script rodado somente no servidor e que produz os resultados enviados ao computador cliente. Assim, o computador do cliente fica somente encarregado de mostrar os resultados, o servidor é quem faz o processamento dos dados

3. PROGRAMAÇÃO – Conceitos (cont.)• Quando se trabalha com programação devemos observar sempre dois

lados mais importantes em um sistema: 1) Interface e 2) Banco de Dados• Interface: retrata a parte de contato do sistema com o usuário, ou seja,

são as telas e relatórios que o sistema mostra a quem o utiliza.• Banco de dados: são os dados mantidos pelo sistema a fim de produzir os

resultados (interface) que o usuário necessita para seu trabalho• No nosso curso vamos optar por trabalhar com a programação de um site

usando as seguintes ferramentas - Interface: HTML, Javascript e PHP, Banco de Dados: MySQL

• HTML: sigla de HyperText Markup Language, expressão inglesa que significa "Linguagem de Marcação de Hipertexto“ criada especificamente para a internet

• Javascript: linguagem de script “client side” que juntamente com o HTML faz a maioria dos sites funcionarem hoje em dia.

• PHP: linguagem de script “server side” que produz resultados em HTML e Javascript para serem carregados pelos navegadores no lado cliente

• MySQL: geranciador de banco de dados gratuito da Oracle para pequenos projetos ou sites pessoais como blogs.

4. HTML• Linguagem de programação “client side” para sites da

internet, é constituída de comandos para o navegador seja ele: explorer, google chrome, firefox, ou outros

• Constitui de uma seqüência de comandos em forma de tags que sempre estão entre os símbolos “<>”

• Exemplo: é um comando html que diz para o navegador saltar uma linha em branco

• Textos fora dos símbolos < > são tratados como textos comuns e são mostrados pelo navegador. Agora se estiverem entre os símbolos serão considerados como comandos e não mostrados, mas alguma tarefa será realizada com eles na página.

5. ESTRUTURA DO HTML

• Toda página HTML tem a seguinte estrutura:

• <HTML>

• <head>

• ...

• </head>

• <body>

• ...

• </body>

• </HTML>

6. ESTRUTURA DO HTML (cont.)• Todos programa HTML começa com a tag <HTML> e termina

com seu fechamento </HTML>• Todas as tags tem abertura: < > e fechamento </ >• Dentro da tag HTML temos duas seções principais: head –

cabeçalho e body – corpo que são marcadas respectivamente pelas tags <head></head> e <body></body>

• As reticências são locais onde colocamos os demais comandos para a página funcionar

• O cabeçalho é uma seção opcional, se não quiser usá-la não precisa abrir suas tags

• O corpo é obrigatório, todo html deve ter sua tag <body> aberta e fechada. É nessa seção que vai realmente a página a ser mostrada ao usuário

7. COMANDOS tags HTML• <HR> - não tem fechamento somente abertura e indica ao

navegador para mostrar uma linha horizontal de fora a fora na página

• - não tem fechamento e comanda o navegador a saltar uma linha em branco passando para a próxima linha

• ... - comanda o navegador para configurar o texto com uma fonte determinada

• <a>...</a> - cria um link na página para o texto que aparece entre a abertura e fechamento da tag

• ... - cria um parágrafo de todo o texto dentro da tag.• <div>...</div> - cria uma divisão que é um conjunto de

objetos que poderão ser configurados como um só• <img> - não tem fechamento, inclui uma imagem na página

no ponto onde for colocada

8. Tags HTML• As tags podem ser configuradas por seus

parâmetros, cada tag tem um conjunto de parâmetros associadas a elas e podem ser acessados na abertura da tag

• Exemplo: <img src=“c:\foto.jpg”> - essa tagcolocará na página a imagem localizada no arquivo “c:\foto.jpg” que é o que parâmetro ‘src’ (source) informando ao navegador qual imagem “img” deverá ser usada

• Cada tag tem vários parâmetros e cada parâmetro pode conter ainda vários subconjunto de características específicas para a tag

9. Primeira Página HTML<html>

<head>

<META NAME="Author" CONTENT=“aluno">

</head>

<body>

 <hr>

Olá mundo!

<hr> 

</body>

</html>

10. Explicando o Exemplo Anterior• A página começa e termina com <html>..</html> indicando que o que está

entre elas é um programa em HTML• A tag <head>..</head> contem a seção cabeçalho da página e não é

mostrada no navegado, serve apenas para o processador da página configurar recursos para mostrar a mesma

• A tag <META> não tem fechamento e é usada para variadas informações sobre a página mostrada, nesse caso mostra o autor – parâmetro: NAME=“AUTHOR” e quem é: CONTENT=“Aluno”

• Em HTML o que vem entre “” ou ‘ ’ é considerado um literal e tratado como uma string ou valor dependendo da situação e do parâmetro

• A tag <body>..</body> contem o corpo da página onde fica a parte que será mostrada a quem abre a página no navegador

• O comando faz saltar uma linha começando do topo da página, assim fazemos 5 saltos de linha

• O comando <hr> mostra uma linha horizontal atravessando toda página• A tag .. mostra o texto “Olá mundo!” de cor

vermelha (red) e depois de fechada volta ao normal o texto• <hr> mostra mais uma horizontal e mais um salto de 3 linhas

Aplicativo aula03

Documents

Transcript of Aplicativo aula03