Quando você faz login em um site e consegue navegar por páginas protegidas sem precisar digitar usuário e senha novamente, existe um mecanismo de autenticação trabalhando nos bastidores.

Uma das formas mais utilizadas em aplicações modernas é o JWT (JSON Web Token).

Neste projeto prático, vamos construir um sistema completo de autenticação utilizando Node.js, Express e JavaScript.

Vídeo da aula:

---

O que você vai aprender

Neste projeto vamos desenvolver:

• Login de usuário
• Geração de token JWT
• Middleware de autenticação
• Rotas protegidas
• Validação do token
• Logout
• Expiração automática do token
• Integração entre Front-End e Back-End

As tecnologias utilizadas são:

• JavaScript
• Node.js
• Express
• JWT (JSON Web Token)
• HTML
• CSS
• API REST
• Fetch API

---

O que é JWT?

JWT significa JSON Web Token.

Ele é um token gerado pelo servidor depois que o usuário faz login com sucesso.

Em vez de enviar usuário e senha em todas as requisições, o cliente envia esse token, que funciona como uma credencial temporária.

Assim, o servidor consegue verificar se aquele usuário está autenticado e liberar o acesso às rotas protegidas.

---

Como funciona a autenticação com JWT?

O fluxo básico é o seguinte:

1. O usuário faz login.
2. O servidor verifica usuário e senha.
3. O servidor gera um token JWT.
4. O Front-End recebe esse token.
5. O token é enviado nas próximas requisições.
6. O Back-End valida o token.
7. Se estiver válido, o acesso é liberado.

---

Preparando o Back-End

No projeto utilizamos:

• Express para criar a API.
• jsonwebtoken para gerar e validar os tokens.
• Um arquivo JSON para armazenar os tokens válidos.

Também configuramos:

• Porta 3000.
• Pasta public para os arquivos estáticos.
• Uma chave secreta utilizada na geração do token.

---

Criando funções para salvar e remover tokens

Antes de proteger as rotas, criamos funções para:

• Ler tokens.
• Salvar tokens.
• Remover tokens.

Isso permite controlar quais tokens ainda são válidos.

---

Criando o Middleware de Autenticação

O middleware é responsável por verificar se o token enviado pelo usuário existe e se é válido.

Caso o token não exista ou tenha expirado, o acesso é negado.

Caso esteja correto, a requisição continua normalmente.

Esse é um dos conceitos mais importantes no desenvolvimento de APIs.

---

Criando a rota de Login

Quando o usuário envia login e senha, o servidor:

• Verifica as credenciais.
• Gera um token JWT.
• Define um tempo de expiração.
• Retorna o token para o Front-End.

Esse token será utilizado para acessar as rotas protegidas.

---

Protegendo rotas da API

Criamos uma rota protegida para listar clientes.

Essa rota só pode ser acessada por quem enviar um token válido.

Sem o token, o servidor retorna uma mensagem de erro.

Com o token, os dados são liberados.

---

Integrando Front-End e Back-End

No Front-End utilizamos:

• HTML
• CSS
• JavaScript
• Fetch API

O usuário faz login, recebe o token e depois consegue consultar as rotas protegidas.

Essa comunicação entre Front-End e Back-End é um conceito fundamental para aplicações Full Stack.

---

Implementando o Logout

Também criamos uma rota de logout.

Ao fazer logout, o token é removido e deixa de ser válido.

Assim, o usuário perde o acesso às rotas protegidas.

---

Por que aprender JWT?

JWT é utilizado em diversos tipos de aplicações:

• Sistemas administrativos
• APIs REST
• Aplicações Full Stack
• Sistemas bancários
• Plataformas de cursos
• Redes sociais
• Dashboards e painéis administrativos

Entender JWT é um passo importante para quem deseja trabalhar com desenvolvimento web moderno.

---

Capítulos da Aula

00:00 Introdução ao JWT e estrutura do projeto

02:42 Preparando o backend e gerenciamento de tokens

13:04 Criando o middleware de autenticação JWT

22:43 Implementando a rota de login

27:43 Testando o JWT e protegendo rotas da API

31:13 Criando o frontend de autenticação

39:34 Consumindo rota protegida com Fetch API

45:37 Implementando e corrigindo o logout

---

Assista à Aula Completa

Vídeo:

Live completa:

---

Canal Desvendando o Código

Aprenda JavaScript, Node.js, React, Banco de Dados e Desenvolvimento Web de forma prática, entendendo como a tecnologia funciona por trás dos sistemas reais.