App em Flask com IA/ML - desenvolvimento e deploy 100% free (PARTE 2)
Tags: python, webdev, braziliandevs, deta
Published: 2024-03-18 00:44:20

Neste post, finalizamos o tutorial em que desenvolvemos um pequeno e simples aplicativo web utilizando somente ferramentas gratuitas. Na <a href="https://dev.to/msc2020/parte-1-aplicacao-flask-contendo-recursos-de-iaml-desenvolvimento-e-deploy-gratuitos-3cl2?preview=475334a052e78e7c6d643359f1455e8b58529886821f841d58d6921d6b592ad375358c6a095896922a90c2daad3b39293973c5c942910f1c2b8bc033"><u>PARTE 1</u></a> vimos como usar Python (Flask) e recursos de aprendizagem de máquina (_machine learning_ - ML) para realizar análises de suspeitas de plágio. As análises foram feitas utilizando a API da <a href="huggingface.co/"><u>Hugging Face</u></a> para o modelo de ML escolhido, responsável por realizar a tarefa de forma automática. Agora iremos passar nosso app do ambiente local para um ambiente de produção gratuito (<u>100% _free_</u>). Nesse ambiente o app desenvolvido ficará disponível na Internet e não somente em nosso computador.

- **<a href="https://github.com/msc2020/checa-plagio-app"><u>Acesse o código completo em:</u> https://github.com/msc2020/checa-plagio-app</a>**

<br/>
Vamos lá? ☕

---

## Recapitulando: O que vc acha do mini app abaixo?

![gif do app](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/g8xz74do3lnadsx1hmnw.gif)

**<center><a href="https://checaplagio-1-a4780033.deta.app">https://checaplagio-1-a4780033.deta.app/</a></center>**

**Nota:** A numeração das seções neste post inicia com **5** porque na <a href="https://dev.to/msc2020/parte-1-aplicacao-flask-contendo-recursos-de-iaml-desenvolvimento-e-deploy-gratuitos-3cl2?preview=475334a052e78e7c6d643359f1455e8b58529886821f841d58d6921d6b592ad375358c6a095896922a90c2daad3b39293973c5c942910f1c2b8bc033"><u>PARTE 1</u> do tutorial</a> apresentamos as partes de 1 a 4.

---

## 5. Deploy no Deta Space

Fazer o <u>deploy em produção</u> significa enviar o que foi desenvolvido localmente para um ambiente de produção. Este ambiente irá hospedar, disponibilizar recursos e gerenciar o que for necessário para que o app rode assim como rodou localmente (no computador pessoal). Se a passagem de ambientes for entre outros, como por ex., de uma cloud pública para uma privada, os passos vistos neste tutorial continuam sendo semelhantes. Para mais detalhes sobre deploy leia o seguinte <a href="https://deta.space/docs/en/build/fundamentals/app-lifecycle" target="_blank">texto</a>. Neste post o deploy será feito com o <a href="https://deta.space">Deta Space</a>.

### 5.1 Configurar o Deta Space localmente

Para realizar o deploy do app desenvolvido na <a href="https://dev.to/msc2020/parte-1-aplicacao-flask-contendo-recursos-de-iaml-desenvolvimento-e-deploy-gratuitos-3cl2?preview=475334a052e78e7c6d643359f1455e8b58529886821f841d58d6921d6b592ad375358c6a095896922a90c2daad3b39293973c5c942910f1c2b8bc033">PARTE 1</a> basta ler a documentação do Deta Space e seguir o que eles recomendam. A princípio se escolher outro ambiente, teremos outra sequência de passos semelhantes aos que seguiremos a seguir.

**Passo 0 - Criar uma conta no Deta Space:** Para usarmos os recursos do Deta Space, precisamos criar uma conta gratuita lá. Para isso acessamos <a href="https://deta.space/" target="_blank">https://deta.space</a> e seguimos os passos usuais de criação de uma conta em algum site. No próprio Deta Space, na aba `Settings`, haverá um token de acesso que usaremos para realizar o login via CLI.

![token - space](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/qiw9v3ch409oaeyscxno.png)

**Passo 1 - Instalar a CLI do Deta Space:** Para enviar os códigos do app desenvolvido para o ambiente de produção, é necessário instalar a CLI (_Command Line Interface_) do Deta Space.

**Nota:** Seguiremos os passos recomendados na documentação deles: <a href="https://deta.space/docs/en/build/new-apps" target="_blank">https://deta.space/docs/en/build/new-apps</a>.

