Você está na página 1de 26

16/10/2022 23:23 Building a CRUD application with Flask and SQLAlchemy | Codementor

Gareth Dwyer SEGUIR


Pythoneer e Escritor

Construindo um aplicativo CRUD com Flask e


SQLAlchemy
Publicado em 09 de novembro de 2017

Neste tutorial, veremos a criação de um aplicativo Web mínimo usando o Flask.


Usaremos SQLAlchemy em conjunto com SQLite para armazenar informações sobre
livros. O aplicativo que construímos aqui não se destina a ser útil por si só. No
entanto, uma vez que você possa escrever um aplicativo da Web básico que receba a
entrada do usuário e armazene isso em um banco de dados, você estará no caminho
certo para escrever qualquer aplicativo da Web que possa imaginar. Portanto,
manteremos o aplicativo de exemplo o mais simples possível, para que você possa se
concentrar nas próprias ferramentas em vez de detalhes específicos do aplicativo.

Depois de passar por este tutorial, você:

Entenda o que é uma aplicação web e como construir uma


Saiba como os bancos de dados funcionam e como integrá-los ao seu aplicativo da
web
Ser capaz de construir rapidamente aplicativos da Web usando Python e Flask

O que você precisa


Explicaremos cada etapa deste tutorial em detalhes, mas você achará mais fácil
acompanhar se já codificou em Python antes. Também será útil se você já usou
HTML antes,Aoouusar
pelo menos sabe, você
o Codementor o que é.
concorda com nossa
ACEITAR
Política de Cookies .
Gostouter
Você precisa desta postagem?
o Python  100 bibliotecas
3 instalado em seu computador e poder instalar 66
Python por meio do gerenciador de pacotes Python pip Você pode encontrar
https://www.codementor.io/@garethdwyer/building-a-crud-application-with-flask-and-sqlalchemy-dm3wv7yu2 1/26
16/10/2022 23:23 Building a CRUD application with Flask and SQLAlchemy | Codementor
Python por meio do gerenciador de pacotes Python, pip. Você pode encontrar
instruções detalhadas sobre como configurar o Python para diferentes sistemas
operacionais neste Tutorial do Django Girls .

Estaremos usando SQLAlchemy , que é um ORM que oculta muita lógica SQL . Se
você já executou algumas instruções SQL antes, pode ser mais fácil entender o que
está acontecendo nos bastidores. Se você quiser aprender mais sobre a relação
entre SQL e SQLAlchemy, você pode ver meu tutorial especificamente sobre isso em
Compose.io .

Todo o código usado neste tutorial está disponível como um repositório do GitHub .
Você pode clonar isso se quiser começar do produto final em vez de construir cada
etapa.

Visão Geral do Projeto

Construiremos um banco de dados de livros muito básico neste tutorial.


Especificamente, construiremos um aplicativo que permite aos usuários criar títulos
de livros inserindo-os como texto, ler todos os títulos de livros inseridos, atualizar os
títulos e excluí -los. Essas quatro operações, create , read , update e delete , mais
comumente referidas na teoria de banco de dados como "CRUD", formam a base de
quase todos os aplicativos da web, incluindo Gmail, Amazon.com e sua página de
banco online. O que quer que você queira construir, você precisará receber a
entrada de seu usuário e armazená-la (deixe seu usuário criarinformações), exibir
essas informações de volta para o usuário (permitir que o usuário leia as
informações), encontrar uma solução para informações desatualizadas ou incorretas
(permitir que os usuários atualizem informações) e remover informações
desnecessárias (permitir que os usuários excluam informações que foram
adicionadas anteriormente) . Isso tudo ficará mais claro quando virmos cada uma
das operações CRUD em ação, em nossa aplicação web.

Começando
Antes de podermos construir nosso aplicativo, precisamos instalar algumas
dependências. Assim que tivermos isso, construiremos uma página da Web básica
que simplesmente exibe texto estático. Depois que isso funcionar, adicionaremos o
banco de dados e, em seguida, adicionaremos cada uma das operações CRUD por
vez.

InstalandoAoas dependências
usar o Codementor , você concorda com nossa
ACEITAR
Política de Cookies .
A primeira coisa
Gostou quepostagem?
desta precisamos fazer é instalar algumas bibliotecas
de100
terceiros 66
para Python. Estes são:
https://www.codementor.io/@garethdwyer/building-a-crud-application-with-flask-and-sqlalchemy-dm3wv7yu2 2/26
p
16/10/2022 23:23
y Building a CRUD application with Flask and SQLAlchemy | Codementor

Flask, que usaremos para rotear o tráfego da Web por meio de solicitações HTTP

para funções específicas em nossa base de código,
SQLAlchemy, que usaremos para tornar a interação entre Python e nosso banco
de dados mais suave,
Flask-SQLAlchemy, que usaremos para tornar a interação entre Flask e
SQLAlchemy mais suave.

Você pode instalar tudo isso através do pip executando o seguinte comando:

pip3 install --user flask sqlalchemy flask-sqlalchemy

Se você está acostumado a usar virtualenv para seus projetos Python, instale as
bibliotecas dentro de um deles e solte o --user sinalizador.

