Introdução à Programação Web
introdução a programação web

Introdução à Programação Web

Seja bem vindo a aula de introdução do curso de programação Web!
Neste curso você irá aprender os conceitos básicos da programação para web e algumas técnicas desenvolvidas para facilitar a sua vida no desenvolvimento web. 
 
Nesta aula iremos mostrar alguns conceitos muito básicos que você provavelmente já teve contato, porém, nunca se atentou a sua importância. Iremos explorar um pouco do que é o protocolo HTTP, quais são seus métodos principais. Além disso, iremos explorar um pouco da teoria por trás da arquitetura cliente e servidor. Exploraremos ainda algumas ferramentas feitas para desenvolvedores dentro dos navegadores e acompanhar requisições.
 
 

O que é o protocolo HTTP?

Dentro do contexto de introdução a Programação web, não poderiamos falar desse protocolo.  O HTTP é uma sigla de HyperText Transfer Protocol que em português significa “Protocolo de Transferência de Hipertexto”. É um protocolo de comunicação entre sistemas de informação que permite a transferência de dados entre redes de computadores, principalmente na World Wide Web (Internet).
 
O HTTP é o protocolo utilizado para transferência de páginas HTML do computador para a Internet. Por isso, os endereços dos websites (URL) utilizam no início a expressão “http://”, definindo o protocolo usado. Esta informação é necessária para estabelecer a comunicação entre a URL e o servidor Web que armazena os dados, enviando então a página HTML solicitada pelo usuário.
 
Para que a transferência de dados na Internet seja realizada, o protocolo HTTP necessita estar agregado a outros dois protocolos de rede: TCP (Transmission Control Protocol) e IP (Internet Protocol). Esses dois últimos protocolos formam o modelo TCP/IP, necessário para a conexão entre computadores clientes-servidores.
 

Métodos HTTP mais utilizados

 
O protocolo disponibiliza aos usuários alguns métodos que dão uma “dica” ao servidor qual a intenção do usuário com aquela requisição. Na versão 1.1 do HTTP existem 9 verbos disponíveis para serem utilizados. É importante que o desenvolvedor compreenda qual a semântica da utilização destes métodos para que sejam utilizados corretamente.
 
GET
Essa é a requisição mais comum de todas. Através dessa requisição nós pedimos a representação de um recurso: que pode ser um arquivo html, xml, json, etc. 
Um exemlo de requisição GET seria:
 
POST
O método POST é utilizado quando queremos criar um recurso. Quando usamos POST, os dados vão no corpo da requisição e não na URI.
 
PUT
Requisita que um recurso seja “guardado” na URI fornecida. Se o recurso já existir, ele deve ser atualizado. Se não existir, pode ser criado.
 
DELETE
Exclui o recurso especificado.
 
TRACE
Devolve a mesma requisição que for enviada veja se houve mudança e/ou adições feitas por servidores intermediários.
 
OPTIONS
Retorna os métodos HTTP suportados pelo servidor para a URL especificada.
 
PATCH
Serve para atualizar partes de um recurso, e não o recurso todo.
 
CONNECT
Converte a requisição de conexão para um túnel TCP/IP transparente, geralmente para facilitar a comunicação criptografada com SSL (HTTPS) através de um proxy HTTP não criptografado.
 
HEAD
Retorna somente os cabeçalhos de uma resposta.
 

A arquitetura cliente-servidor

 
A característica do modelo cliente-servidor, descreve a relação de programas numa aplicação. O componente de servidor fornece uma função ou serviço a um ou mais clientes, que iniciam os pedidos de serviço.
 
Funcionalidades como a troca de e-mail, acesso à internet ou acesso a um banco de dados, são construídos com base no modelo cliente-servidor. Por exemplo, um navegador web é um programa cliente, em execução no computador do usuário, que acede às informações armazenadas num servidor web na internet. Usuários de serviços bancários, acedendo do seu computador, usam um cliente web para enviar uma solicitação para um servidor web num banco. Esse programa pode, por sua vez, encaminhar o pedido para o seu próprio programa de banco de dados do cliente que envia uma solicitação para um servidor de banco de dados noutro computador do banco para recuperar as informações da conta. O saldo é devolvido ao cliente de banco de dados do banco, que por sua vez, serve de volta ao cliente navegador exibindo os resultados para o usuário.
 
O modelo cliente-servidor, tornou-se uma das ideias centrais de computação de rede. Muitos aplicativos de negócios, escritos hoje, utilizam o modelo cliente-servidor. O termo também tem sido utilizado para distinguir a computação distribuída por computadores dispersos da “computação” monolítica centralizada em mainframe.
 
Cada instância de software do cliente pode enviar requisições a vários servidores. Por sua vez, os servidores podem aceitar esses pedidos, processá-los e retornar as informações solicitadas para o cliente. Embora este conceito possa ser aplicado por uma variedade de razões e para diversos tipos de aplicações, a arquitetura permanece fundamentalmente a mesma.
 

Tipos ou Modelos de Client/Server

 
Após vários modelos estudados de cliente-servidor caracterizou-se chamar tecnicamente de arquitetura multicamada, inspirado nas camadas no Modelo OSI, o processo de dividir a arquitetura de cliente-servidor em várias camadas lógicas facilitando o processo de programação distribuída, existe desde o modelo mais simples de duas camadas, e o mais utilizado atualmente que é o modelo de três camadas que é paralelo ao modelo de arquitetura de software denominado MVC (Model-view-controller).
 