Para quem usa Linux, resumidamente, basta digitar o seguinte comando no terminal:
```shell
curl -fsSL https://deta.space/assets/space-cli.sh | sh
```

**Passo 2 - Configurações preliminares:**
Agora que já instalamos a CLI, podemos realizar todos os procedimentos para deploy no Deta Space com apenas alguns comandos.

**Quick start:** Caso queira saber das recomendações dessas etapas pelo próprio Deta Space, basta acessar <a href="https://deta.space/docs/en/build/quick-starts/python" target="_blank">https://deta.space/docs/en/build/quick-starts/python</a>.

Prosseguindo, no diretório raiz do app (i.e, na pasta `nome-do-app`) devemos criar um <a href="https://deta.space/docs/en/build/reference/spacefile" target="_blank">arquivo `Spacefile`</a> que será usado para o <u>build</u> dos arquivos e códigos que enviaremos para o Deta Space.

```shell
# Spacefile
v: 0
icon: ./app_logo.png
app_name: "Nome-do-app"
micros:
  - name: checa-plagio
    src: .
    engine: python3.9
    primary: true
    public_routes:
      - "/*"
    presets:
      env:
        - name: SECRET_KEY_FLASK
          description: Secret key do Flask.
          default: "!@$%&<mudar-para-uma-secret-key>"
        - name: API_URL
          description: URL da API.
          default: "https://api-inference.huggingface.co/models/sentence-transformers/all-MiniLM-L6-v2"
        - name: API_TOKEN
          description: Token pessoal da API.
          default: "123456789!@$%&<mudar-para-seu-token>"
```

Note que os valores presentes no arquivo `.env` (veja na <a href="https://dev.to/msc2020/parte-1-aplicacao-flask-contendo-recursos-de-iaml-desenvolvimento-e-deploy-gratuitos-3cl2?preview=475334a052e78e7c6d643359f1455e8b58529886821f841d58d6921d6b592ad375358c6a095896922a90c2daad3b39293973c5c942910f1c2b8bc033">PARTE 1</a>) estão presentes no Spacefile. A imagem que escolhemos como logo do app (`icon: ./app_logo.png`) é a seguinte:

![Logo - app](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/2a5ulgg38cl0jcxqehzh.png)

**Exercício:** Fique à vontade para escolher outra imagem de seu interesse. Ressaltamos que, o Deta Space exige que essa imagem seja `512x512` no formato `PNG` ou `WebP`.

Após incluir o `Spacefile` e o logo `app_logo.png`, a estrutura de arquivos do projeto terá a seguinte forma:

```shell
nome-do-app/
│
├── .env
│
├── static
│   ├── favicon.ico
│   ├── how_to.gif
│   ├── no.ico
│   └── yes.ico
│
├── templates/
│   ├── base.html
│   ├── index.html
│   └── how_to.html
│
├── utils/
│   └── constants.py
│
├── venv_app/
│
├── requirements.txt
├── app.py
├── app_logo.png
├── main.py
└── Spacefile
```

**Passo 3 - Criar o projeto via CLI:** Depois de criarmos o Spacefile, devemos criar um projeto Deta Space utilizando a CLI. Para isso, na pasta raiz do projeto executamos o seguinte comando:
```shell
space login
```
Em seguida entramos com o token exigido:

![Space - login](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/5rq0ci3lsjxsejjpc5o1.png)

Após realizarmos o login, o próximo passo é criar um novo projeto pela CLI. Para isso, no terminal digite:
```shell
space new
```
Em seguida entre com o nome do seu projeto/app. Manteremos o nome fictício que vínhamos usando até agora de `nome-do-app`.

![Space - new](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/b3x6zxedhvrcujp1m316.png)

Agora que tudo está feito, podemos validar se não cometemos nenhum erro no passo a passo para deploy com:
```shell
space validate
```

![space validate](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/0likhq5vd7pfe8p2g75s.png)

Por fim, digitamos o comando a baixo para realizar o build e deploy automático do nosso app:
```shell
space push
```
Essa etapa final pode demorar um pouco mais do que as outras anteriores. Após processar essa etapa, será gerado um link de acesso com o qual poderemos navegar em no app a partir de qualquer computador conectado a Internet.

![Space - push](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/c2wsg4g2j0zsbd5tvr7u.png)

A imagem acima mostra que após o processo de build e push o Deta Space fornece um link de acesso para o app.

<b>Pronto! Agora é só navegar online!</b>