Configurações do Projeto

Descrição

Esta seção apresentará todas as configurações para executar o projeto.

Sumário

• Configurações Gerais
  • Clonando os Repositórios
• Frontend - Dashboard
  • Configurando sua IDE
  • Configurando a Máquina
  • Compilando
  • Executando

Configurações Gerais

Aqui serão encontradas as instruções de configuração de ambos ambientes de desenvolvimento.

Clonando os Repositórios

Para clonarmos um repositório, basta termos o Git instalado. Você pode baixá-lo clicando aqui. Após instalado, basta abrirmos o terminal ou o git bash e digitarmos o seguinte comando:

git clone http://tools.ages.pucrs.br/<group>/<project-name>.git

Frontend Dashboard

Configurando a IDE

Optamos por utilizar o Visual Studio Code. Muito mais que uma IDE, o VsCode nos traz uma série de plugins e integrações que facilitam o desenvolvimento e aumentam nossa produtividade. Você pode baixar clicando aqui.

Uma vez baixado, é aconselhável a instalação dos seguintes plugins:

• Color Hightlight: Ao digitarmos uma cor em hexadecimal, a mesma será destacada com a cor.

• EsLint: Este é o mais importante, pois irá nos ajudar a monitorar o padrão de código previamente configurado no projeto, nos avisando de quebras de linhas necessárias, forma de escrever o código, etc.

• EditorConfig: Este irá nos ajudar a mantermos a compatibilidado entre windows e linux no que diz respeito a quebra de linhas e aspas em strings.

Por fim, vamos apenas fazer uma alteração nas configurações da IDE, para que sempre que salvarmos um arquivo do projeto, o linter aplique os padrões automaticamente:

• 1 - Pressione ctrl + shift + p (ou cmd + shift + p) e digite settings.
• 2 - Procure pela opção Preferences: Open Settings (JSON).
• Adicione o seguinte código no arquivo:

"editor.codeActionsOnSave": {
    "source.fixAll.eslint": true,
  },

Configurando a Máquina

Para que possamos atuar no Dashboard do projeto, antes precisamos instalar o NodeJs. Você pode baixar clicando aqui. Obs: é recomendada a versão LTS. Após instalá-lo, podemos fazer um check na sua versão instalada:

• Abra seu terminal
• digite:

node -v

Você deverá ver uma versão similar a essa (mas não exatamente):

v15.11.0

Compilando

Com o projeto clonado, navegue até a raíz e abra o terminal. Digite o comando npm install para que seja instalada as dependências do projeto.

Executando

Após a instalação das dependências, basta executarmos o comando npm start e você terá a seguinte mensagem no seu terminal:

Project is running at http://0.0.0.0:3000/

Pronto! Você está pronto para o desenvolvimento! 🥳