Skip to main content

Front-End

Stack Tecnológica

Linguagem

JavaScript (ES6+) – Utilizado pela flexibilidade e compatibilidade com frameworks modernos.

Framework/Lib

Figma – Escolhido devido à sua capacidade de criar interfaces de usuário dinâmicas, eficientes e reutilizáveis por meio de componentes.

Biblioteca do Estilo

Material UI (ou outra como Bootstrap) – Facilita a criação de uma interface amigável e responsiva, além de proporcionar consistência visual.

Ferramentas de Build

Webpack ou Vite – Para compilar o código e otimizar a performance da aplicação.

Gestão de Rotas

React Router – Utilizado para navegar entre diferentes telas da aplicação, como a tela do totem, a tela de visualização da TV e a tela de gerenciamento de atendimentos.

Integração com a API

Axios

Para realizar as chamadas HTTP, foi utilizada a biblioteca Axios, que facilita a comunicação com a API do backend (Django Rest Framework). As requisições são feitas para endpoints que fornecem e atualizam dados sobre as senhas e atendimentos em tempo real.

Comunicação em Tempo Real com WebSocket

WebSocket

O WebSocket é usado para atualizações em tempo real, permitindo que o frontend receba e exiba dados atualizados instantaneamente. Isso é essencial para a sincronização entre as telas do Totem, Sistema e TV.