O RESPONSIVE é a nossa implementação de um canal de comunicação institucional para o Desburocratize, uma iniciativa da Coordenadoria Geral da Universidade (CGU-UNICAMP) que busca “levantar, investigar, integrar e propor soluções criativas para as disfunções burocráticas que geram a ineficiência” na administração da universidade. O sistema foi concebido como uma central flexível e reaproveitável de submissão, gerenciamento e acompanhamento de solicitações, muito similar aos mecanismos de abertura e acompanhamento de tickets encontrado em ferramentas como JIRA e Zendesk. O funcionamento básico do sistema consiste na abertura de solicitações usando formulários que podem ser criados arbitrariamente usando o criador embutido no RESPONSIVE. Estas solicitações são então atribuídas a atendentes que passam a usar o sistema como um canal de comunicação com o solicitante. Solicitações podem ser respondidas, re-atribuídas a novos atendentes, e idealmente fechadas ou marcadas como solucionadas.
A interação entre atendentes e solicitantes é mediada por gerentes e administradores que, além de distribuir solicitações entre os atendentes, também atuam na criação e manutenção dos diversos formulários que podem servir como template para diferentes tipos de solicitação. Juntos, atendentes, solicitantes, gerentes e administradores foram o conjunto básico de perfis de acesso da ferramenta. Este conceito fundamental norteou toda a arquitetura da implementação, pois toda feature, ação e possibilidade oferecida pelo RESPONSIVE precisa antes ser filtrada com base no perfil de acesso do usuário que acessa a ferramenta em determinado momento.
Para facilitar o desenvolvimento do projeto em grupo utilizamos imagens conteinerizadas das dependências. Para isso utilizamos o Docker e o Docker-Compose, criando uma "receita" para subir o servidor. Essa receita sobe 3 containers diferentes, atrelando-os a mesma network.
Esses containers são:
Caso não tenha instalado, instale o NodeJS, Docker e o Docker-Compose localmente:
Para subir um ambiente local, basta executar os seguintes comandos na pasta "backend":
npm install
npm run docker:build
(somente na primeira vez que executar o projeto)npm run docker:start
Para parar o servidor basta executar:
npm run docker:stop
Para destruir os containers e volumes, zerando toda a aplicação, execute:
npm run docker:down
Para rodar as migrações (não obrigatório, elas são executadas toda vez que o servidor sobe):
npm run docker:knex:migrations:run
Para rodar as importações de dados iniciais (seeds), execute:
npm run docker:knex:seed:run
Para desenvolver no frontend bastar ter NodeJS e Npm instalado localmente, e, então instalar as dependências e iniciar o servidor local, através dos comandos a seguir na pasta "frontend":
npm install
npm start
O app poderá ser acessado via http://localhost:4200.
Optamos por programar o backend em NodeJS, já que é uma ferramenta que todos os integrantes conhecem, e, para ajudar, utilizamos TypeScript, que permite uma escrita de código mais descritiva e contida.
Nosso backend opera como um serviço e fornece uma API para os clientes, podendo ser inicializado em qualquer máquina rodando PostgreSQL e NodeJS, porém, para facilitar o desenvolvimento e deploys, desenvolvemos uma imagem para o Docker com todos os pré-requisitos.
O código foi organizado separando as diferentes entidades do sistema, para isso adotamos a seguinte estrutura:
A aplicação web foi desenvolvida em Angular 10, também utilizando Typescript, e, para acelerar o desenvolvimento, utilizamos uma biblioteca de UI e estilização chamada Material UI, desenvolvida pelo Google. Essa biblioteca forneceu uma grande quantidade de componentes prontos, garantindo a agilidade do desenvolvimento e um design padronizado e elegante.
Dividimos a aplicação em módulos, sendo cada módulo responsável por uma "entidade" do projeto, por exemplo, temos um módulo responsável pelos formulários, que cuida tanto do serviço de consumo da API para obter os formulários existentes no backend, quanto das telas atreladas a eles (listagem, criação/edição, etc).