LAS CLIENT

• Definição de LAS: (Local Access Service)

Projeto web desenvolvido em React + Vite com linguagem base TypeScript.

Este projeto é o front do LAS e é utilizado para auxiliar na visualização dos sistemas locais instalados por usuário, facilitar a manutenção e consulta de logs, impressões e obter informações da máquina local como dados de sistema e de hardware.

Assim como o backend (LAS-UPDATE-INSTALLER e LAS-PRINTER-INSTALLER) este também é instalado na máquina do cliente, fazendo a integração com o server e executando tudo em ambiente local.

• Link para documentação de dúvidas frequentes e usabilidade do LAS: https://docs.mv.com.br/pages/releaseview.action?pageId=18679778#FAQLAS(LocalAccessService)-las

Índice

• Configuração de Ambiente
  • Clone o Repositório
  • Abra o Projeto
  • Instale os pacotes do Projeto
• Requisitos para Instalação e Execução do Projeto
  • Verificar a versão do Node.js e NPM instalados no ambiente
  • Navegadores Recomendados
• Execução da Aplicação
  • Comandos mais importantes para execução, validação e testes da aplicação
• Deploy da Aplicação
• Estrutura do Projeto
  • Arquivos de Configuração
• Contribuindo

Configuração de Ambiente

1. Clone o Repositório:

   É necessário clonar o projeto na sua máquina. É possível clonar via SSH ou HTTPS, então primeiro você cadastre sua chave SSH no perfil do GitLab. Após cadastrar sua chave SSH, vá para o local que deseja armazenar o projeto, por exemplo, "C:\Projects", e digite o seguinte comando no (GitBash, PowerShell ou prompt CMD default):

   git clone [email protected]:foundation/foundation-components/las-client.git

2. Abra o projeto:

   Após clonar o projeto em sua máquina, tendo a IDE VSCode (Visual Studio Code) instalada, abra a pasta diretamente pela IDE ou vá para a pasta raiz do projeto clonado "las-client" e digite o seguinte commando para que o projeto seja aberto no VSCode, ou :

   code .

3. Instale os pacotes do Projeto:

   Com o projeto aberto, digite (Ctr+") para abrir o powershell integrado do VSCode, então na aba "Terminal" digite:

   npm i

Requisitos para Instalação e Execução do Projeto

➜ Link para download do Node.js + NPM: https://nodejs.org/pt/download/prebuilt-installer

Node.js 20.16.0

NPM (Incluído na instalação do Node)

Verificar a versão do Node.js e NPM instalados no ambiente

node -v

nmp -v

Navegadores Recomendados

• IE 10 ou 11
• Chrome 55+
• Firefox

Execução da Aplicação

Após abrir o projeto na IDE e instalar os pacotes necessários via comando npm i, no terminal PowerShell executar o comando para subir o projeto de acordo com o ambiente desejado:

• Para execução de Desenvolvimento: npm run dev
• Para execução em ambiente de Produção: npm run build

Com o projeto em execução, o VITE disponibiliza uma rota em localhost e mais duas rotas IP network:

➜ Local: http://localhost:5173/

➜ Network: http://10.212.132.81:5173/

➜ Network: http://192.168.1.254:5173/

Comandos mais importantes para execução, validação e testes da aplicação

• npm run build - geração de bundle da infreestrura do projeto (melhora a performace do produto em produção)
• npm run dev - compila os fontes para executar em modo de desenvolvimento
• npm run lint - executa a formatação e validação do código de acordo com as rules definidas
• npm run test - executa os testes unitários
• npm run test:ui - executa os testes unitários e exibe os resultados e status de cobertura no navegador

Deploy da Aplicação

O deploy da aplicação é feito diretamente na máquina do cliente/usuário via remote.

Estrutura do Projeto

Todos os principais métodos acionados pelo front que integram com o server do LAS em localhost "127.0.0.1" estão basicamente em uma única classe, a las-client.ts (../src/client/las-client.ts).

Arquivos de Configuração

• nome do projeto e versão - ./package.json --> atributos "name" e "version"
• configuração de lint - ./eslintrc

Contribuindo

Padrão de Código

É importante manter o padrão de código e seguir os princípios de desenvolvimento [SOLID]. Todo desenvolvedor deve se atentar aos seguintes pontos:

• Todas as classes, métodos, variáveis, comentários, etc... devem ter seu conteúdo/nomenclatura em inglês;
• Evitar code nesting (criar blocos de códigos de vários níveis dentro de uma mesma função, considerando bloco como a abertura e fechamento de chaves), tentar separar em outros métodos ou adaptar o código para evitar que aconteça;
• Criar testes sempre que possível para as implementações e corrigir testes afetados pela demanda realizada;
• Antes de subir e solicitar o merge request, sempre executar os testes e o lint:
• npm run test
• npm run lint