Criando uma página da Web estática com Flask


Um dos pontos de venda do Flask como uma estrutura da Web é a simplicidade de
executar uma página da Web básica - podemos fazer isso em apenas algumas linhas
de código. Crie um diretório para seu projeto chamado flask-crud-app e crie um
arquivo dentro desse chamado bookmanager.py . A estrutura do seu projeto deve ter
a seguinte aparência:

flask-crud-app/

bookmanager.py

Adicione o seguinte código ao bookmanager.py arquivo:

from flask import Flask

app = Flask(__name__)

Ao usar o Codementor , você concorda com nossa


@app.route("/")

ACEITAR
Política de Cookies .
def home():

Gostou"My
return desta postagem?
flask app"
 100 66

https://www.codementor.io/@garethdwyer/building-a-crud-application-with-flask-and-sqlalchemy-dm3wv7yu2 3/26
16/10/2022 23:23 Building a CRUD application with Flask and SQLAlchemy | Codementor

if __name__ == "__main__":


app.run(host='0.0.0.0', debug=True)

Esta é uma aplicação web em sete linhas de código.

Na linha 1, importamos Flask


Na linha 3, inicializamos um aplicativo de frasco, passando a __name__ variável
especial do Python para permitir que o Flask configure de forma inteligente outras
partes de nosso aplicativo.
Na linha 5, usamos um decorador Python fornecido pelo Flask. Isso mapeia a parte
principal do nosso aplicativo ( / ) para a home() função. Veremos como o
roteamento funciona com mais detalhes quando adicionarmos mais rotas.
Nas linhas 6-7 definimos uma função que simplesmente retorna uma string
estática. É isso que será exibido ao usuário quando ele visitar nossa página.
Nas linhas 9-10, executamos nosso aplicativo atrás de um if guarda. Isso
garantirá que não iniciaremos servidores da Web se importarmos esse script para
outro (só executaremos o servidor da Web se executarmos esse arquivo
explicitamente).

Testando nosso aplicativo da Web estático


Para ver o Flask em ação, execute python3 bookmanager.py em seu console, a partir
do flask-crud-app diretório. Você deve ver uma saída semelhante à seguinte:

A parte importante é o endereço IP e a porta, que deve ser http://127.0.0.1:5000,


como na captura de tela. Visite este endereço em seu navegador da web e você
deverá ver a string "My flask app" que definimos em nosso código exibida, como na
captura de tela abaixo. Observe que estou usando localhost em vez de 127.0.0.1 .
Eles são equivalentes — ambos são endereços de "loopback" que enviam qualquer
solicitação da Web que você fizer de volta para sua própria máquina, o que é
Ao usar o Codementor , você concorda com nossa
exatamentePolítica
o que de
queremos,
Cookies .
porque estamos executando o servidor Web Flask e
ACEITAR
testando na mesma
Gostou máquina.
desta postagem?  100 66

https://www.codementor.io/@garethdwyer/building-a-crud-application-with-flask-and-sqlalchemy-dm3wv7yu2 4/26
16/10/2022 23:23 Building a CRUD application with Flask and SQLAlchemy | Codementor

Se isso não ocorrer conforme o esperado, você verá a saída de depuração em seu
console e no próprio navegador da Web (porque definimos o debug=True sinalizador
na última linha do nosso código).

Manipulando a entrada do usuário em nosso aplicativo da web

Neste ponto, temos uma aplicação web, mas não faz muito. Para torná-lo interativo,
precisamos ser capazes de aceitar a entrada de nossos usuários. Faremos isso
adicionando um formulário HTML que passa informações do front-end do nosso
aplicativo (o que nossos usuários veem), através do Flask e para o back-end (nosso
código Python).

Para nosso aplicativo acima, definimos a string "My flask app" em nosso código
Python. Tudo bem, pois era uma única linha, mas à medida que nosso código front-
end cresce, será complicado definir tudo em nosso arquivo Python. O Flask permite a
separação de interesses através dos chamados "modelos". Geralmente são
.html arquivos, com alguma lógica Python misturada por meio da linguagem do
mecanismo de modelo Jinja . Vamos adicionar um modelo ao nosso aplicativo para
abrigar todo o nosso código front-end.

Criando um formulário de entrada


Crie um novo diretório chamado templates dentro do diretório do projeto. Para
todos os outros nomes que usamos para nossos arquivos e diretórios, você pode se
desviar do que especificamos e escolher seus próprios nomes. Mas para esta etapa,
é importante que você use o nome templates exatamente como especificado, pois o
Flask trata esse diretório de maneira diferente e sabe procurar nele seus arquivos de
modelo.

Dentro do templates diretório, crie


Ao usar o Codementor , vocêum arquivo
concorda chamado
com nossa home.html . A estrutura do
ACEITAR
seu projeto Política de Cookies
agora deve ter a .seguinte aparência.
Gostou desta postagem?  100 66

https://www.codementor.io/@garethdwyer/building-a-crud-application-with-flask-and-sqlalchemy-dm3wv7yu2 5/26
16/10/2022 23:23 Building a CRUD application with Flask and SQLAlchemy | Codementor

flask-crud-app/


bookmanager.py

templates/

