|
|[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 |
|
|