| 
 | 
|[Página Inicial](home)|
 | 
 | 
|[Página Inicial](home)|[Escopo](escopo)|[Processo](processo)|[Design](design)|[**Configuração**](configuracao)|[Arquitetura](arquitetura)|[Banco de Dados](banco_dados)|[Qualidade](qualidade)|[Instalação](instalacao)|
 | 
| 
 | 
|---|   
 | 
 | 
|:-:|:-:|:-:|:-:|:-:|:-:|:-:|:-:|:-:|
 | 
| 
 | 
 | 
 | 
 | 
| 
 | 
# Página de Configuração do Projeto
 | 
 | 
 | 
| 
 | 
 | 
 | 
# Configurações do Projeto
 | 
| 
 | 
Aqui deve ser explicado como configurar o Ambiente para que os Desenvolvedores do Projeto possam configurar o projeto para rodar em seus computadores, deve ser sempre atualizado a cada mudança de instalação feita.
 | 
 | 
## Descrição
 | 
| 
 | 
 | 
 | 
Esta seção apresentará todas as configurações para executar o projeto.
 | 
| 
 | 
* Deve ser explicado a configuração de **TODAS** as partes do projeto, tanto BACK,BANCO,FRONT,etc...
 | 
 | 
## Sumário
 | 
| 
 | 
* Além de explicar aqui, deve ter em cada Repositório o **RESUMO** de como instalar para quando os Desenvolvedores baixarem o projeto possam configurar por lá também
 | 
 | 
