... | ... | @@ -17,7 +17,8 @@ Esta seção apresentará todas as configurações para executar o projeto. |
|
|
- [Configurando a Máquina](#configurando-a-máquina)
|
|
|
- [Compilando](#compilando)
|
|
|
- [Executando](#executando)
|
|
|
- [Frontend](#frontend)
|
|
|
- [Frontend - Dashboard](#frontend)
|
|
|
- [Configurando sua IDE](#configurando-a-ide-1)
|
|
|
- [Configurando a Máquina](#configurando-a-máquina-1)
|
|
|
- [Compilando](#compilando-1)
|
|
|
- [Executando](#executando-1)
|
... | ... | @@ -28,13 +29,19 @@ Aqui serão encontradas as instruções de configuração de ambos ambientes de |
|
|
|
|
|
### Instalando o Node
|
|
|
|
|
|
Recomendamos fortemente instalar a versão LTS do node. Você pode baixar clicando [aqui](https://nodejs.org/en/download/).
|
|
|
|
|
|
#### Instalação
|
|
|
|
|
|
TBD
|
|
|
|
|
|
#### Verificação
|
|
|
## Verificação
|
|
|
|
|
|
TBD
|
|
|
Para verificarmos se o Node foi instalado corretamente, execute o comando `node -v` em seu terminal e devemos ter a seguinte mensagem:
|
|
|
```bash
|
|
|
v15.11.0
|
|
|
```
|
|
|
Obs: Se não estiver exatamente nesta versão, não tem problema. Basta ser superior.
|
|
|
|
|
|
### Configurando a IDE
|
|
|
|
... | ... | @@ -58,16 +65,53 @@ TBD |
|
|
|
|
|
TBD
|
|
|
|
|
|
## Frontend
|
|
|
# Frontend
|
|
|
|
|
|
### Configurando a Máquina
|
|
|
## Configurando a IDE
|
|
|
|
|
|
TBD
|
|
|
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](https://code.visualstudio.com/).
|
|
|
|
|
|
### Compilando
|
|
|
Uma vez baixado, é aconselhável a instalação dos seguintes plugins:
|
|
|
- [Color Hightlight](https://marketplace.visualstudio.com/items?itemName=naumovs.color-highlight): Ao digitarmos uma cor em **hexadecimal**, a mesma será destacada com a cor.
|
|
|
|
|
|
TBD
|
|
|
![Plugin](/resources/images/tutorial/color-highlight.png)
|
|
|
|
|
|
### Executando
|
|
|
- [EsLint](https://marketplace.visualstudio.com/items?itemName=dbaeumer.vscode-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.
|
|
|
|
|
|
TBD |
|
|
- [EditorConfig](https://marketplace.visualstudio.com/items?itemName=EditorConfig.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:
|
|
|
```json
|
|
|
"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 [aqui](https://nodejs.org/en/download/). Obs: é recomendada a versão **LTS**. Após instalá-lo, podemos fazer um *check* na sua versão instalada:
|
|
|
- Abra seu terminal
|
|
|
- digite:
|
|
|
```bash
|
|
|
node -v
|
|
|
```
|
|
|
Você deverá ver uma versão similar a essa (mas não exatamente):
|
|
|
```bash
|
|
|
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:
|
|
|
```bash
|
|
|
Project is running at http://0.0.0.0:3000/
|
|
|
```
|
|
|
|
|
|
Pronto! Você está pronto para o desenvolvimento! 🥳 |
|
|
\ No newline at end of file |