home.html

No home.html arquivo, coloque o seguinte código:

<html>

<body>

<form method="POST" action="/">

<input type="text" name="title">

<input type="submit" value="Add">

</form>

</body>

</html>

Esta é uma página HTML básica, que contém:

Uma entrada de texto (linha 4), que associará qualquer entrada ao nome "título".
Um botão de envio (linha 5), ​que contém o texto "Adicionar".
Uma direção para enviar os dados ("post") para nossa aplicação web na página
principal (a / rota, que é a mesma página que definimos em nosso .py arquivo).

No bookmanager.py arquivo, precisamos fazer duas alterações para usar nosso novo
template. Na seção de importações, adicione a seguinte linha:

from flask import render_template

Ao usar o Codementor , você concorda com nossa


ACEITAR
Política de Cookies .
Gostou desta postagem?  100 66

https://www.codementor.io/@garethdwyer/building-a-crud-application-with-flask-and-sqlalchemy-dm3wv7yu2 6/26
16/10/2022 23:23 Building a CRUD application with Flask and SQLAlchemy | Codementor

E mude a return "My flask app" linha para:


return render_template("home.html")

Essa linha diz ao Flask para procurar o home.html arquivo dentro do


templates diretório, processar qualquer lógica que ele contenha (o que ainda não,
mas adicionaremos em breve) e retornar o resultado para o usuário.

Todo o aplicativo agora deve ter a seguinte aparência.

from flask import Flask

from flask import render_template

app = Flask(__name__)

@app.route("/")

def home():

return render_template("home.html")

if __name__ == "__main__":

app.run(host='0.0.0.0', debug=True)

Execute-o novamente python3 bookmanager.py em seu console (ou, se ainda estiver


em execução, você verá que o servidor percebe as alterações e recarrega
automaticamente). Agora visite http://127.0.0.1:5000 em seu navegador da web
novamente e você verá nosso formulário básico em vez da string "Meu aplicativo de
frasco", como na imagem abaixo.

Ao usar o Codementor , você concorda com nossa


ACEITAR
Política de Cookies .
Gostou desta postagem?  100 66

https://www.codementor.io/@garethdwyer/building-a-crud-application-with-flask-and-sqlalchemy-dm3wv7yu2 7/26
16/10/2022 23:23 Building a CRUD application with Flask and SQLAlchemy | Codementor

Esta é uma caixa de entrada simples onde o usuário pode digitar texto e pressionar o
botão "Adicionar". Fazer isso enviará o texto para o back-end do nosso aplicativo e
nos deixará na mesma página. Antes de tentarmos, precisamos ajustar nosso código
de back-end para lidar com essa nova funcionalidade.

Manipulando a entrada no back-end


Você notará em nosso home.html modelo, tivemos a seguinte linha:

<form method="POST" action="/">

A method="POST" seção especifica que os dados no formulário devem ser enviados


usando HTTP POST . Por padrão, as rotas do Flask só aceitam solicitações HTTP GET .
Você pode ler sobre a diferença entre HTTP POST e HTTP GET neste tutorial da
w3schools . A única parte importante para nós é que, se enviarmos nosso formulário
no momento, receberemos um erro dizendo "Método não permitido". Portanto,
precisamos editar nosso bookmanager.py arquivo para contabilizar solicitações POST
para nosso aplicativo da web.

Adicione a seguinte linha à seção de importações de bookmanager.py

from flask import request

Isso importa o request módulo do Flask, o que nos permite lidar facilmente com
muitos aspectos das solicitações HTTP, incluindo dados enviados por meio de
formulários.

Agora, modifique a home() função para aceitar solicitações POST e receber a entrada
do nosso formulário. A nova função deve ter a seguinte aparência:

@app.route("/",
Ao usarmethods=["GET", "POST"])

o Codementor , você concorda com nossa


ACEITAR
Política de Cookies .
def home():

ifGostou desta postagem?


request.form:  100 66
print(request.form)

https://www.codementor.io/@garethdwyer/building-a-crud-application-with-flask-and-sqlalchemy-dm3wv7yu2 8/26
16/10/2022 23:23 Building a CRUD application with Flask and SQLAlchemy | Codementor
p ( q )
return render_template("home.html")

Vejamos o que essas mudanças fazem:

Adicionamos methods=["GET", "POST"]) ao nosso decorador de rotas. Isso


resolverá o erro "Método não permitido" que vimos se tentamos enviar o
formulário antes. Por padrão, o Flask aceita solicitações GET para todas as rotas,
então aqui estamos dizendo para permitir solicitações GET e POST.
Usamos if request.form para verificar se alguém acabou de enviar o formulário.
Se o fizeram, podemos acessar os dados que eles enviaram por meio da
request.form variável. Vamos apenas imprimi-lo por enquanto para ver se nosso
formulário está funcionando.

Reinicie o aplicativo da web, se necessário, e visite a página novamente. Digite algo


no campo de entrada e pressione o botão "Adicionar". No console, você deverá ver a
string digitada impressa como saída, como na imagem abaixo.

Flask representa todos os dados do formulário como um ImmutableMultiDict , que é


