Flask Básico: crie seu primeiro aplicativo

Flask Básico: crie seu primeiro aplicativo

Esse é um post é um breve tutorial de como usar o flask para fazer seu sites e projetos utilizando Python. Você irá criar um aplicativo básico que irá fazer inicialmente uma aplicação que retorna um texto plano, depois retornar um JSON que é o formato das REST APIs e no final a renderização de um conteúdo em HTML, que é o suficiente para entender os fundamentos de uso do Flask.

Sobre a solução

Flask é um microframework Web em Python, sendo assim ele possui somente os recursos básicos para a criação de páginas Webs e APIs, como por exemplo: Renderização de HTML, Rotas, Views e JSON, caso mais coisas sejam necessárias todas elas podem ser instaladas via pip.

Algumas das muitas extensões podem ser encontradas na página oficial.

Mão na massa

A primeira coisa a se fazer é instalar o pacote:

pip install flask

Segue abaixo a estrutura mínima para uma aplicação:

#!/usr/bin/python

from flask import Flask

app = Flask(__name__)

@app.route("/")
def index():
    return "Hello!"

if __name__ == '__main__':
    app.run(debug=True)

Você pode jogar esse código em um arquivo chamado run.py, esse será o arquivo principal da sua aplicação, pois é ele que vamos executar e ele será responsável por chamar os próximos.

Entendendo um pouco do código.

app = Flask(__name__)

Na linha acima é instanciado um objeto da classe Flask, é ele que vamos utilizar para configurar a nossa aplicação e para executá-la com o servidor de testes padrão da ferramenta.

@app.route("/")

É um decorator responsável por interpretar a rota que acessamos, então assim que é acessada a url / como é configurado na linha acima, a função que está abaixo é responsável por enviar uma rota ao navegador.

def index():
    return "Hello!"

É a função que tem como objetivo retornar somente um texto plano como Hello.

if __name__ == '__main__':
    app.run(debug=True)

Essas instruções definem que quando o run.py for executado via linha de comando, o serviço deverá iniciar o seu servidor interno para executar a aplicação, como no construtor foi passado o valor True para a chave debug, o servidor será iniciado no modo debug, assim quando forem feitas modificações no código e elas forem salvas o servidor irá reiniciar automaticamente para que você possa testar o novo código.

Esse é o código mais básico que se pode.

Para acessar a sua aplicação, você pode acessar o endereço:

http://localhost:5000

5000 é a porta padrão do Flask, você pode mudá-la passando o parâmetro port no construtor, deixando ele da seguinte forma:

if __name__ == '__main__':
    app.run(debug=True,port=6543)

Padrão de retorno

Normalmente não retornamos um texto plano para o navegador e sim uma resposta em HTML, JSON ou até mesmo XML em caso de Webservices SOAP.

Para retornar um tipo JSON para o navegador, é necessário fazer o import do módulo jsonify.

Para isso logo após o import coloque uma vírgula e digite jsonify, ficando assim da seguinte forma:

from flask import Flask,jsonify

Esse recurso do Flask recebe como parâmetro um dicionário que será automaticamente convertido como JSON.

Assim mude a função index para ficar da seguinte maneira:

@app.route("/")
def index():
    return jsonify({"message":"Hello Json!"})

Salve o arquivo e veja que o servidor será reiniciado automaticamente, então acesse o navegador e veja como ficou.

Agora caso você queira retornar uma página em HTML, você precisará fazer o import do módulo render_template e isso é feito da mesma maneira em que foi feito o jsonify.

from flask import Flask,render_template

Por padrão será considerado o diretório template na mesmo diretório onde você está executando o arquivo run.py.

Então crie uma pasta template e dentro dela crie um página chamada index.html

Dentro dela você pode colocar o seguinte código:

<h1>Pagina HTML e Flask</h1>

Salve o código.

Agora vamos voltar para o python.

Na função onde você editou o return para jsonify, mude-o agora para render_template e coloque como valor index.html.

O código ficará assim:

@app.route("/")
def index():
    return render_template("index.html")

A solução já imagina que o arquivo html foi colocado dentro de templates, não é necessário passar o caminho completo do arquivo.

Salve o arquivo e teste no navegador novamente.

O Jinja2

