A aplicação se trata de um website que provê um sistema de gestão de loteamentos ao usuário, disponibilizando serviços como criação, leitura, atualização e remoção de lotes. Os lotes são agrupados por quadras, as quais podem ser buscadas por meio de um dos serviços da aplicação.
O projeto se iniciou pela demanda de minha família por um sistema otimizado capaz de tornar nossas operações internas mais eficientes, com possibilidade de serem feitas remotamente de forma segura e zelando pela consistência e organização das informações.
Ferramentas utilizadas
- Front-end:
- Back-end:
- Testes E2E:
- Geral:
Pré-visualização
Iniciando aplicação
⚠️ Docker-compose precisa estar na versão 3.9.
- Abra um terminal e clone o repositório. Mude para a pasta raíz do repositório:
git clone git@github.com:pennaor/zaratan.git
cd ./zaratan
-
Crie um arquivo chamado
.env
na raíz do repositório a partir do template.env.example
. Edite conforme necessidade. -
Execute o comando para build e inicialização dos containers referentes aos serviços da aplicação:
docker-compose -f docker-compose-dev.yml up -d
- Front-end e back-end utilizam bibliotecas que detectam alterações no código-fonte e reexecutam a aplicação.
- São criados volumes para o código-fonte do front-end e back-end, de forma a refletir alterações no código-fonte em tempo real.
⚠️ MySQL deve estar instalado para o funcionamento da API.
- Abra um terminal e clone o repositório. Mude para a pasta back-end e instale as dependências:
git clone git@github.com:pennaor/zaratan.git
cd ./zaratan/back-end
go install
-
Crie um arquivo .env com as variáveis da ambiente exemplificadas no arquivo
.env.example
presente na raíz do diretório/back-end
. -
Utilize o arquivo
dev-db.sql
para criar e popular o banco de dados. O arquivo pode ser encontrado na pasta sql:
./zaratan/sql/dev-db.sql
-
Inicie a API com
go run main.go
. -
Abra outro terminal. Entre na raíz do repositório. Mude para o diretório do front-end e instale as dependências:
cd ./front-end
npm install
-
Crie um arquivo .env com as variáveis da ambiente exemplificadas no arquivo
.env.example
presente na raíz do diretório/front-end
. -
Inicie o front-end com
npm start
. -
Acesse o website pela URL predefinida anteriormente. Utilize as credenciais para fazer o login na aplicação:
Usuário: aluisioordones1@gmail.com
Senha: 123456789
Testes E2E
-
Na raíz do repositório, edite as variáveis de ambiente presentes no arquivo
docker-compose-tests.yml
de acordo com as usadas para os serviços da aplicação. Os testes rodam utilizando a máquina local como referência, e portanto as variáveis definidas em.env
e no arquivodocker-compose-tests.yml
podem ser diferentes. -
Execute os testes com o comando:
docker-compose -f docker-compose-tests.yml up
A variável de ambiente HEADLESS
presente no arquivo docker-compose-tests.yml
controla a execução dos testes utilizando a interface de um browser.
Caso queira acompanhar visualmente os testes, HEADLESS
deve ser false
.
Os testes por rodarem em um container necessitam da ferramenta VcXsrc. A instalação é simples, e assim que executar o programa,
selecione a opção Multiple Windows
, depois na segunda tela Start no client
, e finalmente na terceira tela marque a opção Disabling access control
.
Assim que VcXsrc
estiver rodando, execute o comando de testes. Uma instância do browser será automaticamente aberta e será possível visualizar cada passo feito pelos testes.
- Os testes a serem rodados podem ser determinados preenchendo o campo
command
presentedocker-compose-tests.yml
com os nomes referentes aos testes. - É criado volume para o código-fonte dos testes, de forma que alterações nos arquivos sejam refletidas sem necessidade de refazer a imagem.
- Em um novo terminal, acesse a raíz do repositório, mude para o diretório
./__tests__
e instale as depedências:
cd ./__tests__
npm install
-
Crie um arquivo .env com as variáveis da ambiente exemplificadas no arquivo
.env.example
presente na raíz do diretório./__tests__
. A função de cada variável está explicada no arquivo. -
Execute os testes com
npm test
.
Experiência
Há muito o que ser feito para melhorar a aplicação. Boas e más escolhas foram feitas durante o projeto. Foi desafiador implementar uma API em Golang, linguagem que tenho pouco domínio, e integrá-la ao front-end desenvolvido com React.js e TypeScript. Era uma possibilidade usar Node e Express para a API, o que teria sido mais fácil por causa de minha experiência e pela quantidade de artigos disponíveis sobre a utilização integrada dessas tecnologias. Optei por Golang para aprender mais sobre a linguagem e buscando a performance que ela promete.