apenas um dicionário Python sofisticado. Ele armazenou a entrada do nosso usuário
como uma tupla, title sendo o nome que demos à nossa entrada no
home.html modelo e "teste" sendo a string que inseri no formulário.

Agora que podemos receber e processar a entrada do usuário, vamos aprender


como armazená-la.

Adicionando um banco de dados


Queremos lembrar a entrada de nossos usuários, então queremos poder adicionar
Ao usar o Codementor , você concorda com nossa
itens a um banco
Políticade
dedados.
CookiesUsaremos
. o popular banco de dadosACEITAR
SQLite , que vem
junto com a instalação
Gostou padrão do Python. É um banco de dados baseado
desta postagem?  100em 66
arquivos, para que possamos armazenar nossos dados em um arquivo em nosso
https://www.codementor.io/@garethdwyer/building-a-crud-application-with-flask-and-sqlalchemy-dm3wv7yu2 9/26
16/10/2022 23:23 Building a CRUD application with Flask and SQLAlchemy | Codementor

sistema de arquivos, sem a necessidade de instalar um enorme Sistema de


Gerenciamento de Banco de Dados Relacional (RDBMS). Usaremos o SQLite por  meio
do SQLAlchemy, que fornece uma abstração de nível superior. Isso significa que
poderíamos facilmente usar um banco de dados diferente, como PostgreSQL ou
MariaDB , e não precisaríamos alterar nossa base de código. SQLAlchemy também
nos permite fazer operações em nível de banco de dados de uma forma mais
Pythonica.

Configurando o Flask-SQLAlchemy
Como instalamos o SQLAlchemy e a extensão Flask Flask-SQLAlchemy no início deste
tutorial, podemos começar a usá-los agora. Precisamos configurar um banco de
dados, abrir uma conexão com ele e associar essa conexão ao nosso aplicativo da
web. Modifique a primeira parte do código em seu bookmanager.py arquivo (antes da
primeira definição de função) para ter a seguinte aparência.

import os

from flask import Flask

from flask import render_template

from flask import request

from flask_sqlalchemy import SQLAlchemy

project_dir = os.path.dirname(os.path.abspath(__file__))