O Flask trabalha com uma linguagem de template chamada Jinja2, ela serve para que possamos gerar o nosso arquivo HTML de forma dinâmica, assim é possível passar variáveis com valores no retorno da função e interpreta-los através do Jinja2.

Edite a função index deixando ela conforme o exemplo abaixo:

@app.route("/")
def index():
    nome = "Alisson"
    posts = ["Flask Basico","Flask Intermediario","Flask Avancado"]
    return render_template("index.html",nome=nome,posts=posts)

Talvez esse return tenha ficado um pouco confuso pois usei variáveis com o mesmo nome para os parâmetros chave/valor.

Após a definição de qual será a página html renderizada é possível passar variáveis do tipo dicionário como parâmetros para que elas possam ser utilizadas no nosso arquivo html.

Explicando melhor, quando vemos: nome=nome, isso significa que nome o primeiro, antes do sinal de igual, é a chave de um dicionário.

Então ele pode ser entendido da seguinte forma:

{"nome":}

O segundo nome, depois do sinal de igual é a variável nome declarada dentro da função, que tem o valor Alisson, assim o nosso dicionário ficou da seguinte forma:

{"nome":nome}

Caso eu queira traduzir interpretar o código ele ficou assim:

{"nome":"Alisson"}

E isso será retornado para que o Jinja2 possa utilizar e depois gerar o HTML.

A mesma coisa serve para a variável posts, porém no caso ela é uma lista e não uma string como no caso de nome.

Feito isso, salve o arquivo e agora edite o index.html, deixando ele da seguinte forma:

<h1>Blog do {{nome}}</h1>
<h4>Posts Recentes</h4>
<ul>
<ul>
{% for post in posts %}
<li>{{post}}</li>
{% endfor %}

Salve o HTML também e teste no navegador.

Você verá que as variáveis foram substituídas pelos valores no código, o Jinja2 entende os dicionários que foram passados através da função render_template e pode trazer os valores para o HTML.

Quando temos dicionários simples, como no caso de:

{"nome":"Alisson"}

Você pode chamar a chave nome dentro do html entre esses caracteres {{ variável }}, assim quando o html for carregado irá trazer o valor que corresponde a essa chave.

No caso da lista foi necessário efetuar um laço for para percorrer a lista em python e gerar uma lista em HTML.

No Jinja2 é possível fazer condições utilizando ifs e loopings utilizando for e while.

Caso vocẽ queira saber mais sobre o Jinja2 é só acessar a documentação.

Para saber mais sobre o Flask, você pode consultar a documentação oficial.

Mas vou fazer mais alguns posts explicando como eu utilizo o Flask no meu dia a dia e ensinando vocês a utilizarem também.

Até mais.

Anterior JSON e BSON no MongoDB: para iniciantes
Próxima Vagrant: Crie ambientes de Desenvolvimento Ágil

About author

Alisson Machado
Alisson Machado 15 posts

Alisson Menezes, atua como Gerente de T.I, 9 anos de experiência em projetos FOSS (Free and Open Source Software) e Python. Formação em Análise de Sistemas pela FMU e cursando MBA em BigData pela FIA, possui certificações LPI1, LPI2 e SUSE CLA, LPI DevOps e Exim - DevOps Professional. Autor dos cursos Python Fundamentals, Python for Sysadmins, MongoDB for Developers/DBAs, DevSecOps, Co-Autor do Infraestrutura Ágil e Docker da 4Linux e palestrantes em eventos como FISL, TDC e Python Brasil. É entusiasta das mais diversas áreas em T.I como Segurança, Bancos de dados NoSQL, DataScience mas tem como foco DevOps e Automação.

View all posts by this author →

Você pode gostar também

Desenvolvimento

Por que aprender front-end ?

A internet já foi palco de muitas revoluções, sempre impulsionadas por um mercado havido em atender usuários cada vez mais conectados. Mas foi nos últimos anos que a web explodiu

Desenvolvimento

Bootstrap: torne seus sites responsivos

O Bootstrap é um framework front-end utilizado para criar sites responsivos. Neste pequeno artigo ofereço um guia fundamental sobre este recurso para ajudá-lo deixar seus sites compatíveis com qualquer dimensão

Desenvolvimento

Ferramentas para testar sua API

Quando estamos construindo uma API precisamos fazer uma simulação das requisições que serão feitas por agentes externos. Como uma API não tem um HTML diante de nós, como simular essas