No tienes acceso a esta clase

¡Continúa aprendiendo! Únete y comienza a potenciar tu carrera

Curso de Flask

Curso de Flask

Bernardo Cassina

Bernardo Cassina

Implementación de Flask-Bootstrap y Flask-WTF

17/36
Recursos

Aportes 42

Preguntas 7

Ordenar por:

Los aportes, preguntas y respuestas son vitales para aprender en comunidad. Regístrate o inicia sesión para participar.

Hecho un camino duro pero que valdrá la pena

Un aporte para automatizar, en windows lo puedes realizar con la consola de git

creas un archivo .sh con lo siguiente

#!/bin/bash
venv/Scripts/activate

pip install -r requeriments.txt

export FLASK_APP=main.py
export FLASK_DEBUG=1
export FLASK_ENV=development

flask run

Fue complicado pero logré aplicar cambios en el css de los componentes del formulario y seguir utilizando quick_form lo dejo aquí

después de horas para correr esto porque me estaba dando el siguiente error: jinja2.exceptions.UndefinedError: ‘wtf’ is undefined

y no había agregado el {% import "bootstrap/wtf.html" as wtf %} en el hello.html

Para los que quieran guardar las variables de ambiente en un archivo, encontré esta forma:

  1. instala el siguiente paquete
pip install python-dotenv
  1. crea un archivo llamado .flaskenv
  2. Guarda tus variables de entorno
FLASK_APP=main.py
FLASK_DEBUG=1
FLASK_ENV=development

Es todo, espero les sirva

Acá hay un poco más de documentación para validadores con wtf https://wtforms.readthedocs.io/en/stable/validators.html

En la documentacion de WTForms nos hablan de los validadores estos son

  • DataRequired(message=None) y podemos pasarle el parámetro message, este por defecto es None. Este validador revisa que el campo contenga Data, si esto es falso puedes enviar un mensaje de alerta a través del parámetro message.
  • Email() Valida que el campo contenga un email, tiene distintos parámetros que puedes configurar, uno de ellos es el mensaje.
  • EqualTo() este necesita el argumento del nombre del campo con el que va ser comparado, este validador nos dice si los dos campos tienen la misma información, también podemos modificar el mensaje que envie.
  • InputRequired() Este verifica que exista información en el campo donde se está aplicando
  • IPAddress() Por defecto valida direcciones IPv4, pero puedes modificarlo a IPv6 con el parametro IPAddress(IPv6=True)
  • Length() Valida el tamaño de un string necesita los argumentos min, max si no se especifica alguno no lo tomará en consideración.
  • MacAddress Verifica que sea una dirección Mac
  • NumberRange() Valida un rango entre un mínimo y un máximo, el máximo es inclusive. Si falta alguno no será verificado.
  • Optional() permite que hayan campos vacíos
  • URL() Verifica que sea una URL la que se está pasando.

    Existen otros validadores e inclusive puedes hacer tus validadores propios, esto es explicado en la misma documentación con un ejemplo.

flask what the f*ck

lol

"what the Forms " … jajajaja esos de FLASK son unos loquillos

Como dato extra, DataRequired únicamente agrega el atributo HTML required a los inputs del formulario, por lo que si se necesita mas control deberían implementar JavaScript.

<input class="form-control" id="username" name="username" required="" type="text" value="">

Todo corriendo a la perfección

Waaao WTF es muy interesante y productivo

Me ha encantado, solo he tenido que buscar la documentación para bootstrap 4 y en hello he tenido que importar así:

'% from 'bootstrap4/form.html' import render_form % 

y en div container solo poner

{{ render_form(login_form) }}

Flask what the fuck

Para aquellos que hicieron lo que els comente con lo de bootstrap asi quedaria el codigo.

¿Cómo darle estilo a los input? Osea al login_form_username.
Ya que no es una etiquetea HTML no se le puede agregar una clase y por ende no se le agrega css. ¿Cómo hacerlo entonces?

Excelente forma de crear formularios.

Con bootstrap-flask para logar el render del form se debe hacer de la siguiente manera:

{% from 'bootstrap/form.html' import render_form %}
{{ render_form(login_form) }}