- [Configurações Gerais](#configurações-gerais)
 | 
| 
 | 
 | 
 | 
    - [Instalando o Node](#instalando-o-node)
 | 
| 
 | 
# Instalação do Node
 | 
 | 
    - [Configurando sua IDE](#configurando-a-ide)
 | 
| 
 | 
 | 
 | 
    - [Clonando os Repositórios](#clonando-os-repositórios)
 | 
 | 
 | 
 | 
- [Backend](#backend)
 | 
 | 
 | 
 | 
    - [Configurando a Máquina](#configurando-a-máquina)
 | 
 | 
 | 
 | 
    - [Compilando](#compilando)
 | 
 | 
 | 
 | 
    - [Executando](#executando)
 | 
 | 
 | 
 | 
- [Frontend](#frontend)
 | 
 | 
 | 
 | 
    - [Configurando a Máquina](#configurando-a-máquina-1)
 | 
 | 
 | 
 | 
    - [Compilando](#compilando-1)
 | 
 | 
 | 
 | 
    - [Executando](#executando-1)
 | 
 | 
 | 
 | 
 | 
 | 
 | 
 | 
## Configurações Gerais
 | 
 | 
 | 
 | 
Aqui serão encontradas as instruções de configuração de ambos ambientes de desenvolvimento.
 | 
 | 
 | 
 | 
### Instalando o Node
 | 
| 
 | 
#### Instalação
 | 
 | 
#### Instalação
 | 
| 
 | 
 | 
 | 
 | 
| 
 | 
O download do instalador do Node pode ser realizado pelo seguinte [link](https://nodejs.org/en/).
 | 
 | 
O download do instalador do Node pode ser realizado pelo seguinte [link](https://nodejs.org/en/).
 | 
| ... | @@ -33,9 +45,28 @@ Depois execute o seguinte comando `npm -v` e novamente verifique se o retorno é | 
... | @@ -33,9 +45,28 @@ Depois execute o seguinte comando `npm -v` e novamente verifique se o retorno é | 
| 
 | 
C:\user\npm-v
 | 
 | 
C:\user\npm-v
 | 
| 
 | 
v6.14.8
 | 
 | 
v6.14.8
 | 
| 
 | 
```
 | 
 | 
```
 | 
 | 
 | 
 | 
### Configurando a IDE
 | 
 | 
 | 
 | 
Para o desenvolvimento do código e fácil controle de versionamento (GitLab) sugerimos a instalação do [Visual Studio Code](https://code.visualstudio.com/). O mesmo além de ser uma ótima ferramenta para desenvolvimento conta com extensões que serão essenciais para padronização do código do projeto.
 | 
 | 
 | 
 | 
 | 
 | 
 | 
 | 
Depois de instalar o Visual Studio Code, acesse sua aba de extensões e instale as seguintes:
 | 
 | 
 | 
 | 
 | 
 | 
 | 
 | 
* ESLint: Para que a IDE identifique padrões do React que estão sendo desrespeitados.
 | 
 | 
 | 
 | 
* Prettier: Para que a IDE realize a indentação do código de maneira correta.
 | 
 | 
 | 
 | 
 | 
 | 
 | 
 | 
Caso deseje também, baixe a extensão do Material (Material Theme) no seu VS Code para uma melhor apresentação visualmente da estrutura do projeto
 | 
 | 
 | 
 | 
 | 
 | 
 | 
 | 
Depois de adicionar as extensões necessárias, falta apenas uma configuração para podermos começar o desenvolvimento. No seu teclado pressione as teclas `ctrl` `shift` `p` para acessar a aba de pesquisa do Visual Studio Code. Pesquise por `settings` e abra o arquivo com nome `Prefernces: Open Settings (JSON)`. Nesse arquivo adicione as seguintes linhas:
 | 
 | 
 | 
 | 
 | 
 | 
 | 
 | 
```
 | 
 | 
 | 
 | 
"editor.formatOnSave": true,
 | 
 | 
 | 
 | 
"[javascript]": {
 | 
 | 
 | 
 | 
    "editor.defaultFormatter": "esbenp.prettier-vscode"
 | 
 | 
 | 
 | 
  }
 | 
 | 
 | 
 | 
```
 | 
| 
 | 
 | 
 | 
 | 
| 
 | 
# Clonando o projeto
 | 
 | 
> Caso o mesmo já esteja presente, desconsidere.
 | 
| 
 | 
 | 
 | 
 | 
 | 
 | 
 | 
### Clonando os Repositórios
 | 
| 
 | 
Para ser necessário clonar o projeto, é preciso primeiro acessar a página do nosso time, disponível [aqui](https://tools.ages.pucrs.br/olive).
 | 
 | 
Para ser necessário clonar o projeto, é preciso primeiro acessar a página do nosso time, disponível [aqui](https://tools.ages.pucrs.br/olive).
 | 
| 
 | 
 | 
 | 
 | 
| 
 | 
Na página inicial do time, você irá encontrar todos os repositórios referentes à esse projeto:
 | 
 | 
Na página inicial do time, você irá encontrar todos os repositórios referentes à esse projeto:
 | 
| ... | @@ -58,35 +89,18 @@ Após selecionar o repositório que deseja clonar, irá aparecer um botão escri | 
... | @@ -58,35 +89,18 @@ Após selecionar o repositório que deseja clonar, irá aparecer um botão escri | 
| 
 | 
 | 
 | 
 | 
| 
 | 
> Não é necessário colocar as aspas, apenas o link
 | 
 | 
> Não é necessário colocar as aspas, apenas o link
 | 
| 
 | 
 | 
 | 
 | 
| 
 | 
Pronto, você agora possui uma instância local do repositório! :smile:
 | 
 | 
Pronto, você agora possui uma instância local do repositório!
 | 
| 
 | 
 | 
 | 
 | 
| 
 | 
 | 
 | 
 | 
| 
 | 
# Configuração do Ambiente de Desenvolvimento Frontend
 | 
 | 
## Backend
 | 
| 
 | 
 | 
 | 
### Configurando a Máquina   
 | 
| 
 | 
### Configurando a IDE
 | 
 | 
### Compilando
 | 
| 
 | 
 | 
 | 
### Executando
 | 
| 
 | 
Para o desenvolvimento do código e fácil controle de versionamento (GitLab) sugerimos a instalação do [Visual Studio Code](https://code.visualstudio.com/). O mesmo além de ser uma ótima ferramenta para desenvolvimento conta com extensões que serão essenciais para padronização do código do projeto.
 | 
 | 
 | 
| 
 | 
 | 
 | 
 | 
| 
 | 
Depois de instalar o Visual Studio Code, acesse sua aba de extensões e instale as seguintes:
 | 
 | 
 | 
| 
 | 
 | 
 | 
 | 
| 
 | 
* ESLint: Para que a IDE identifique padrões do React que estão sendo desrespeitados.
 | 
 | 
 | 
| 
 | 
* Prettier: Para que a IDE realize a indentação do código de maneira correta.
 | 
 | 
 | 
| 
 | 
 | 
 | 
 | 
| 
 | 
Caso deseje também, baixe a extensão do Material (Material Theme) no seu VS Code para uma melhor apresentação visualmente da estrutura do projeto
 | 
 | 
 | 
| 
 | 
 | 
 | 
 | 
| 
 | 
Depois de adicionar as extensões necessárias, falta apenas uma configuração para podermos começar o desenvolvimento. No seu teclado pressione as teclas `ctrl` `shift` `p` para acessar a aba de pesquisa do Visual Studio Code. Pesquise por `settings` e abra o arquivo com nome `Prefernces: Open Settings (JSON)`. Nesse arquivo adicione as seguintes linhas:
 | 
 | 
 | 
| 
 | 
 | 
 | 
 | 
| 
 | 
```
 | 
 | 
 | 
| 
 | 
"editor.formatOnSave": true,
 | 
 | 
 | 
| 
 | 
"[javascript]": {
 | 
 | 
 | 
| 
 | 
    "editor.defaultFormatter": "esbenp.prettier-vscode"
 | 
 | 
 | 
| 
 | 
  }
 | 
 | 
 | 
| 
 | 
```
 | 
 | 
 | 
| 
 | 
 | 
 | 
 | 
| 
 | 
> Caso o mesmo já esteja presente, desconsidere.
 | 
 | 
 | 
| 
 | 
 | 
 | 
 | 
| 
 | 
### Executando o Projeto
 | 
 | 
 | 
| 
 | 
 | 
 | 
 | 
 | 
 | 
 | 
## Frontend
 | 
 | 
 | 
 | 
### Configurando a Máquina
 | 
 | 
 | 
 | 
### Compilando
 | 
 | 
 | 
 | 
### Executando
 | 
| 
 | 
Depois de clonar o repositório do GitLab para a sua máquina, acesse o projeto pelo terminal (pode ser diretamente pelo terminald o VS Code) e execute `npm install`. Esse comando irá fazer o download e todas dependências do projeto (esse comando pode demorar bastante para ser executado, então não se preocupe).
 | 
 | 
Depois de clonar o repositório do GitLab para a sua máquina, acesse o projeto pelo terminal (pode ser diretamente pelo terminald o VS Code) e execute `npm install`. Esse comando irá fazer o download e todas dependências do projeto (esse comando pode demorar bastante para ser executado, então não se preocupe).
 | 
| 
 | 
 | 
 | 
 | 
| 
 | 
Para visualizar o que já foi feito, basta executar o seguinte comando no terminal `npm start`.
 | 
 | 
Para visualizar o que já foi feito, basta executar o seguinte comando no terminal `npm start`.
 | 
| ... | @@ -95,4 +109,4 @@ Como a ideia deste projeto é partir para um PWA (Progressive Web App), para vis | 
... | @@ -95,4 +109,4 @@ Como a ideia deste projeto é partir para um PWA (Progressive Web App), para vis | 
| 
 | 
 | 
 | 
 | 
| 
 | 
O `npm run build` permite que você execute quaisquer tarefas de construção / preparação necessárias para o seu projeto.
 | 
 | 
O `npm run build` permite que você execute quaisquer tarefas de construção / preparação necessárias para o seu projeto.
 | 
| 
 | 
 | 
 | 
 | 
| 
 | 
Feito isso, digite logo em seguida no terminal `serve -s build` e acesse tanto pelo localhost quanto pelo seu IP (não faz diferença entre eles). Pronto, sua aplicação esta rodando localmente e com PWA funcionando. | 
 | 
Feito isso, digite logo em seguida no terminal `serve -s build` e acesse tanto pelo localhost quanto pelo seu IP (não faz diferença entre eles). Pronto, sua aplicação esta rodando localmente e com PWA funcionando. | 
 | 
\ No newline at end of file | 
 | 
 |