utilizacao.md

@@ -11,7 +11,9 @@ TBD
 
 ### Frontend
 
-Para baixar o projeto frontend, é necessário instalar as ferramentas abaixo:
+O projeto **Adote um Amanhã** utiliza o _framework_ [**VueJS**](https://vuejs.org/) para a construção do _frontend_. Mais informações sobre o **Vue** poderão ser encontradas na sua documentação: https://vuejs.org/guide/introduction.html#what-is-vue
+
+Para baixar e utilizar o projeto, é necessário instalar as ferramentas abaixo:
 
 - Visual Studio Code: https://code.visualstudio.com/download
 - Node (npm): https://nodejs.org/en/download/
@@ -23,4 +25,38 @@ Tendo instalado as ferramentas, seguir os passos abaixo para baixar e executar o
 1. Quando o clone terminar, abrir a pasta do projeto no VS Code: `code adote-um-amanha-frontend`.
 1. No VS Code, abrir o terminal **(Ctrl + J)** e instalar os módulos do npm: `npm install`
 1. Após a instalação é possível executar o projeto rodando `npm run serve`.
-1. O projeto estará rodando e poderá ser acessado no entereço http://localhost:8080.
+1. O projeto estará rodando e poderá ser acessado pelo seu navegador no endereço http://localhost:8080.
+
+#### Extensões do Editor
+
+Para facilitar e agilizar o processo de desenvolvimento, existem algumas extensões do **VSCode** que são recomendadas:
+
+- **Vetur**: Extensão que contém várias facilidades para o desenvolvimento com **Vue**, como destaque de sintaxe, cores nos arquivos `.vue` e atalhos de código bastante úteis.
+- **ESLint**: Extensão que sinaliza possíveis erros de sintaxe no Javascript.
+- **Prettier**: Extensão que aplica formatação e identação nos arquivos automaticamente.
+
+#### Configurando as extensões
+
+##### Prettier
+
+Para configurar o **Prettier** depois de instalá-lo, siga os passos abaixo:
+
+1. Pressione **Ctrl + Shift + P**, e no campo de texto que aparecer, digite **Open Settings JSON** e clique na opção que aparecer, para abrir o arquivo `settings.json` do VS Code:  
+   (imagem)
+1. No arquivo `settings.json`, cole os campos abaixo dentro das chaves mais externas. Isso serve para definirmos o **Prettier** como formatador padrão para os arquivos e para a formatação ser aplicada toda vez que salvarmos o arquivo.
+
+```JSON
+  "editor.formatOnSave": true,
+  "[javascript]": {
+    "editor.defaultFormatter": "esbenp.prettier-vscode"
+  },
+  "[vue]": {
+    "editor.defaultFormatter": "esbenp.prettier-vscode"
+  },
+  "[json]": {
+    "editor.defaultFormatter": "esbenp.prettier-vscode"
+  },
+  "[typescript]": {
+    "editor.defaultFormatter": "esbenp.prettier-vscode"
+  },
+```