Características do Cliente

  • Inicia pedidos para servidores;
  • Espera por respostas;
  • Recebe respostas;
  • Conecta-se a um pequeno número de servidores de uma só vez ;
  • Normalmente interage diretamente com os servidores através de seu software aplicação especifico, que lhe possibilita a comunicação com o servidor;
  • Utiliza recursos da rede .

Características do Servidor

  • Sempre espera por um pedido de um cliente;
  • Atende os pedidos e, em seguida, responde aos clientes com os dados solicitados;
  • Podem se conectar com outros servidores para atender uma solicitação específica do cliente; jamais podem se comunicar.
  • Fornece recursos de rede.
  • Normalmente interage diretamente com os usuários finais através de qualquer interface com o usuário;
  • Estrutura o sistema.
 

Vantagem

  • Na maioria dos casos, a arquitetura cliente-servidor permite que os papéis e responsabilidades de um sistema de computação possam ser distribuídos entre vários computadores independentes que são conhecidos por si só através de uma rede. Isso cria uma vantagem adicional para essa arquitetura: maior facilidade de manutenção. Por exemplo, é possível substituir, reparar, atualizar ou mesmo realocar um servidor de seus clientes, enquanto continuam a ser a consciência e não afetado por essa mudança;
  • Todos os dados são armazenados nos servidores, que geralmente possuem controles de segurança muito maiores do que a maioria dos clientes. Os servidores podem controlar melhor o acesso a recursos, para garantir que apenas os clientes com credenciais válidas possam aceder e alterar os dados;
  • Como o armazenamento de dados é centralizado, as atualizações dos dados são muito mais fáceis de administrar em comparação com o paradigma P2P. Em uma arquitetura P2P, atualizações de dados podem precisar ser distribuídas e aplicadas a cada nó na rede, o que consome tempo e é passível de erro, já que pode haver milhares ou mesmo milhões de nós;
  • Muitas tecnologias avançadas de cliente-servidor estão disponíveis e foram projetadas para garantir a segurança, facilidade de interface do usuário e facilidade de uso;
  • Funciona com vários clientes diferentes de capacidades diferentes.
 

Desvantagens

  • Clientes podem solicitar serviços, mas não podem oferecê-los para outros clientes, sobrecarregando o servidor, pois quanto mais clientes, mais informações que irão demandar mais banda.
  • Um servidor poderá ficar sobrecarregado caso receba mais solicitações simultâneas dos clientes do que pode suportar;
  • Este modelo não possui a robustez de uma rede baseada em P2P. Na arquitetura cliente-servidor, se um servidor crítico falha, os pedidos dos clientes não poderão ser cumpridos. Já nas redes P2P, os recursos são normalmente distribuídos entre vários nós. Mesmo se uma ou mais máquinas falharem no momento de download de um arquivo, por exemplo, as demais ainda terão os dados necessários para completar a referida operação.
 

5- O que são cabeçalhos, cookies e como visualiza-los

Para identificar uma requisição feita os navegadores criam uma estrutura de texto chamada de “cabeçalho”. O cabeçalho é enviado em todas as requisições para o servidor para que seja possível receber uma resposta adequada. Veja um exemplo:
Request URL: https://www.globo.com/

Request Method: GET

Status Code: 200 

Remote Address: 186.192.81.5:443

Referrer Policy: no-referrer-when-downgrade
 
 

O que é um Cookie?

Basicamente, um Cookie é um arquivo de texto muito simples, cuja composição depende diretamente do conteúdo do endereço Web visitado. Por exemplo, a maioria do sites armazenam informações básica, como endereços IP e preferências sobre idiomas, cores, etc. Contudo, em portais como o Gmail e o Hotmail, nomes de usuários e senhas de email também fazem parte dos Cookies.

Como funciona o Cookie?

Quando você visita um site pela primeira vez, este envia um Cookie como resposta para o seu navegador, contendo as suas preferências, em formato de texto. Este pequeno arquivo ficará armazenado em seu computador até que perca sua validade.
Enquanto o cookie estiver salvo em seu PC, toda vez que você digitar o endereço do site, o seu navegador irá enviar este arquivo para o site que você está conectado. Desta maneira, as suas configurações serão aplicadas de maneira automática.

Como visualizar estas informações no seu navegador?

Na maioria dos navegadores você encontra uma opção avançada de navegação nos códigos fonte de uma página. Se você utiliza o Google chrome, por exemplo, apenas apertando a tecla F12, uma janela adicional será aberta:
tela de ferramentas do desenvolvedor navegador
Observe que nessa janela você encontra várias abas. Em cada uma delas existem ferramentas muito legais para visualizar algumas características da página e da requisição feita.
visualização dos cabeçalhos de uma requisição
Você pode por exemplo clicar na aba NETWORK você poderá acompanhar todo trafego dentro do seu navegador. Ao clicar em uma das requisições você encontra os cabeçalhos e outras informações interessantes sobre as requisições.

Vinicius dos Santos

Apenas um apaixonado por Ciência da Computação e forma com que ela pode transformar vidas!

Deixe uma resposta