Una pequeña introducción a una gran microframework

por Javier Luna Molina

Aprenderemos a...

Flask 101: Programar un pequeño servidor

Hacer uso de templates con Jinja 2

Hacer uso de SQLAlchemy como ORM para almacenar nuestros datos

Gestionar sesiones de usuario de una forma segura

Estructurar bien nuestra aplicación. ¿Es Flask escalable?

Diseñar e implementar una API REST

Aprenderemos a...

Hacer un blog!

https://github.com/JavierLuna/talentum-flask-tutorial

Situación actual

Situación actual (real)

¿Por qué Flask?

Rápido, ligero y directo
Se adapta mejor a tu manera de pensar
Funciona muy bien con módulos de terceros
Módulos muy fáciles de programar (y comunidad muy activa)

Flask 101

Hola mundo

Flask 101

Hola mundo!

from flask import Flask

app = Flask(__name__)

@app.route('/')
def hello_world():
    return "Hello world!"

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

Hola mundo!

...

@app.route('/')
def hello_world():
    return "Hello world!"

...

Rutas

Flask 101

Rutas

...

@app.route('/')  #http://localhost:5000/ -> Hello world!
def hello_world():
    return "Hello world!"

...

Rutas


@app.route('/')  #http://localhost:5000/ -> Hello world!
@app.route('/index') #http://localhost:5000/index -> Hello world!
@app.route('/hello/world') #http://localhost:5000/hello/world -> Hello world!
def hello_world():
    return "Hello world!"


print(app.url_map)

Map([<Rule '/hello/world' (OPTIONS, GET, HEAD) -> hello_world>,
 <Rule '/index' (OPTIONS, GET, HEAD) -> hello_world>,
 <Rule '/' (OPTIONS, GET, HEAD) -> hello_world>,
 <Rule '/static/<filename>' (OPTIONS, GET, HEAD) -> static>])

Rutas: Wildcards

Flask 101

Rutas: Wildcards

Estructura:

@app.route('/<variable>/<variable2>')
def vista(variable, variable2):
    return ""

Wildcards "tipadas":

@app.route('/<int:variable>/<variable2>')
def vista(variable, variable2):
    return ""

# /1/hola -> 200 OK
# /hola/paco -> 404 Not found

Rutas: Wildcards


@app.route('/')  #http://localhost:5000/ -> Hello world!
def hello_world():
    return "Hello world!"

@app.route('/<name>') #http://localhost:5000/paco -> Hello paco 
def hello_name(name):
    return "Hello " + name

