Mobile Forms App - React Native using Expo

Este é um aplicativo do módulo de Formulários que é integrado dentro de outros Apps como Supervisão e Localizador, o mesmo permite acessar os formulários disponíveis assim como respodê-los.

Stack utilizada

Mobile:

• React Native com Typescript
• Styled-Components
• Async-Storage
• Node v16.18.1

Installation

O projeto usa o npm como gerenciador de pacotes, por esse motivo execute o comando abaixo para instalar todas as dependências.

PS.: Lembre-se de conferir a versão do Node antes de executar o mesmo, e caso tenha instalado com uma versão diferente, baste excluir a pasta node_modules e instalar novamente o app.

  npm install

package.json

Sempre que for criar uma nova funcionalidade ou correção de grande impacto será necessário alterar a versão da aplicação no arquivo package.json na tag version, aumentando sempre o ultimo valor, deixando algo semelhante ao exemplo abaixo:

"version": "1.8.5"

.env

Para utilizar o app é necessário configurar o arquivo .env definindo valores para as variáveis a serem utilizadas no Entrypoint.

As variáveis são:

APP=
COMPANY_IDENTIFIER=
LOCATION_IDENTIFIER=
LOCATION_NAME=
MODULE=
STATION_IDENTIFIER=
STATION_NAME=
TOKEN_V2=
TOKEN_V3=
URL_ANSWERS=
URL_DEMANDS=
URL_FORMS=
URL_V2=
USER_IDENTIFIER=
USER_UUID=

.vscode

Configurações extras de formatação do vscode. É interessante ter instalado as extensão Eslint para melhor experiência de desenvolvimento. A configuração já esta pronta então basta utilizar.

Running the App

Para rodar o app é necessário executar o comando abaixo, o mesmo inicializa o projeto, instala o Expo no dispositivo e executa localmente. A execução permite o uso do hot reload, então a cada alteração que fizer é refletido em tempo real no App.

Vale lembrar que é de suma importância utilizar o GitBash para execução de comandos via terminal.

  npm run start:expo

Build/Create Pack

Sempre que for integrar o app de formulários com os apps Supervisão ou Localizador, é necessário seguir o passo a passo abaixo para criar o package corretamente e o mesmo possa ser instalado nos outros apps como pacotes adicionais.

1) Comentar Campos no Arquivo tsconfig.json

"extends": "expo/tsconfig.base"

Na tag include deixe apenas a raíz (src) conforme abaixo, removendo o valor "src/App.tsx".

"include": ["src"],

2) Gera o package .tgz

Para gerar o package execute o comando abaixo em um terminal git bash.

npm pack

O arquivo será gerado na raíz do projeto com nome semelhante à findme-forms-1.8.5.tgz

Apenas como ponto de atenção, verifique se a pasta dist foi criada na raíz do projeto, se ela não for criada o arquivo pode ter gerado com falhas e não vai funcionar quando instalar o mesmo em outro app.