Backend REST e Dashboard em minutos com Parse!
Tags: parse, backend, api, braziliandevs
Published: 2021-04-12 12:24:25

Se você assim como eu, já teve a necessidade de criar um Backend para servir um site ou app de forma rápida e sem precisar de muito esforço e então recorre a projetos prontos, boilerplates ou frameworks mais opinados que ja adiantam alguma coisa (Laravel, Rails, Adonis, Django...), o que acha de deixar esse processo muito mais rápido e simples ?
Vamos ver agora como fazer uma API Rest com Dashboard em alguns minutos usando o Parse!

> Hey, eu atualizei esta postagem no [meu blog pessoal, veja agora!](https://www.tuliocalil.com.br/post/backend-rest-e-dashboard-em-minutos-com-parse)

 * [ Introdução 📄](#introdu%C3%A7%C3%A3o)  
 * [ Iniciando ✍🏼](#iniciando)  
 * [ Criando script para subir o Backend 👨🏽‍💻](#criando-script-para-subir-o-backend)  
 * [ Criando o Dashboard e script ⌨️](#criando-o-dashboard-e-script)  
 * [ Subindo Backend e Dashboard 😍](#subindo-backend-e-dashboard)  
 * [ Conclusão ✅](#conclus%C3%A3o) 

###### generated with [Summaryze Forem 🌱](https://summaryze-forem.vercel.app/)

## Introdução 📄
O [Parse](https://parseplatform.org/) é uma "plataforma" com diversas soluções para criação de aplicações Backend, dentre as principais funcionalidades podemos destacar: criação e armazenamento de arquivos e objetos, autenticação e notificações push.
O projeto é totalmente Open Source e super fácil de utilizar, além de contar com uma [documentação](https://docs.parseplatform.org/) excelente.

## Iniciando ✍🏼
- Requisitos
 - [Nodejs 8](https://nodejs.org/en/) ou superior
 - [Postgres](https://www.postgresql.org/) ou [MongoDb](https://www.mongodb.com/)
 - Banco de dados criado (postgres ou mongo)

Vamos começar criando uma pasta para o nosso projeto, e apesar do Parse não precisar necessariamente disso, vai ficar mais organizado para nós(no decorrer da postagem vai ficar claro).
Para isso, vamos rodar o comando:
```sh
yarn init meuProjetoParse -y
#ou
npm init meuProjetoParse -y
```
Agora, apesar da documentação do Parse sugerir que instalemos ela de forma global, eu vou preferir instalar ela como dependência do nosso projeto, mantendo-a isolada e com melhor controle de versão:
```sh
yarn add parse-server
#ou
npm i parse-server
```
Com o parse instalado, tudo que precisamos é chamar o CLI que ele nos disponibiliza passando as configurações do nosso app, por exemplo (utilize `yarn parse-server -h` para ver a ajuda):

```sh
yarn parse-server --appId parseTest --masterKey pass --databaseURI postgres://postgres:root@localhost/parse
#ou
npx parse-server --appId parseTest --masterKey pass --databaseURI postgres://postgres:root@localhost/parse
```

Certo, mas o que aconteceu aqui ?
Nós acabamos de chamar a CLI do Parse informando o id do nosso projeto (appId), a senha (masterKey) e a URI da base de dados (databaseURI). Executando apenas este comando o parse irá subir o nosso Backend, porém, podemos melhorar esse processo.

## Criando script para subir o Backend 👨🏽‍💻
Vamos criar um arquivo de configuração para podermos inserir todas as opções que desejarmos (consulte o help do `parse-server` para ver todas as opções disponíveis), então crie um arquivo chamado `config-server.json` na raiz do projeto e coloque o seguinte conteúdo:
```json
{
  "appId": "parseTest",
  "masterKey": "pass",
  "databaseURI": 
  "postgres://usuario:senha@localhost/nomebanco"
}
```
Se desejar, utilize uma URI do mongoDB, caso utilize o postgres, lembre-se de renomear para os seus dados (usuário, senha, host e base de dados).
Agora vamos no nosso `package.json` e vamos criar nosso script que subirá nosso servidor, para isso, adicione (caso não exista) a chave scripts com o seguinte script:
```json
"scripts": {
    "server": "yarn parse-server config-server.json"
  },
```
E para testar nosso Backend, basta rodar no terminal:
```sh
yarn server
#ou
npm run server
```
E veremos um log e na ultima linha a mensagem:
`[7165] parse-server running on http://localhost:1337/parse`
indicando que nosso Backend já esta rodando 🥳.

## Criando o Dashboard e script ⌨️
O Parse inclui uma dashboard para gerenciar todos os dados do Backend, e o processo de instalação e configuração é bem similar ao anterior, então vamos começar instalando o `parse-dashboard` como dependência do nosso projeto:
```sh
yarn add parse-dashboard
#ou
npm i parse-dashboard
```
Para subir nosso dashboard faríamos algo como:
```sh
yarn parse-dashboard --dev --appId parseTest --masterKey pass --serverURL "http://localhost:1337/parse" --appName Estudo
```
A única coisa nova aqui é o `serverURL`, que deve apontar pra url do Backend que acabamos de criar e o `appName`.
Sendo assim, precisamos criar um novo arquivo de configuração, pois o parse-dashboard possui outro formato(que possibilita gerenciar mais de um Backend inclusive), crie um arquivo chamado `config-dashboard.json` e coloque o seguinte conteúdo:
```json
{
  "apps": [
    {
        "serverURL": "http://localhost:1337/parse",
        "appId": "parseTest",
        "masterKey": "pass",
        "appName": "Parse Estudo"
    }
  ]
}
```
Podemos também adicionar autenticação na nossa pagina, para isso, basta adicionarmos a key `users`, ficando desta forma:
```json
{
  "apps": [
    {
        "serverURL": "http://localhost:1337/parse",
        "appId": "parseTest",
        "masterKey": "pass",
        "appName": "Parse Estudo"
    }
  ],
  "users": [
    {
      "user": "admin",
      "pass": "admin"
    }
  ]
}
```
Com nosso dashboard configurado, vamos agora criar nosso script no `package.json`, ficando desta forma:
```json
"scripts": {
    "server": "yarn parse-server config.json",
    "dashboard": "yarn parse-dashboard --config config-dashboard.json"
  },
```
Tudo pronto, basta que você abra dois terminais, em um execute:
```sh
yarn server
```
e no outro:
```sh
yarn dashboard
```
e acessar a url exibida no terminal: http://0.0.0.0:4040/ :
![Login do Parse Dashboard](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/rzvwlx88wlv5nxracbq4.png)
![Parse Dashboard](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/2kxcu6nozkqsl0rw0jjq.png)

Porém, ainda da pra melhorar mais um pouco.

## Subindo Backend e Dashboard 😍
Atualmente precisamos de dois terminais para rodar o Backend e o Dashboard, porém, podemos melhorar isso criando um único script que irá executar os outros dois ao mesmo tempo.
Vamos instalar mais duas dependências:
```sh
yarn add concurrently wait-on
```
Com essas duas dependências, vamos conseguir executar scripts de forma concorrente e vamos conseguir esperar que o servidor suba para só então chamar o dashboard.
Então, no nosso `package.json` iremos adicionar mais um script, ficando desta forma:
```json
"scripts": {
    "server": "yarn parse-server config.json",
    "dashboard": "yarn parse-dashboard --config config-dashboard.json",
    "start": "concurrently \"yarn server\" \"wait-on http://localhost:1337/parse/health && yarn dashboard \""
  },
```
Observe aqui que estou checando se o servidor está rodando no endpoint `/parse/health` pois o wait-on por padrão espera que a resposta da url seja um status code 200. Sendo assim, nosso dashboard irá ser executado apenas quando o servidor subir com sucesso e para testarmos, vamos simplesmente rodar:
```sh
yarn start
#ou
npm start
```
E o nosso Backend estará em perfeita execução:
![Backend rodando](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/yozpmnp992ik2cd4rb1k.png)

Ao acessar podemos perceber no menu lateral varias opções:
![Parse dashboard](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ddrgjsru35yctz2xb81u.png)
Temos:
- Core
 - Browser, mostrando as nossas tabelas/schemas do banco de dados.
     - Create Class, que é a opção pra criar uma nova entidade no banco de dados.
 - Webhooks, que são ações que acontecem em resposta a algo, por exemplo, depois de salvar um novo usuário, chamar um endpoint para enviar um email de boas vindas.
 - Jobs, disponível apenas com integração com o a cloud, são tarefas que você pode configurar para serem executadas de acordo com seu agendamento, a mesma ideia de cron jobs.
 - Logs, um tail dos logs que são salvos em discos, divididos entre `info` e `erro`.
 - Config, um atalho para criar novos campos personalizados na entidade de configuração.
 - Api Console, um cliente http embarcado no sistema, para executar chamadas de teste.
- Push, nosso painel para envio de push notifications
 - Audiences, segmentação do nosso publico para as notificações.

Já dentro de uma classe/entidade, podemos ver algumas opções:
![Parse dashboard](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/fjljjwzcghn1h5615l8d.png)
Podemos visualizar os campos da nossa classe e seus tipos, a opção para adicionar um novo campo, adicionar um novo registro, gerenciar os campos existentes, filtrar, atualizar os registros e a segurança referente a essa classe (permissões para alterar a classe) etc.

Para acessar as rotas basta que você faça uma chamada com o mesmo nome da classe que você criou, por exemplo:
`http://localhost:1337/parse/classes/users`.
Consulte [aqui a documentação](https://docs.parseplatform.org/rest/guide/#quick-reference).

## Conclusão ✅
O Parse é uma ferramenta muito legal e rápida. Poderíamos ter feito toda essa aplicação sem precisar criar um projeto node, utilizando scripts bash por exemplo ou mesmo [Docker](https://www.docker.com/)(Eu quero muito escrever sobre docker aqui) para criar containers para o Backend e para o Dashboard, porém, essa solução abordada aqui funciona muito bem.
Eu posso trazer uma segunda parte desse post, configurando as classes e permissões e utilizando em uma aplicação caso alguém queira.
Vocês podem acessar o projeto de exemplo que eu fiz aqui no github:
{% github tuliocll/parse-backend-example %}