@app.route('/<name>/<int:times>') #http://localhost/paco/2 -> Hello paco paco 
def hello_name2(name, times): #times es de tipo int
    return "Hello ".join([name+" " for i in range(times)].strip()

Respuestas

Flask 101

Respuestas


@app.route('/')
def hello_world():
    return "Hello world!"


<html>
    <head></head>
    <body>
        Hello world!
    </body>
<html>

Respuestas

@app.route('/')
def hello_world():
	return """
        <html>
	    <head>
		<title>HELLO WORLD</title>
	    </head>
	    <body>
		<h1>HELLO WORLD!!!!</h1>
		<a href="http://www.disneylandparis.es/">Go to disneyland now</a>
	    </body>
	</html>
	"""

Respuestas: JSON

from flask import Flask, jsonify

...

@app.route('/json')
def hello_json():
	return jsonify({'hello':'json!'})

#http://localhost:5000/json -> {'hello':'json!'} 200 OK

Respuestas: 301(redirect)

from flask import Flask, redirect

...

@app.route('/disney')
def goto_disney():
	return redirect('http://www.disneylandparis.es/')

#http://localhost:5000/disney -> 301 Moved permanently 
# -> http://www.disneylandparis.es/

Respuestas: 301(redirect)

from flask import Flask, redirect

...

@app.route('/')
def index():
	return "<h1> I'm a cool ass index </h1>"

@app.route('/index')
def redirect_to_index():
        return redirect('/')

@app.route('/indice')
def redirect_to_index2():
        return redirect('http://localhost:5000/')

@app.route('/illo')
def redirect_to_index3():
        return redirect('/')

Métodos HTTP

Flask 101

Métodos HTTP

GET: Leer
POST: Crear
PUT: Actualizar
PATCH: Actualizar parcialmente
DELETE: Borrar

Métodos HTTP

from flask import Flask, request, redirect
...
@app.route('/login', methods=['GET', 'POST'])
def login():
	if request.method == 'POST':
		username = request.form['username']
		password = request.form['password']
		if username == 'admin' and password == 'hunter02':
			return redirect('/admin')
		else:
			return """<p>Ha habido un error con tus datos de login</p>
					  <a href='/login'> Vuelve a intentarlo</a>"""
	return """
		<form action="/login" method='POST'>
            Username:<br>
            <input type="text" name="username"><br>
            Password:<br>
            <input type="password" name="password">
            <input type="submit" value="Login">
		</form>
	"""

Métodos HTTP

GET /login

200 OK

POST /login

username: admin

password: hunter02

¿Datos correctos?

Sí

301 Redirect a /admin

GET /admin

200 OK

Error handling

Flask 101

Error handling: 404, 500...

http://localhost:5000/hola-mundo-mio

Not Found

The requested URL was not found on the server. If you entered the URL manually please check your spelling and try again.

Error handling: 404, 500...

@app.errorhandler(404)
def page_not_found(e):
	return "<h1>La página no está, sorry :(</h1>", 404

La página no está, sorry :(

Error handling: 404, 500...

@app.errorhandler(500)
def page_not_found(e):
	return """
		<html>
		<head><title>Illo :(</title></head>
		<body>
			<h1>El servidor ha petado cosa mala</h1>
			<p>Gracias</p>
		</body>
		</html>
	""", 500

Error handling: Excepciones

@app.route('/<item>')
def yield_item(item):
	valor = {'hola': 'mundo'}
	return valor[item]

@app.errorhandler(KeyError)
def key_error(e):
	return "<h1>Key error</h1>", 500

# /hola -> "mundo" 200 OK
# /mundo -> <h1>Key error </h1> 500 Internal Server Error

Generar URLs

Flask 101

from flask import Flask, redirect

...

@app.route('/')
def index():
	return "<h1> I'm a cool ass index </h1>"

@app.route('/index')
def redirect_to_index():
        return redirect('/')

@app.route('/indice')
def redirect_to_index2():
        return redirect('http://localhost:5000/')

@app.route('/illo')
def redirect_to_index3():
        return redirect('/')

Ejemplo de antes

from flask import Flask, redirect

...

@app.route('/coolassindex')
def index():
	return "<h1> I'm a cool ass index </h1>"

@app.route('/index')
def redirect_to_index():
        return redirect('/')

@app.route('/indice')
def redirect_to_index2():
        return redirect('http://localhost:5000/')

@app.route('/illo')
def redirect_to_index3():
        return redirect('/')

Si cambiamos la ruta...

Solución: Generar las URLs

url_for(endpoint)

from flask import Flask, redirect, url_for

...

@app.route('/coolassindex')
def index():
	return "<h1> I'm a cool ass index </h1>"

@app.route('/holaa')
def redirect_to_index():
        return redirect(url_for('index'))

# url_for('index') -> /coolassindex

url_for() con wildcards

from flask import Flask, redirect, url_for

...

@app.route('/hello/<name>')
def hola_illo(name):
    return "Hello "+name

@app.route('/')
    return redirect(url_for('hola_illo', name="World!"))

#url_for('hola_illo', name="Paco") -> /hello/paco
#url_for('hola_illo', name="Paco", _external=True) 
#-> http://localhost:5000/hello/paco

¡Felicidades!

Ya sabes un 80% de Flask

Ejercicio

Lista de comentarios

Programar un servidor que te muestre una serie de comentarios y te permita añadir un comentario usando un formulario

Ejercicio

Lista de comentarios

<html>
<head><title>Comentarios cool</title></head>
<body>
	<form action="/comment" method="POST">
		<h3>Comenta:</h3>
		<input type="text" name="comment">
		<input type="submit" name="submit">
	</form>
	<br>
	<h3>Comentarios</h3>
	<ul>
<!-- Aquí es donde tenéis que poner vuestros comentarios -->
		<li>Comentario1</li> 
		<li>Comentario2</li>
	</ul>
</body>
</html>

Solución

Lista de comentarios

from flask import Flask, request, redirect, url_for

app = Flask(__name__)

comments = []

plantilla = """
<html>
<head><title>Comentarios cool</title></head>
<body>
	<form action="RUTA" method="POST">
		<h3>Comenta:</h3>
		<input type="text" name="comment">
		<input type="submit" name="submit">
	</form>
	<br>
	<h3>Comentarios</h3>
	<ul>
		COMENTARIOS
	</ul>
</body>
</html>
"""

...

Solución (parte I)

...


@app.route('/')
def index():
	html_comments = "".join(["<li>"+comment+"</li>\n" for comment in comments])
	return plantilla.replace("COMENTARIOS", html_comments).replace('RUTA', url_for('create_comment'))

@app.route('/comment', methods=['POST'])
def create_comment():
	comment = request.form['comment']
	global comments
	comments.append(comment)
	return redirect(url_for('index'))

app.run(debug=True)

Solución (parte II)

Jinja2 Templates

@app.route('/')
def hello_world():
    return """
        <html>
	    <head>
		<title>HELLO WORLD</title>
	    </head>
	    <body>
		<h1>HELLO WORLD!!!!</h1>
		<a href="http://www.disneylandparis.es/">Go to disneyland now</a>
	    </body>
	</html>
	"""

La chapuza del siglo

@app.route('/')
def hello_world():
    content = ""
    with open('helloworld.html') as file:
        content = file.read()
    return content

Una posible solución...

Jinja2 saves the day!

Qué nos ofrece Jinja...

Una forma rápida, flexible y segura de generar páginas mediante plantillas
Cierta lógica
Herencia e inclusión
Macros
Filtros

Cargar plantillas desde Flask

from flask import Flask, render_template
...

@app.route('/')
def hello_world():
    return render_template('helloworld.html')

Sintáxis

Jinja2

Sintáxis

{{ expresión }} - Representar el resultado en el contenido final
{% código %} - Ejecución de código
{# comentario #} - Comentarios no incluidos en el contenido final

<html>
    <head>
        <title>Hello {{ name }}</title>
    </head>
    <body>
        Hello {{ name }}!!
    </body>
</html>

hello_world.html

app.py

from flask import Flask, render_template

...

@app.route('/<someones_name>')
def hello_name(someones_name):
    return render_template('hello_world.html',
                             name=someones_name)

{% código %}

{% if <condición> %}

<html>
    <head>
        <title> Hello {{ name }} </title>
    </head>
    <body>
        <p>Hello {{ name }}!</p>
        {% if yearsold > 90 %}
           <p> Damn, you're old! </p>
        {% elif yearsold < 4 %}
           <p> You're too young!!</p>
        {% else %}
           <p> Glad you're here </p>
        {% endif %}
    </body>
</html>

{% for element in collection %}

<html>
    <head>
        <title> Hello {{ name }} </title>
    </head>
    <body>
        <p>Hello {{ name }}!</p>
        <p>These are my friends:</p>
        <ul>
        {% for friend in friends %}
            <li>{{ friend }}</li>
        {% endfor %}
        </ul>
    </body>
</html>

hello_friends.html

{% for element in collection %}

app.py

from flask import Flask, render_template

...

@app.route('/')
def hello_name(someones_name):
    return render_template('hello_friends.html',
                             name="Pablo", 
                             friends=["Gustavo", "Poison", "Blackie"])