database_file = "sqlite:///{}".format(os.path.join(project_dir, "bookdatabase.db


app = Flask(__name__)

app.config["SQLALCHEMY_DATABASE_URI"] = database_file

db = SQLAlchemy(app)

Vamos dar uma olhada rápida no que fizemos.

Na linha 1, adicionamos uma importação para a os biblioteca Python, que nos


permitirá acessar caminhos em nosso sistema de arquivos em relação ao diretório
do nosso projeto.
Na linha 7,
Aoimportamos a versão
usar o Codementor doconcorda
, você Flask docom
SQLAlchemy
nossa (precisávamos instalar o
ACEITAR
Política de e
Flask-SQLAlchemy o SQLAlchemy.
Cookies . Importamos apenas o Flask-SQLAlchemy, pois
isso Gostou
implicitamente estende e depende da instalação base do SQLAlchemy).
desta postagem?  100 66

N li h 9 10 d bi d tá i h d
https://www.codementor.io/@garethdwyer/building-a-crud-application-with-flask-and-sqlalchemy-dm3wv7yu2
j t 10/26
16/10/2022 23:23 Building a CRUD application with Flask and SQLAlchemy | Codementor
Nas linhas 9-10, descobrimos onde está o caminho do nosso projeto e
configuramos um arquivo de banco de dados com seu caminho completo e o
sqlite:/// prefixo para informar ao SQLAlchemy qual mecanismo de banco de
dados estamos usando.
Na linha 13, informamos à nossa aplicação web onde nosso banco de dados será
armazenado.
Na linha 15, inicializamos uma conexão com o banco de dados e mantemos isso
na db variável. Usaremos isso para interagir com nosso banco de dados.
Na linha 16, inicializamos o banco de dados

Esta é a configuração que precisamos para que nossa aplicação web interaja com
nosso banco de dados. Agora podemos definir o conceito de um livro e como vamos
armazená-lo em nosso banco de dados.

Adicionando um modelo ao nosso aplicativo da web

Para um aplicativo gerenciador de livros real, gostaríamos de modelar muitas


informações, como título do livro, autor, editora, contagem de páginas, data de
publicação etc. Para simplificar, vamos fingir que os livros têm apenas títulos
(também colocamos apenas um campo de entrada em nosso formulário front-end).
Adicione o código a seguir a bookmanager.py , que representa como armazenaremos
cada livro em nosso banco de dados. Certifique-se de adicionar o código abaixo da
db = SQLAlchemy(app) linha, pois usamos db para definir o modelo do livro.

class Book(db.Model):

title = db.Column(db.String(80), unique=True, nullable=False, primary_key=Tr


def __repr__(self):

return "<Title: {}>".format(self.title)

Há bastante coisa acontecendo nessas cinco linhas de código, então vamos separá-
las.

Na linha 1, criamos uma nova classe que herda de um modelo básico de banco de
dados, fornecido pelo SQLAlchemy. Isso também fará com que o SQLAlchemy crie
uma tabela chamada book , que será usada para armazenar nossos Book objetos.
Na linha 2, criamos um atributo do nosso livro chamado title . SQLAlchemy
Ao usar o Codementor , você concorda com nossa
usará issoPolítica
comode um ACEITAR que um
nome. de coluna em nossa book tabela. Dizemos
Cookies
títuloGostou
consiste empostagem?
desta String no máximo 80 caracteres, que nunca devemos
 100 66
armazenar dois ou mais livros com o mesmo título (os títulos dos livros devem ser
https://www.codementor.io/@garethdwyer/building-a-crud-application-with-flask-and-sqlalchemy-dm3wv7yu2 11/26
16/10/2022 23:23
(
Building a CRUD application with Flask and SQLAlchemy | Codementor

unique ), que todo livro precisa ter um título (o título não é nullable ), e que o

título é a principal forma de identificarmos um livro específico em nosso banco de
dados (o título é o primary_key ).
Nas linhas 4-5, definimos como representar nosso objeto livro como uma string.
Isso nos permite fazer coisas como print(book) , e ver uma saída significativa.

Criação e armazenamento de livros


Agora, quando um usuário insere um título de livro, podemos criar um Book objeto e
armazená-lo em nosso banco de dados. Para fazer isso, modifique a home() função
novamente para ter a seguinte aparência.

@app.route("/", methods=["GET", "POST"])

def home():

if request.form:
book = Book(title=request.form.get("title"))

db.session.add(book)

db.session.commit()

return render_template("home.html")

Agora, quando recebemos a entrada do usuário, não a imprimimos mais no console.


Em vez disso, pegamos a entrada "title" do nosso formulário e a usamos para
inicializar um novo Book objeto. Salvamos isso Book em uma variável chamada
book (linha 4).

Em seguida, adicionamos o livro ao nosso banco de dados e confirmamos nossas


alterações para mantê-las (linhas 5-6).

Você pode executar o código novamente neste ponto se quiser e tentar adicionar um
item por meio do formulário, mas receberá um erro porque ainda não terminamos
de configurar nosso banco de dados.

Inicializando nosso banco de dados


Ao usar o Codementor , você concorda com nossa
ACEITAR
A maior parte Política de Cookies
do nosso código . precisa ser executada toda vez que usamos nosso
Gostou desta postagem?  100
aplicativo. No entanto, precisamos executar algum código de configuração único. 66
E t i t d h ll P th di tó i d
https://www.codementor.io/@garethdwyer/building-a-crud-application-with-flask-and-sqlalchemy-dm3wv7yu2 j t 12/26
16/10/2022 23:23 Building a CRUD application with Flask and SQLAlchemy | Codementor
Execute os seguintes comandos em um shell Python no diretório do seu projeto para
criar nosso banco de dados e criar a book tabela onde armazenaremos nossos livros.

Você pode iniciar um shell Python executando python3 em seu console (certificando-
se de estar no diretório do projeto).

>>> from bookmanager import db

>>> db.create_all()

>>> exit()

Agora você pode visitar seu aplicativo da web novamente e enviar quantos títulos de
livros desejar. Agora terminamos a parte C de nosso aplicativo CRUD — podemos
criar livros. Em seguida, queremos poder lê -los novamente.

Recuperando livros de nosso banco de dados


Toda vez que o usuário visita nosso aplicativo da web, queremos obter todos os
livros atuais do banco de dados e exibi-los. O SQLAlchemy facilita o carregamento de
todos os livros armazenados em nosso banco de dados em uma variável Python.
Adicione uma linha para recuperar todos os livros antes do final da home() função e
modifique a última linha para passar esses livros para o nosso modelo de front-end.
As duas últimas linhas do home() deve ter a seguinte aparência.

books = Book.query.all()

return render_template("home.html", books=books)

Agora, atualize o home.html arquivo para renderizar cada um dos livros como HTML
usando um loop Jinja for. Enquanto estiver editando o arquivo, você também pode
adicionar alguns cabeçalhos para o formulário e a lista de livros que exibiremos.
Todo o código para home.html agora deve ter a seguinte aparência.

<html>

<body>

<h1>Add book</h1>

<form method="POST" action="/">

<input type="text" name="title">

Ao usar
<input o Codementor ,value="Add">

type="submit" você concorda com nossa


ACEITAR
Política de Cookies .
</form>


Gostou desta postagem?  100 66
<h1>Books</h1>
https://www.codementor.io/@garethdwyer/building-a-crud-application-with-flask-and-sqlalchemy-dm3wv7yu2 13/26
16/10/2022 23:23 Building a CRUD application with Flask and SQLAlchemy | Codementor
<h1>Books</h1>

{% for book in books %}


<p>{{book.title}}</p>

{% endfor %}

</body>

</html>

As linhas 9-12 percorrem todos os livros que passamos do código de back-end e


exibem cada título em um novo parágrafo HTML. A sintaxe do Jinja é muito parecida
com a do Python, mas tem algumas diferenças. Usamos {% para indicar que
estamos usando um padrão de controle Jinja (neste caso, um loop for), e usamos
{{ para indicar que estamos nos referindo a uma variável em vez de uma string
bruta. Também precisamos usar {% endfor %} para fechar nosso loop for porque,
ao contrário do Python, Jinja não considera o espaço em branco como significativo.

Salve o modelo e recarregue o aplicativo em seu navegador. Agora você deve


conseguir visualizar os livros à medida que os adiciona, como na imagem abaixo.

Ao usar o Codementor , você concorda com nossa


ACEITAR
Política de Cookies .
Gostou desta postagem?  100 66

I é CR d CRUD f i l ilh d d i l
https://www.codementor.io/@garethdwyer/building-a-crud-application-with-flask-and-sqlalchemy-dm3wv7yu2 li A i 14/26
16/10/2022 23:23 Building a CRUD application with Flask and SQLAlchemy | Codementor
Isso é CR de CRUD feito e polvilhado - agora podemos criar e ler livros. A seguir,
veremos como Atualizar os títulos dos livros existentes. 

Atualizando títulos de livros


A atualização de dados existentes é o processo mais complicado. Como estamos
mostrando apenas uma representação do front-end de dados, o usuário não pode
editá-lo diretamente. Em vez disso, precisamos que nossos usuários enviem um
título atualizado enquanto acompanhamos o título antigo. Então, em nosso código
de back-end, podemos recuperar o livro correto com base no título antigo e atualizá-
lo para o título enviado pelo usuário.

Como o usuário não vai querer digitar o título antigo e o novo, vamos transformar
cada título em seu próprio formulário. Dessa forma, quando o usuário enviar o novo
título, podemos obter automaticamente o título antigo também. Faremos isso com
uma hidden entrada HTML para que possamos recuperar o back-end de título antigo
sem sobrecarregar nosso front-end de interface do usuário.

Modifique o loop for no home.html para ter a seguinte aparência.

{% for book in books %}

<p>{{book.title}}</p>

<form method="POST" action="./update">

<input type="hidden" value="{{book.title}}" name="oldtitle">

<input type="text" value="{{book.title}}" name="newtitle">

<input type="submit" value="Update">

</form>

{% endfor %}

O formulário é muito semelhante ao nosso formulário anterior que usamos para


adicionar novos livros. Algumas diferenças importantes são:

Na linha 3, especificamos que este formulário deve postar seus dados na


/update rota, em vez de na nossa / rota base. (Ainda não definimos a
/update rota. Faremos isso abaixo).

Na linha 4, incluímos uma hidden entrada pré-preenchida com o título "antigo" do


livro. Esta seção do formulário não será mostrada ao nosso usuário, mas
poderemos acessar o valor do nosso código Python.

Ao usar o Codementor , você concorda com nossa


Agora precisamos atualizar nosso código Python para lidar com essa
Política de Cookies .
nova
ACEITAR
funcionalidade. Adicione
Gostou desta a seguinte seção de importação para importações
postagem?  100 66
de bookmanager.py
https://www.codementor.io/@garethdwyer/building-a-crud-application-with-flask-and-sqlalchemy-dm3wv7yu2 15/26
16/10/2022 23:23 Building a CRUD application with Flask and SQLAlchemy | Codementor


from flask import redirect

E agora adicione a seguinte rota e definição de função ao bookmanager.py arquivo.

@app.route("/update", methods=["POST"])

def update():

newtitle = request.form.get("newtitle")
oldtitle = request.form.get("oldtitle")
book = Book.query.filter_by(title=oldtitle).first()

book.title = newtitle

db.session.commit()

return redirect("/")

Esta função é semelhante a essa home() , mas em vez de criar livros, ela

Obtém o título antigo e atualizado do formulário (linhas 3-4)


Busca o livro com o título antigo do banco de dados (linha 5)
Atualiza o título desse livro para o novo título (linha 6)
Salva o livro no banco de dados (linha 7)
Redireciona o usuário para a página principal

Recarregue o aplicativo em seu navegador e você verá uma página semelhante à


mostrada na captura de tela abaixo. Você pode alterar os títulos de qualquer um dos
livros existentes modificando o texto no campo de entrada diretamente abaixo do
Ao usar o Codementor , você concorda com nossa
título e pressionando o botão. "Atualizar". ACEITAR
Política de Cookies
Gostou desta postagem?  100 66

https://www.codementor.io/@garethdwyer/building-a-crud-application-with-flask-and-sqlalchemy-dm3wv7yu2 16/26
16/10/2022 23:23 Building a CRUD application with Flask and SQLAlchemy | Codementor

Ao usar o Codementor , você concorda com nossa


ACEITAR
Política de Cookies .
Gostou desta postagem?  100 66

https://www.codementor.io/@garethdwyer/building-a-crud-application-with-flask-and-sqlalchemy-dm3wv7yu2 17/26
16/10/2022 23:23 Building a CRUD application with Flask and SQLAlchemy | Codementor


Agora que temos CRU fora do caminho, a última coisa que precisamos fazer é Excluir
livros que não queremos mais.

Excluindo livros do nosso banco de dados


Excluir livros é muito semelhante a atualizá -los, mas não precisamos nos preocupar
em pedir ao usuário que insira um novo título.

No home.html arquivo, adicione outro formulário dentro do for loop, diretamente


abaixo do formulário Update. Isso deve ter a seguinte aparência.

<form method="POST" action="./delete">

<input type="hidden" value="{{book.title}}" name="title">

<input type="submit" value="Delete">

</form>

E adicione uma /delete rota e uma função ao bookmanager.py arquivo, que deve ter
a seguinte aparência.

@app.route("/delete", methods=["POST"])

def delete():

title = request.form.get("title")

book = Book.query.filter_by(title=title).first()

db.session.delete(book)

db.session.commit()

return redirect("/")

Isso é muito parecido com nossa /update rota, mas usamos


db.session.delete(book) a linha 5 para remover o livro do banco de dados, em vez
de atualizar Ao
seuusar
título.
o Codementor , você concorda com nossa
ACEITAR
Política de Cookies .
Gostou
Recarregue desta
seu postagem?
aplicativo  100
da web novamente e você verá um botão "Excluir" abaixo
66
de cada livro Pressione isso e você verá o livro desaparecer
https://www.codementor.io/@garethdwyer/building-a-crud-application-with-flask-and-sqlalchemy-dm3wv7yu2 18/26
16/10/2022 23:23 Building a CRUD application with Flask and SQLAlchemy | Codementor
de cada livro. Pressione isso e você verá o livro desaparecer.

Ao usar o Codementor , você concorda com nossa


ACEITAR
Política de Cookies .
Isso é cada uma
Gostou daspostagem?
desta operações CRUD feitas! Agora você tem os blocos de construção
 100 66
básicos para construir qualquer aplicativo da Web que desejar.
https://www.codementor.io/@garethdwyer/building-a-crud-application-with-flask-and-sqlalchemy-dm3wv7yu2 19/26
16/10/2022 23:23
p q qBuilding pa CRUD application with Flask
q and SQLAlchemy
j | Codementor


Toques finais
Não pretendíamos construir uma aplicação web útil e bonita, mas podemos fazer um
ou dois pequenos retoques para melhorar o layout e a funcionalidade do que temos.
Se quisermos exibir o título do livro, a atualização e os botões de exclusão em uma
única linha, podemos colocar os livros em uma tabela HTML, com cada livro em uma
nova linha e as diferentes seções em colunas diferentes.

Para fazer isso, atualize o home.html arquivo para ter a seguinte aparência.

<html>

<body>

<h1>Add book</h1>

<form method="POST" action="/">

<input type="text" name="title">

<input type="submit" value="Add">

</form>

<h1>Books</h1>

<table>

{% for book in books %}

<tr>

<td>

{{book.title}}

</td>

<td>

<form method="POST" action="./update" style="display: inline">

<input type="hidden" value="{{book.title}}" name="oldtitle">

<input type="text" value="{{book.title}}" name="newtitle">


<input type="submit" value="Update">

</form>

</td>

<td>

<form method="POST" action="./delete" style="display: inline">

<input
Ao usar type="hidden"
o Codementor value="{{book.title}}"
, você concorda com nossa name="title">

<input type="submit" value="Delete">


ACEITAR
Política de Cookies .
Gostou </form>

desta postagem?  100 66


</td>

https://www.codementor.io/@garethdwyer/building-a-crud-application-with-flask-and-sqlalchemy-dm3wv7yu2 20/26
16/10/2022 23:23 Building a CRUD application with Flask and SQLAlchemy | Codementor

</tr>

{% endfor %}

</table>

</body>

</html>

Se você nunca fez HTML antes, talvez queira passar rapidamente por um tutorial
específico de HTML. As partes importantes do código acima são:

Na linha 10, iniciamos a tabela


Na linha 12, iniciamos uma nova linha (para cada livro, pois está dentro do loop
for)
Nas linhas 13, 16 e 23, iniciamos as três colunas separadas da tabela. Estes são
para o título, o botão de atualização e o botão de exclusão, respectivamente.

Nas linhas 17 e 24, adicionamos um style componente aos nossos formulários


HTML para dizer que não queremos exibir cada um em uma nova linha.

Se você recarregar o aplicativo agora, verá que o layout mudou, como na imagem
abaixo.

Ao usar o Codementor , você concorda com nossa


ACEITAR
Política de Cookies .
Gostou desta postagem?  100 66

https://www.codementor.io/@garethdwyer/building-a-crud-application-with-flask-and-sqlalchemy-dm3wv7yu2 21/26
16/10/2022 23:23 Building a CRUD application with Flask and SQLAlchemy | Codementor

A última melhoria que faremos é adicionar algum tratamento de erros. Quando


estávamos configurando o banco de dados, especificamos que os títulos dos livros
deveriam ser únicos. Se tentarmos criar um livro duplicado ou atualizar um título
existente para um que já existe, interromperemos nosso aplicativo. Adicione um
try: except: bloco ao redor das funções home() e update() para explicar isso. O
código final para ambos deve ter a seguinte aparência.

@app.route('/', methods=["GET", "POST"])

def home():

books = None

if request.form:
try:

book = Book(title=request.form.get("title"))

db.session.add(book)

db.session.commit()

except Exception as e:

print("Failed to add book")

print(e)

books = Book.query.all()

return render_template("home.html", books=books)

@app.route("/update", methods=["POST"])

def update():

try:

newtitle = request.form.get("newtitle")

oldtitle = request.form.get("oldtitle")

book = Book.query.filter_by(title=oldtitle).first()

book.title = newtitle

db.session.commit()

except Exception as e:

print("Couldn't update book title")

print(e)

Ao usar o Codementor , você concorda com nossa


return Política
redirect("/")
ACEITAR
de Cookies .
Gostou desta postagem?  100 66

https://www.codementor.io/@garethdwyer/building-a-crud-application-with-flask-and-sqlalchemy-dm3wv7yu2 22/26
16/10/2022 23:23 Building a CRUD application with Flask and SQLAlchemy | Codementor


Claro, há muito mais melhorias que você pode fazer. Se você deseja estender o
aplicativo, você pode:

Adicione mais componentes aos livros, incluindo Autor, Editor e Data de


publicação.
Divida Autor e Editor em suas próprias tabelas, de modo que possamos
representar relacionamentos complicados entre livros e autores e editores (cada
autor pode ter muitos editores e muitos livros; cada livro pode ter muitos autores
e editores; cada editor pode ter muitos autores e livros).
Exiba mensagens de erro para o usuário em vez de apenas registrá-las e ignorá-las
no código de back-end.
Torne o aplicativo mais esteticamente agradável adicionando algum CSS, seja CSS
personalizado ou por meio de um framework como o Bootstrap .

Se você gostou deste post, e quer saber mais sobre o Flask, dê uma olhada no meu
livro Flask by Example . Nele, eu acompanho você na construção de três aplicativos
Web divertidos e úteis e mostro como implantar aplicativos Flask em um Servidor
Privado Virtual para que eles possam ser acessados ​por qualquer pessoa pela
Internet.

Se você tiver alguma dúvida sobre este post, sinta-se à vontade para comentar
abaixo ou entrar em contato comigo no Twitter .

Crud Frasco Sqlalchemy Sqlite

Gostou desta postagem? Dê um like no Gareth Dwyer se for útil.

 100 66  COMPARTILHAR

Ao usar o Codementor , você concorda com nossa


ACEITAR
Política de Cookies .
Gostou desta postagem?  100 66
Gareth Dwyer
https://www.codementor.io/@garethdwyer/building-a-crud-application-with-flask-and-sqlalchemy-dm3wv7yu2 23/26
16/10/2022 23:23 Building a CRUD application with Flask and SQLAlchemy | Codementor

Pythoneer e Escritor

Ei, eu sou Gareth. Eu amo ensinar e a maioria das coisas Python. Tenho experiência geral
na resolução de problemas, construção de soluções escaláveis ​e posso fornecer
conselhos específicos ou gerais.

SEGUIR

66 Respostas

Deixe uma resposta

Joshua Bognet 8 meses atrás 


Este deve ser o tutorial mais explicado e fácil que encontrei… impressionante
 Responder

sumati um ano atrás 


Obrigado pelo artigo .é realmente ótimo e fácil de entender.
 Responder

SAYON SAI DUTTA 2 anos atrás 


Muito útil!
 Responder

Mostrar mais respostas

Encontre um parceiro de
Ao usar o Codementor , você concorda com nossa
Política de Cookies .
ACEITAR

programação em pares no
Gostou desta postagem?  100 66

https://www.codementor.io/@garethdwyer/building-a-crud-application-with-flask-and-sqlalchemy-dm3wv7yu2 24/26
16/10/2022 23:23 Building a CRUD application with Flask and SQLAlchemy | Codementor

Codementor 

Quer melhorar suas habilidades de programação? Escolha entre


mais de 10.000 mentores para combinar com o programa.

INICIAR

Adi Chirilov - Sm0ke

(VÍDEO) Gerador e Visualização da API Flask - Produto


Gratuito

Olá codificadores!

O material de vídeo mencionado neste artigo explica como interagir com uma API
gerada pelo Flask usando a visualização da API, uma página simples que permite
adicionar, editar e remover itens. O produto aprimorado com esse recurso, Soft UI
Dashboard , pode ser baixado do Github e usado em produção, projetos comerciais
ou atividades de eLearning. Para os recém-chegados, o Flask é uma estrutura de
back-end líder com suporte ativo e versionado por especialistas em programação.

👉 [Flask Soft UI Dashboard](https://gi...


CONSULTE MAIS INFORMAÇÃO

Ao usar o Codementor , você concorda com nossa


ACEITAR
Política de Cookies .
Gostou desta postagem?  100 66

https://www.codementor.io/@garethdwyer/building-a-crud-application-with-flask-and-sqlalchemy-dm3wv7yu2 25/26
16/10/2022 23:23 Building a CRUD application with Flask and SQLAlchemy | Codementor

Seja destaque para empresas e consiga um emprego em 14 dias 🔥


Conheça empresas selecionadas que contratam ativamente desenvolvedores remotos agora mesmo. 

Saber mais

Ao usar o Codementor , você concorda com nossa


ACEITAR
Política de Cookies .
Gostou desta postagem?  100 66

https://www.codementor.io/@garethdwyer/building-a-crud-application-with-flask-and-sqlalchemy-dm3wv7yu2 26/26

Você também pode gostar