Foto | Nome | Ativo | Atribuições |
---|---|---|---|
![]() |
Enéas Almeida | 🔥 | Manager, Arquiteto, FullStack |
- Socket.io
- Node/Express & NestJs
- JWT para validação da comunicação
- Middleware para barrar uma comunicação inválida
- Criação de uma biblioteca com padrão de projeto observer
- jsonwebtoken ^8.5.1
- socket.io-client ^4.1.2
- socket.io ^0.2.0
- jsonwebtoken ^8.5.1
- platform-express ^9.0.0
- @nestjs/websockets ^9.1.6
- @nestjs/websockets ^9.1.6
- @nestjs/jwt ^9.0.0
- passport-jwt ^4.0.0
git clone https://github.com/venzel/socketio_vuejs_nodejs.git
cd frontend-vue
yarn serve
cd api-node
node index.js
cd api-nest
yarn start:dev
Rode os dois projetos: api e frontend.
Dica: abra 2 navegadores e coloque um ao lado do outro.
No segundo navegador, acesse o frontend: http://localhost:8080 e observe o estado original do objeto:
// Objeto original
users: [
{ id: 100, name: 'Tiago', status: false },
{ id: 200, name: 'Cíntia', status: false },
{ id: 300, name: 'Liz', status: false },
],
Agora, no primeiro navegador, acesse o endpoint da api: http://localhost:3000/users
Observe na tela 2 (dois) do frontend, que o segundo objeto foi alterado: { id: 200, name: 'Cíntia', status: true }
// Objeto modificado no front, quando o endpoint http://localhost:3000/users acessado
users: [
{ id: 100, name: 'Tiago', status: false },
{ id: 200, name: 'Cíntia', status: true },
{ id: 300, name: 'Liz', status: false },
],