Skip to content

GitLab

Last edited by Rafael Victor Ruwer Araujo
Page history

Configuração

Home Sprints Requisitos Arquitetura Configuração Endpoints Mockups Problemas

Para o correto funcionamento do projeto, é necessário configurar os ambientes do backend e frontend.

Backend

Para a configuração do projeto do backend, é necessário ter instalados o TomCat 8 (como servidor) e MySQL 5.7 (como sistema de gerenciamento de banco de dados).

Se você é um ás na configuração/setup de ambientes de desenvolvimento, apenas os dois softwares acima já serão suficientes. Entretanto, recomendamos baixar o MySQL Workbench e usá-lo para acesso ao banco de dados (download).

Após baixar e abrir o MySQL Workbench:

  1. selecione a conexão padrão Local instance 3306
  2. digite a senha do usuário root (você deve ter definido uma senha durante a instalação do MySQL) e confirme

Tela inicial do MySQL Workbench

Na tela que abrir:

  1. digite o seguinte comando para criar o schema usado para reunir as tabelas:

    create database dietoterapia;

    Observação: você pode mudar este nome se quiser, mas o mesmo será necessário novamente nos próximos passos.

  2. execute o comando com Ctrl + Enter. Uma mensagem deve aparecer na parte inferior da tela, informando que o comando foi executado com sucesso

  3. feche a aba com a conexão atual

Tela do MySQL Workbench com entrada para comandos SQL

De volta na tela inicial, crie uma nova conexão, onde o valor do campo Default schema deve ser o mesmo usado na criação do schema (selecionado acima):

Tela de criação de conexão no MySQL Workbench

Com o banco de dados criado, é hora de configurar a IDE: recomendamos usar o IntelliJ IDEA Ultimate (download). Para usá-lo, você deve ter uma licença válida, que pode ser obtida usando o e-mail acad fornecido pela PUCRS (peça aqui sua licença).

Após instalar o IntelliJ, clone o projeto do backend (instruções sobre Git) e importe o projeto no IntelliJ (tutorial).

Atenção: não se esqueça de criar o arquivo de configurações config.properties dentro da pasta resources no projeto para se conectar com o banco de dados, com o seguinte conteúdo:

    conexao.url=jdbc:mysql://localhost/<schema>
    conexao.user=<usuario>
    conexao.password=<senha>
  • <schema>: nome do schema criado anteriormente
  • <usuario>: um usuário com direitos de leitura e escrita sobre o schema criado; se você está seguindo este tutorial à risca, use o usuário root
  • <senha>: a senha que você informou ao instalar o MySQL, e usada no MySQL Workbench para criar o schema

Se tudo tiver dado certo, então o backend está pronto e funcionando! :D

Frontend

Configurar o frontend é mais simples:

  1. instale o NodeJS 8 (ou posterior) e NPM 5 (ou posterior) (download)

  2. instale as ferramentas de linha de comando do Angular (tutorial com introdução ao Angular)

    # em um terminal
npm install -g @angular/cli

  3. clone o projeto do frontend (instruções sobre Git)

  4. instale as dependências do projeto:

    # em um terminal, na pasta do projeto clonado
npm install

Pronto! O frontend já está configurado.

Para editar o código do frontend, recomendamos usar o Visual Studio Code (download), que já possui suporte a todas as linguagens usadas no frontend, inclusive TypeScript.

Observações:

  • para rodar o frontend:
    1. abra o IntelliJ e execute o backend
    2. abra um terminal na pasta do projeto do frontend e execute ng serve
    3. abra um navegador e vá para o endereço localhost:4200
  • sempre que alguma nova dependência for adicionada ao projeto, você deverá instalá-las executando npm install novamente a partir da pasta do projeto do frontend

Extras

Backend - Postman

Se você está trabalhando no backend, você pode usar o Postman (download) para testar os endpoints criados.

Git - GitKraken ou SourceTree

Se você tem dificuldades em usar o Git ou a linha de comando, você pode usar uma ferramenta gráfica como o GitKraken (download) ou SourceTree (download).

Caso não queira baixar mais uma aplicação, você pode usar os plugins das IDEs para Git. Tanto no IntelliJ quanto no Visual Studio Code, ele já vem instalado por padrão.

Resumo

Softwares necessários:

  • TomCat 8
  • MySQL 5.7
  • NodeJS 5 ou posterior
  • NPM 8 ou posterior
  • Angular

IDEs

  • IntelliJ IDEA Ultimate
  • Visual Studio Code

Extras (recomendados)

  • MySQL Workbench
  • Postman

Outros

  • tutorial de Git disponível na wiki
  • tutorial de configuração do backend no IntelliJ disponível na wiki
  • cheatsheet do Angular disponível na wiki
  • como as tabelas do backend são geradas automaticamente pelo Hibernate, é possível gerar o diagrama entidade-relacionamento do banco de dados usando o MySQL Workbench; a wiki tem um tutorial passo a passo de como exportar o diagrama ER
  • a wiki também possui um pequeno tutorial com links para referências sobre Markdown (a linguagem utilizada para construir as páginas da wiki)