Neste material, vamos revisar os principais conceitos sobre a Internet e o Protocolo HTTP
A Internet é uma rede global de computadores. Imagine um sistema postal que entrega e que recebe pacotes em velocidades extremamente rápidas.
Este sistema utiliza os Protocolos TCP/IP e HTTP para se comunicar. Qualquer indivíduo com permissão é capaz de obter informações de outro computador.
Um protocolo é um sistema de regras que define como o dado é trafegado dentro ou entre computadores. Comunicações entre dispositivos requer que estes concordem com o formato do dado que estiver sendo trafegado. O conjunto de regras que define esse formato é chamado de protocolo.
O TCP/IP é um conjunto de protocolos de comunicação. O nome vem de dois protocolos TCP (Transmission Control Protocol) e o IP (Internet Protocol). Ele tem por objetivo padronizar todas as comunicações de rede, principalmente as comunicações na web. O conjunto de protocolos TCP/IP é o padrão que define a comunicação na Internet.
O Modelo TCP/IP
O modelo TCP/IP possui 4 camadas:
Nesta camada encontra-se todos os protocolos de serviço que efetuam a comunicação direta com o software para identificar o tipo de requisição que está sendo realizada. O protocolo mais popular é o HTTP.
Esta camada é Responsável pela comunicação entre hosts (Clientes e Servidores) envolvidos. Ela tem como função principal verificar se o pacote de dados alcançou seu destino e se os dados nele contidos chegaram de maneira integra. O protocolo mais popular é o TCP.
Pacote é o formato no qual os dados são enviados do servidor para o cliente e vice-versa. Basicamente, quando os dados são enviados pela web, eles são enviados como milhares de pequenos blocos, para agilizar e simplificar o tráfico de dados pela Internet.
Em azul temos o grande bloco de dados e logo abaixo, na cor amarela, o bloco dividido em pacotes menores que serão identificados e enviados para o seu destino
A camada de transporte utiliza portas lógicas para garantir que a aplicação que iniciou a conversação encontrará no seu destino a aplicação desejada. Essas portas lógicas são canais virtuais, geralmente definidos pelo Sistema Operacional, que se abrem conforme o tipo de aplicação que se está executando. O HTTP utiliza por padrão a porta 80, enquanto o HTTPS utiliza a porta 443. A porta 8080 é frequentemente usada em ambientes locais ou de teste como alternativa à porta padrão.
No Exemplo acima, o pacote que chegou na Camada de Aplicação contém a informação Porta: 8080. Observe que neste cenário o Spring está utilizando a porta 8080, logo o TCP irá redirecionar o pacote para a nossa aplicação Spring. Se a Porta, por exemplo, estivesse com o valor 3306 o TCP redirecionaria para o MySQL.
Nesta camada encontramos os endereços IP de origem e destino de uma conexão. O IP também é conhecido como o endereço lógico (pode ser alterado).
Nesta camada encontramos a conexão física da rede pela qual o pacote trafega. Cada equipamento conectado na rede carrega consigo a identidade do hardware que deu origem ao envio do pacote, armazenando o seu endereço MAC (Media Access Control). O MAC também é conhecido como Endereço físico (não pode ser alterado).
Como funciona o Protocolo TCP/IP?
O HTTP (Hypertext Transfer Protocol / Protocolo de Transferência de Hipertexto) é um protocolo que permite a obtenção de recursos, como documentos HTML. É a base de qualquer troca de dados na Web e um protocolo cliente-servidor, o que significa que as requisições são iniciadas pelo destinatário, geralmente um navegador da Web. Um documento completo é reconstruído a partir dos diferentes sub documentos obtidos, como por exemplo texto, descrição do layout, imagens, vídeos, scripts e muito mais.
Página WEB composta por vários elementos
O HTTP também possui uma outra versão chamada de HTTPS ( Hyper Text Transfer Protocol Secure / Protocolo de Transferência de Hipertexto Seguro), que se trata de uma versão segura do protocolo HTTP, que utiliza criptografia (TLS/SSL) para proteger os dados transmitidos. Atualmente, é o padrão recomendado para qualquer site, especialmente aqueles que lidam com dados sensíveis. Ao utilizar o protocolo HTTPS, um cadeado 
Os Clientes acessando o servidor via Internet
O Cliente é qualquer ferramenta que age em nome do usuário. Essa função é predominantemente realizada pelo navegador Web, salvo algumas poucas exceções, são programas usados por pessoas Desenvolvedoras Web para testar as suas aplicações (Exemplo: Insomnia).
O servidor é a "máquina" que serve o documento requisitado pelo usuário através do endereço www. Um servidor se apresenta virtualmente apenas como uma máquina, porém ele pode ser uma coleção de servidores dividindo a carga ou um programa complexo que acessa outros servidores gerando toda ou parte do documento solicitado.
O HTTP funciona como um protocolo Request-Response (Solicitação-Resposta), entre um Cliente e um Servidor.
Fluxo de Funcionamento HTTP
Exemplo: Um cliente (Navegador da Internet) envia uma Request HTTP ao servidor e o servidor retorna uma Response ao cliente.
Para o cliente se comunicar com um servidor, ele realiza os seguintes passos:
- Abre uma conexão TCP, que será usada para enviar uma requisição, ou várias, e receber uma resposta.
- Envia uma mensagem HTTP (Request).
- Lê a resposta do servidor (Response).
- Fecha ou reutiliza a conexão para requisições futuras.
Request Message Header HTTP
As requisições consistem dos seguintes elementos:
- Um Método HTTP, geralmente é um verbo como GET, POST, DELETE e PUT.
- O caminho do recurso (Path), ou seja a URL do recurso sem os elementos que são de contexto, como o protocolo (http://).
- versão do protocolo HTTP.
- Cabeçalhos opcionais que contém informações adicionais para os servidores.
- Body (corpo) para alguns Métodos como o POST e o PUT, que enviam dados para o recurso solicitado dentro da requisição.
Request HTTP
O protocolo HTTP define um conjunto de Métodos de requisição responsáveis por indicar a ação a ser executada para um dado recurso. Estes Métodos são referenciados como Verbos HTTP.
Principais Verbos HTTP
| Verbo | Descrição |
| GET | O Método GET solicita a representação de um recurso específico. Requisições utilizando o Método GET devem retornar apenas dados. Exemplo: Consultar um registro no Banco de Dados. |
| POST | O Método POST é utilizado para submeter uma entidade a um recurso específico para o servidor. Exemplo: Inserir um novo registro no Banco de Dados. |
| PUT | O Método PUT substitui todas as atuais representações do recurso de destino pela carga de dados da requisição. Exemplo: Atualizar os Atributos de um registro no Banco de Dados. |
| DELETE | O Método DELETE remove um recurso específico. Exemplo: Apagar um registro no Banco de Dados. |
Quando acessamos um determinado site a partir do nosso computador, informamos para o navegador o endereço do site, também conhecido como URL (Uniform Resource Locator). O Navegador da Internet se encarrega de descobrir qual o endereço do servidor que armazena o site.
A comunicação com uma aplicação WEB é realizada através de URL's, que são enviadas por meio das requisições e contêm principalmente o caminho do recurso (também chamados de endpoints) e os parâmetros.
Uma URL é composta por diferentes partes, como o protocolo (http ou https), o domínio (nome do servidor), o caminho (path) do recurso e, opcionalmente, os parâmetros de consulta (query parameters), que são usados para enviar dados adicionais, como filtros e identificadores. Veja os Exemplos abaixo:
Requisição Local (seu computador)
Requisição Remota (servidor na Nuvem)
| Item | Descrição |
|---|---|
| Protocolo | Informa ao navegador qual o protocolo de comunicação do endereço (http ou https). Observe que na nuvem (Heroku), utiliza-se o protocolo https, enquanto localmente utiliza-se o protocolo http. |
| Domínio | É o nome (identificador) do site. Este item é Obrigatório. Observe que localmente o seu computador é identificado como localhost, enquanto na Nuvem o endereço vai depender do nome da sua aplicação. |
| Porta | Identifica a porta em que o site está disponível no servidor. Quando não é informada o Navegador preenche internamente com a porta padrão de acordo com o protocolo utilizado. Observe que localmente, a porta deve ser informada e porta padrão do Servidor WEB local é a 8080, enquanto na Nuvem, mesmo sem informar o numero da porta, por se tratar do protocolo https utiliza-se a porta 443. |
| Recurso | Identifica qual o recurso o navegador vai buscar no servidor, quando não é informado pelo usuário o próprio navegador preenche com uma "/", que significa página inicial do site. No contexto de uma aplicação WEB, um recurso é um CRUD (Create, Read, Update e Delete) completo de uma tabela no Banco de dados, desenvolvido em uma Linguagem Backend. No exemplo acima, localmente está sendo procurado o recurso Postagens enquanto na Nuvem está sendo procurado o recurso Temas. |
| Parâmetros | Utilizado para enviar dados para a aplicação através da URL. No exemplo Local, 12345 é o valor do id (identificador único) de uma Postagem que está sendo procurada. No exemplo na Nuvem, java é a palavra que está sendo procurada no campo (Atributo) descricao, de um Tema. |
 |
ATENÇÃO: Na requisição HTTP, o campo Path representa apenas o caminho do recurso (por exemplo: /postagens/12345). O navegador envia apenas esse caminho, e não o endereço completo com domínio e protocolo. |
|---|
|
IMPORTANTE: Os conceitos apresentados na formação da URL, em especial Recurso e Parâmetros serão estudados com mais detalhes no decorrer do Bloco 02. O mais importante neste momento é compreender quais são as partes que compõem a URL. |
|---|
A Response (resposta) é a resposta que o servidor envia ao cliente depois de processar a Requisição. Essa resposta pode conter os dados que realmente o cliente esperava receber ou uma resposta informando que alguma coisa deu errado.
Response HTTP
O protocolo HTTP também define um conjunto de Códigos de Status de respostas responsáveis por indicar se a ação executada para um dado recurso foi executada corretamente ou não. Estes Métodos são comumente referenciados como HTTP Status Code. As respostas são agrupadas em cinco Classes:
- Respostas de informação (
100-199), - Respostas de sucesso (
200-299), - Redirecionamentos (
300-399) - Erros do cliente (
400-499) - Erros do servidor (
500-599).
| Código | Resposta | Descrição |
| 200 | OK | Estas requisição foi bem sucedida. O significado do sucesso varia de acordo com o Método HTTP. |
| 201 | CREATED | A requisição foi bem sucedida e um novo recurso foi criado como resultado. Esta é uma típica resposta enviada após uma requisição POST. |
| 204 | NO CONTENT | Não há conteúdo para enviar para esta solicitação, mas os cabeçalhos podem ser úteis. O user-agent pode atualizar seus cabeçalhos em cache para este recurso com os novos. Essa resposta é muito comum após uma Requisição DELETE. |
| Código | Resposta | Descrição |
| 400 | BAD REQUEST | Essa resposta significa que o servidor não entendeu a requisição pois está com uma sintaxe inválida. |
| 401 | UNAUTHORIZED | Embora o padrão HTTP especifique "unauthorized", semanticamente, essa resposta significa "unauthenticated". Ou seja, o cliente deve se autenticar para obter a resposta solicitada. Esta resposta é muito comum quando habilitamos a Segurança na API (Login, Senha e Token). |
| 403 | FORBIDDEN | O cliente não tem direitos de acesso ao conteúdo portanto o servidor está rejeitando dar a resposta. Diferente do código 401, aqui a identidade do cliente é conhecida. |
| 404 | NOT FOUND | O servidor não pode encontrar o recurso solicitado. Este código de resposta acontece com frequência na web. |
| 405 | METHOD NOT ALLOWED | O método HTTP utilizado não é permitido para o recurso solicitado. Por exemplo, uma tentativa de usar DELETE em um endpoint que só aceita GET. |
| Código | Resposta | Descrição |
| 500 | INTERNAL SERVER ERROR | O servidor encontrou uma situação com a qual não sabe lidar. |
| 501 | NOT IMPLEMETED | O servidor não reconhece o método da requisição ou não tem suporte para ele. Essa resposta é comum quando se tenta utilizar métodos ainda não implementados no servidor. |
| 502 | BAD GATEWAY | O servidor, ao trabalhar como um gateway a fim de obter uma resposta necessária para manipular a requisição, obteve uma resposta inválida. |
| 503 | SERVICE UNAVAILABLE | O servidor não está pronto para a requisição. Causas comuns são um servidor em manutenção ou sobrecarregado. |
Um Web Site é uma coleção de páginas da web e conteúdo relacionado que é identificado por um nome de domínio comum e publicado em pelo menos um servidor da web. Sites podem ser estáticos, quando exibem conteúdos fixos escritos diretamente em HTML/CSS, ou dinâmicos, quando usam uma lógica de programação para gerar o conteúdo conforme a interação do usuário.
Um aplicativo da web é um software que é executado em um servidor web e acessado por meio de um navegador, diferentemente dos programas tradicionais que são instalados e executados localmente no sistema operacional do dispositivo do usuário.
Apesar de mais abstrato, o conceito de Back-end também é simples de entender: os dados publicados em uma rede social, como fotos e vídeos, por meio da interface do usuário precisam ser armazenados em algum local para poderem ser acessados posteriormente.
Esse envio não é feito diretamente do front-end para o banco de dados da rede social. Ao invés disso, existe uma parte da aplicação que é responsável por receber essas informações, fazer operações específicas — postagens, filtros, exclusões, verificações de segurança e validações e somente após isso, armazenar no banco de dados. Esse é o back-end.
As atribuições de um desenvolvedor back-end não incluem a criação de páginas bonitas ou responsivas, como acontece com profissionais front-end. Em vez disso, eles são responsáveis por implementar arquiteturas robustas, que se comuniquem com o banco de dados (MySQL) e que garantam a segurança dos dados enviados pelo usuário. Para isso utiliza linguagens como o Java e o Framework Spring.
O Front-end é, de forma sucinta, toda parte visual de um site, a parte com a qual o usuário interage diretamente. O profissional responsável por trabalhar nessa área de um projeto desenvolve o código para a interface gráfica, normalmente por meio de linguagens.
Um desenvolvedor front-end normalmente trabalha criando toda a parte visual dos sites por meio de linguagens de marcação(HTML), estilização (CSS) e programação (JavaScript e TypeScript), além de bibliotecas (Bootstrap e React) e frameworks como o Angular.
No exemplo acima, temos uma visão geral da integração entre o Front-end e do Back-end da aplicação.
Full Stack está relacionado a pessoa desenvolvedora. Espera-se de uma pessoa desenvolvedora Full Stack que ela seja capacitada para lidar, ao mesmo tempo, com o Front-end e o Back-end de uma aplicação, mesmo que os dois lados utilizem tecnologias e linguagens diferentes.
