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 46

Preguntas 7

Ordenar por:

驴Quieres ver m谩s aportes, preguntas y respuestas de la comunidad?

o inicia sesi贸n.

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: 鈥榳tf鈥 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

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.

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) }}

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

flask what the f*ck

lol

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

Flask what the fuck

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

Aca les dejo el enlace:
https://wtforms.readthedocs.io/en/3.0.x/crash_course/

De paso una muestra de uso

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

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

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(鈥楴ombre de usuario鈥, validators=[validators.input_required()])
password = PasswordField(鈥楶assword鈥, validators=[validators.input_required()])

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]

cuando vi lo de boostrap me senti como milhause

Si alguien no puede usar wtf.fields o wtf.validators, utilicen:

pip install Flask-WTF

y despues:

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

Para instalar la version nueva de WTF usen el siguiente comando:
pip install WTForms

Esta es una manera de implementar un formulario:
class RegistrationForm(Form):
username = StringField(鈥楿sername鈥, [validators.Length(min=4, max=25)])
email = StringField(鈥楨mail Address鈥, [validators.Length(min=6, max=35)])
accept_rules = BooleanField(鈥業 accept the site rules鈥, [validators.InputRequired()])

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

De los mejores maestros de Platzi鈥enial鈥uchas 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 %} ```

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>