Aunque no veo que bootstrap-flask tenga soporte de directo de WTF el ejemplo resulta igual que el realizado en la clase, incluso el mismo error que se resolverá en la siguiente clase.

from wtforms import validators

username = StringField(‘Nombre de usuario’, validators=[validators.input_required()])
password = PasswordField(‘Password’, validators=[validators.input_required()])

documentación oficial de Flask_wtf
https://flask-wtf.readthedocs.io/en/1.0.x/

Submit field

Las app web reciben info del usuario a través de formularios o formas mediante el metodo post. El servidor recibe la información y la valida.
flaskWTF – implementa wtforms en flask, que a su vez es una librería de python para validar formas web

RENDEREAR

Realmente terrible esa pantalla dividida para la clase, no se alcanza a ver el código completo y toca estar pausando y devolviendo para ver mientras escribe.
Este docente tiene que re-evaluar toda su metodología.

jajaja, what the forms

Por si no entendieron bien Flask-Bootstrap
https://youtu.be/PE9ZGniSDW8

De los mejores maestros de Platzi…genial…muchas gracias…

![](
Alguno me ayuda con este error, no me sirve colocando

{{ wtf.quick_form(login_form) }}

Yo uso Anaconda para manejar los ambientes virtuales y conda para instalar los paquetes de python. Por aquí les dejo por si les interesa cómo usar requirements.txt con conda: https://www.activestate.com/resources/quick-reads/how-to-manage-python-dependencies-with-conda/

{% wtf.lol %} ```

Aqui les inserto la imagen del error!

alguien me podria ayudar? me sale que no puedo importar dicha flask_wtf ya se encuentra en el requeriments.txt y ya lo tengo instalado si alguien me podria ayudar!
flask.JPG

from flask import Flask, request, make_response, redirect, render_template,session
from flask_wtf import FlaskForm


app = Flask(__name__)

todo = ['TODO 1', 'TODO 2', 'TODO 3']




#pagina cuandeo arroja un error
@app.errorhandler(404)
def not_found(error):
    return render_template('404.html', error=error)


@app.route('/')
def index():
    user_ip = request.remote_addr
    response = make_response(redirect('/hello'))
    session['user_ip']= user_ip

    return response


@app.route('/hello')
def hola():
    user_ip = session.get('user_ip')

    context = {
                'user_ip' : user_ip, 
                'todo' : todo,

    }
    return render_template('hola.html', **context)

if __name__ == '__main__':
    # This is used when running locally. Gunicorn is used to run the
    # application on Google App Engine. See entrypoint in app.yaml.
    app.run(host='127.0.0.1', port=8080, debug=True)
# [END gae_flex_quickstart]

Con una conexión segura SSL/TLS es suficientemente seguro para enviar información a mi servidor? O se debe usar algo adicional.

Excelente framework, al parecer ahorraré mucho tiempo!

Como dato extra, DataRequired únicamente agrega el atributo HTML required a los inputs del formulario, por lo que si se necesita mas control deberían implementar JavaScript.

Para python 3.8.1 y Flask_wtf = 0.14.3 se tiene que importar así:

from wtforms import Form, StringField, SubmitField, PasswordField
from wtforms.validators import DataRequired

y la clase queda así:

class LoginForm(Form):

Saludos, les comparto informacion oficial acerca de este framework:

Hola 😃.
Les comparto mi progreso hasta este punto.

Si quieren agregar una clase a su form para sus estilos pueden hacer esto

{{ login_form.username(class_='form-control') }}

wooooooooooooo, en serio esto esta increibleeee

Me sale el error

<No name 'ext' in module 'flask'>

Alguien me puede ayudar?

  • Flask WTF(Web The Form), librería de python para renderizar formularios web.[+]
import fask_wft from FlaskForm
import fask_wft.fields from StingField, PasswordField

class LoginForm(FlaskForm)
	username=StringField('Username: ')
	password=PasswordField('Password: ')
{% import 'bootstrap/wtf.html' as wtf %}

<div class="container">
	{% wtf.quick_form(login_form) %}
</div>