Este projeto é um sistema de autenticação e perfil de usuário desenvolvido como parte de um teste técnico para uma vaga de desenvolvedor na B2BIT. O sistema permite que os usuários façam login, visualizem suas informações pessoais e façam logout. O projeto utiliza diversas tecnologias e práticas recomendadas, incluindo Axios interceptors, testes E2E com Cypress, TypeScript, Tailwind CSS, e aruitetura MVC.

• React: Biblioteca JavaScript para construção de interfaces de usuário.
• TypeScript: Superset do JavaScript que adiciona tipagem estática.
• Axios: Cliente HTTP para fazer requisições ao backend.
• Cypress: Ferramenta para testes E2E.
• Tailwind CSS: Framework de CSS utilitário para estilização.
• React Router: Biblioteca para roteamento em aplicações React.
• Local Storage: Para armazenar tokens de autenticação.
• Deploy: Aplicação foi implantada utilizando Vercel

├── assets/
├── components/
│ ├── Input.tsx
│ ├── LogoutButton.tsx
├── controllers/
│ ├── AuthController.ts
│ ├── UserProfileController.ts
├── routes/
│ ├── AppRouter.tsx
│ ├── ProtectedRoute.tsx
├── types/
│ ├── apiResponses.ts
│ ├── userProfile.ts
├── utils/

│ ├── axiosInterceptors.ts
├── views/
│ ├── SignInPage.tsx
│ ├── UserProfilePage.tsx

O sistema permite que os usuários façam login utilizando o endpoint de autenticação. As credenciais são enviadas para a API, e os tokens recebidos são armazenados no Local Storage. Um interceptor do Axios é utilizado para adicionar o token JWT a todas as requisições subsequentes.

Após o login, o usuário é redirecionado para a página de perfil, onde suas informações pessoais são exibidas. As informações são obtidas da API utilizando o token JWT armazenado.

O botão de logout, localizado no cabeçalho da aplicação, permite que o usuário saia do sistema. Ao clicar no botão, os tokens de autenticação são removidos do Local Storage, e o usuário é redirecionado para a página de login.

Os testes E2E garantem que o fluxo de autenticação funcione conforme o esperado. Os testes incluem:

• Teste de login com credenciais válidas.
• Teste de erro com credenciais inválidas.
• Teste de logout.

Este projeto demonstra a implementação de um sistema de autenticação com React, utilizando TypeScript para tipagem estática, Axios interceptors para manuseio de requisições HTTP, Tailwind CSS para estilização, e Cypress para testes E2E. A aplicação está configurada para ser facilmente implantada em plataformas de hospedagem modernas.