Fundamentos de Flask
Qué aprenderás sobre Flask
¿Cómo funcionan las aplicaciones en internet?
¿Qué es Flask?
Instalación de Python, pip y virtualenv
Hello World Flask
Debugging en Flask
Request y Response
Ciclos de Request y Response
Uso de templates y archivos estáticos
Templates con Jinja 2
Estructuras de control
Herencia de templates
Include y links
Uso de archivos estáticos: imágenes
Configurar páginas de error
Extensiones de Flask
Flask Bootstrap
Configuración de Flask
Implementación de Flask-Bootstrap y Flask-WTF
Uso de método POST en Flask-WTF
Desplegar Flashes (mensajes emergentes)
Pruebas básicas con Flask-testing
Proyecto
Planteamiento del proyecto: To Do List
App Factory
Uso de Blueprints
Blueprints II
Base de datos y App Engine con Flask
Configuración de Google Cloud SDK
Configuración de proyecto en Google Cloud Platform
Implementación de Firestore
Autenticación de usuarios: Login
Autenticación de usuarios: Logout
Signup
Agregar tareas
Eliminar tareas
Editar tareas
Deploy a producción con App Engine
Conclusiones
No tienes acceso a esta clase
¡Continúa aprendiendo! Únete y comienza a potenciar tu carrera
Si ya tienes una cuenta,
Iniciar sesión
Aportes 59
Preguntas 15
Ordenar por:
creación de menú en flask con bootstrap 4
<div class="navbar navbar-expand-lg navbar-dark bg-dark" role="navigation">
<div class="navbar-brand" href="{{ url_for('index') }}">
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNavAltMarkup" aria-controls="navbarNavAltMarkup" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarNavAltMarkup">
<div class="navbar-nav">
<a class="navbar-brand" >
<img src="{{ url_for('static', filename='images/platzi.png') }}"
style="max-width: 48px"
alt="Platzi logo">
</a>
<a class="nav-item nav-link active" href="{{ url_for('index') }}">Inicio<span class="sr-only">(current)</span></a>
<a class="nav-item nav-link" href="https://platzi.com" target="_blank">Platzi</a>
</div>
</div>
</div>
</div>
Utilizando el curso de la terminal en linux aproveché para pasarles el comando para tirar todo lo que tenemos instalado en el ambiente virtual al requirements.txt, de esta manera lo único que hay que hacer es correr el siguiente comando:
pip freeze > requirements.txt y automáticamente todo lo que tenga el ambiente en ese momento se va a volcar a requirements.txt, quedando algo más o menos así:
astroid==2.3.3
click==7.1.1
colorama==0.4.3
dominate==2.5.1
Flask==1.1.1
Flask-Bootstrap==3.3.7.1
isort==4.3.21
itsdangerous==1.1.0
Jinja2==2.11.1
lazy-object-proxy==1.4.3
MarkupSafe==1.1.1
mccabe==0.6.1
pylint==2.4.4
six==1.14.0
typed-ast==1.4.1
visitor==0.1.3
Werkzeug==1.0.0
wrapt==1.11.2
De nada 😃
Bueno atualmente ya es soprtado Bootstrap4 solo que lo tienes que especificar a la hora de hacer pip install
pip install Flask-Bootstrap4
Pueden consultarlo aquì
Buen día, para la version 4.5 de bootstrap esta el paquete Flask-BS4
$ pip install Flask-BS4
Lo demas es igual a como lo muestra el profe.
Saludos.
Al día de hoy (Junio 11, 2022) ya estamos en Bootstrap 5, por lo que como reto personal me puse de objetivo implementar esto mismo del profesor usando Bootstrap5.
Hice uso de Bootstrap-Flask 2.0.2.
Pueden instalarlo de la siguiente forma:
pip uninstall flask-bootstrap bootstrap-flask
pip install bootstrap-flask==2.0.2
Es necesario primero eliminar flask-bootstrap en caso de que lo hubieran instalado, pues el nuevo paquete utiliza el mismo namespace.
Después de instalarlo, en base.html debemos agregar manualmente los scripts de Bootstrap.
<!DOCTYPE html>
<html lang="en">
<head>
{% block head %}
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>{% block title %}Flask Example - {% endblock %}</title>
{% block styles %}
{{ bootstrap.load_css() }}
<link rel="stylesheet" href="{{ url_for("static", filename="css/main.css") }}" />
{% endblock %}
{% endblock %}
</head>
<body>
{% block body %}
{% block navbar %}
{% include "navbar.html" %}
{% endblock %}
{% block content %}{% endblock %}
{% block scripts %}
{{ bootstrap.load_js() }}
{% endblock %}
{% endblock %}
</body>
</html>
Y por último modificamos el navbar.html haciendo uso de las clases de Bootstrap 5
{% block navbar %}
<nav class="navbar navbar-expand-lg navbar-dark bg-dark">
<div class="container-fluid">
<a class="navbar-brand" href="#">Flask Example</a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav me-auto mb-2 mb-lg-0">
<li class="nav-item">
<a class="nav-link" href="{{ url_for('hello') }}">
Inicio
</a>
</li>
<li class="nav-item">
<a class="nav-link" href="https://twitter.com/d4vsanchez" target="_blank">
@d4vsanchez
</a>
</li>
</ul>
</div>
</div>
</nav>
{% endblock %}
Para automatizar el inicio de flask con todo y entornos virtuales, librerias, enviroments variables. Creamos el siguiente script
- Crea un archivo con el nombre que gustes y extension sh ejemplo run .sh
- Agrega el codigo de abajo, solo cambia el nombre de tu entorno virtual, el mio tiene el nombre de .env tu sólo agrega el tuyo.
- Una vez hecho lo anterior corre desde la carpeta raiz con source nombre_archivo.sh
Código a copiar
#!/bin/bash
source .env/bin/activate
pip install -r requirements.txt
export FLASK_APP=main.py
export FLASK_DEBUG=1
export FLASK_ENV=development
flask run
Para ejecutarlo
source nombre_archivo.sh
Traté de probar flask-bootstrap y flask-bootstrap4 y aunque incialmente tuve problemas finalmente pude usarlos sin problemas desde mi entorno virtual; sin embargo me marcaba error al tartar de cargar un css que no existe. Buscando documentación me encontré con bootstrap-flask, así es solo cambian la posición de las palabras.
Aunque bootstrap-flask es más sencillo funciona muy bien y hace uso de Bootstrap v4.3.1, y por lo que veo buscan mejorarlo entonces se me hace una buena opción. Dejo la liga de la docuemntación para que pueda revisarla y analizarlo.
Para los que están viendo este curso a mediados del 2022, hay una extensión llamada “bootstrap-flask” (no “flask-bootstrap”), la cual soporta a Bootstrap5, lo cual es recomendado por los cambios que han hecho entre la versión 4 a la 5, he aquí la documentación por si se animan 😃 https://bootstrap-flask.readthedocs.io/en/stable/
Para los que esten viendo 4/4/19, se puede bajar bootstrap4 ya a flask. Dato no menor, es la version 4.0.0, a la fecha de hoy ya esta la 4.3.
Para mayor comodidad, se puede recurrir a crear uno mismo el template de Bootstrap, aparte en un “.html” e incorporarlo al "base.html"
De este modo podes;
Incluir los archivos descargados de manera loca.
Incluir el CMD
Distintos modos de mantener todo actualizado a la fecha, con pocos ajustes desde uno mismo.
Por favor actualizen el curso, flask-boostrap esta descontinuado
Dejo mi versión del código del profesor en Bootstrap4 👇
<nav class="navbar navbar-expand-lg navbar-light bg-light">
<a class="navbar-brand" href="{{ url_for('index') }}">
<img src="{{ url_for('static', filename='images/platzi.png') }}"
style="max-width: 48px"
alt="AWESOME LOGO">
</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent"
aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav mr-auto">
<li class="nav-item active">
<a class="nav-link" href="{{ url_for('index') }}">Inicio <span class="sr-only">(current)</span></a>
</li>
<li class="nav-item">
<a class="nav-link" href="https://platzi.com" target="_blank">Platzi</a>
</li>
</ul>
</div>
</nav>
Hola! Para usar bootstrap 4 y 5 está tambien este paquete pip
https://bootstrap-flask.readthedocs.io/en/stable/basic/#installation
La documentación indica un proceso distinto al del paquete del curso pero vale la pena!
Aquí la barra de navegación:
<div class="navbar navbar-inverse" role="navigation">
<div class="container">
<div class="navbar-header">
<button type="button"
class="navbar-toggle"
data-toggle="collapse"
data-target=".navbar-collapse">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a href="{{ url_for('hello') }}" class="navbar-brand">
</a>
</div>
<div class="navbar-collapse collapse">
<ul class="nav navbar-nav">
<ul><a href="{{ url_for('hello') }}">Inicio</a></ul>
<ul><a href="https://platzi.com" target="_blank">Platzi</a></ul>
</ul>
</div>
</div>
</div>
Para instalar Bootstrap4 en tu programa lo primero que debes hacer es descargarlo:
pip install Flask-Bootstrap4
Luego es ir a la página de Bootstrap y presionar donde dice Get started, al hacer eso los redireccionará a otra página y buscas el recuadro con el título CSS.
Ahora copias esa línea de código y lo pegas en la etiqueta head de tu html, (sin modificar nada en cuanto a etiquetas) y listo, tienes Bootstrap4 en tu programa, ahora solo debes entrar y buscar lo que quieres agregar a tu página y lo pegas en tu html.
Deberían ser más cuidadosos con los cursos que incluyen en las rutas, estoy seguro que este curso es para una persona con conocimientos de html y python, sin embargo dentro de la ruta de backend de python es la primera vez que trabajamos con html.
Parece ser muy interesante la herramienta, pero se convierte en una clase anecdótica porque el profesor poco o nada explica del funcionamiento y estamos copiando código como si fuese receta de cocina.
Comencé este curso con la ilusión de aprender back, pero todo lo que he visto es enfocado al frontend…
Hola
para los que no les funciona el flask_bootstrap al encender el server con un error de que no ha resuelto la importacion desactiven el enviorement en instalen con lo siguiente
python -m pip install flask-bootstrap
Luego activen de nuevo , enciendan el server y deberia funcionar =D
Me esta ocurriendo un error Unable to import ‘flask_bootstrap’ pylint(import-error) [2, 1]
si alguien podría asesorarme como resolver el error puesto que se descargo el archivo pero me aparece ese error.
Les comparto informacion oficial acerca de flask_bootstrap:
A mi si me falló el Bootstrap 4, lo desinstalé e instalé el 3 de nuevo con pip uninstall Flask-Bootstrap4==4.0.2
y pip install flask-bootstrap
Despues de mucho buscar encontre una mejor manera de manejar el menu haburguesa collapse al redimensionar un navegador con Bootstrap 5:
Primero instalarlo:
pip install Flask-Bootstrap5
Despues toca agragar al template base.html el estilo en el head al igual que en el body quedando:
{% extends 'bootstrap/base.html' %}
{% block head %}
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3" crossorigin="anonymous">
{{ super() }}
<title>
{% block title %}Flask Platzi | {%endblock%}
</title>
<link rel="stylesheet" href={{ url_for('static',filename='css/main.css') }}>
{% endblock %}
{% block body %}
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js" integrity="sha384-ka7Sk0Gln4gmtz2MlQnikT1wXgYsOg+OMhuP+IlRH9sENBO0LRn5q+8nbTov4+1p" crossorigin="anonymous"></script>
{% block navbar %}
{% include 'navbar.html' %}
{% endblock %}
{% block content %} {% endblock %}
{% endblock %}
Y el navbar.html quedaria:
<nav class="navbar navbar-expand-lg navbar-dark" style="background-color: #333497;">
<div class="container-fluid">
<a class="navbar-brand" href="{{ url_for('index') }}">
<img src="{{ url_for('static', filename='images/platzi.png') }}"
style="max-width: 48px"
alt="Platzi logo">
</a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav me-auto mb-2 mb-lg-0">
<li class="nav-item">
<a class="nav-link active" aria-current="page" href="{{ url_for('index') }}">Inicio</a>
</li>
<li class="nav-item">
<a class="nav-link active" href="https://platzi.com" target="_blank">Platzi</a>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-bs-toggle="dropdown" aria-expanded="false">
Dropdown
</a>
<ul class="dropdown-menu" aria-labelledby="navbarDropdown">
<li><a class="dropdown-item" href="#">Action</a></li>
<li><a class="dropdown-item" href="#">Another action</a></li>
<li><hr class="dropdown-divider"></li>
<li><a class="dropdown-item" href="#">Something else here</a></li>
</ul>
</li>
<li class="nav-item">
<a class="nav-link disabled">Disabled</a>
</li>
</ul>
<form class="d-flex">
<input class="form-control me-2" type="search" placeholder="Buscar" aria-label="Search">
<button type="button" class="btn btn-outline-success">Buscar</button>
</form>
</div>
</div>
</nav>
Pueden trabajar con la 3.3 de Bootstrap aunque si como veran, estamos en la 5, hay documentación para la 4 y 5 y dice que ya no usa base, o eso vi.
La librería que usa el profesor en la clase lleva años son ser mantenida y aún usa la versión 3 de Boostrap. Si quieren usar la última versión de Bootstrap (la v5 para cuando escribo esto) les recomiendo usar esta extensión para Flask: https://github.com/helloflask/bootstrap-flask
Les comparto el codigo que implemente en el archivo navbar.html con Flask-Bootstrap4==4.0.2.
<nav class="navbar navbar-expand-lg navbar-dark bg-dark">
<a class="navbar-brand" href="{{ url_for('index') }}"><img src="{{ url_for('static', filename='images/platzi.png') }}" alt="Platzi Logo"></a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav mr-auto">
<li class="nav-item active">
<a class="nav-link" href="{{ url_for('index') }}">Ir a inicio<span class="sr-only">(current)</span></a>
</li>
<li class="nav-item">
<a class="nav-link" href="https://platzi.com" target="_blank">Ir a Platzi</a>
</li>
</ul>
<form class="form-inline my-2 my-lg-0">
<input class="form-control mr-sm-2" type="search" placeholder="Buscar" aria-label="Search">
<button class="btn btn-outline-success my-2 my-sm-0" type="submit">Buscar</button>
</form>
</div>
</nav>```
#importar Bootstrap 4 en adelante
from flask_bs4 import Bootstrap
Yo ocupe Bootstrap 4, lo instale así:
pip install Flask-Bootstrap4
use esta navbar:
<nav class="navbar navbar-expand-lg navbar-light bg-light">
<a class="navbar-brand" href="https://flask.palletsprojects.com/en/2.0.x/">FLASK</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNavAltMarkup" aria-controls="navbarNavAltMarkup" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarNavAltMarkup">
<div class="navbar-nav">
<a class="nav-item nav-link active" href="{{ url_for('index') }}">Home <span class="sr-only">(current)</span></a>
<a class="nav-item nav-link" href="{{ url_for('index') }}">Inicio</a>
<a class="nav-item nav-link" href="https://platzi.com">Platzi</a>
</div>
</div>
</nav>
y por utimo añadí el css y los scipts de Bootstrap a el base.html
{% extends 'bootstrap/base.html' %}
{% block head %}
{{ super() }}
<title>
{% block title %}Flask Platzi |{% endblock %}
</title>
<!-- <link rel="stylesheet" href="{{url_for('static', filename='css/main.css')}}"> -->
{% endblock %}
{% block body %}
{% block navbar %}
{% include 'navbar.html' %}
{% endblock %}
{% block content %}
{% endblock %}
{% block scripts %}
{{ super() }}
{% endblock %}
{% endblock %}
Me base en este aporte para hacer mi solución, leanlo aquí
Flask-bootstrap se quedó en la versión 3.3.7 mientras que Bootstrap como tal ya va en la versión 5. Para este caso en particular creo que ya es mejor simplemente importar bootstrap en base.html que usarlo como extensión
Siento que Flask-bootstrap se quedó muy anticuado
Es decir, flask-bootstrap si funciona pero no va al día con las actualizaciones del Bootstrap real, por ahí veo que lo ultimo que sacaron fue una versión 4.0.2 en flask bootstrap en el año 2018 pero nada más, y la página oficial de flask bootstrap no da versiones superiores a flask-bootstrap 3.3.7
Considero que es mejor usar Bootstrap directamente sobre nuestra imagen base y listo, incluso aquí les dejo un tutorial a los nuevos LINK.
Les dejo los bloques de botstrap/base.html para que sepan que bloques pueden manipular:
{% block doc -%}
<!DOCTYPE html>
<html{% block html_attribs %}{% endblock html_attribs %}>
{%- block html %}
<head>
{%- block head %}
<title>{% block title %}{{title|default}}{% endblock title %}</title>
{%- block metas %}
<meta name="viewport" content="width=device-width, initial-scale=1.0">
{%- endblock metas %}
{%- block styles %}
<!-- Bootstrap -->
<link href="{{bootstrap_find_resource('css/bootstrap.css', cdn='bootstrap')}}" rel="stylesheet">
{%- endblock styles %}
{%- endblock head %}
</head>
<body{% block body_attribs %}{% endblock body_attribs %}>
{% block body -%}
{% block navbar %}
{%- endblock navbar %}
{% block content -%}
{%- endblock content %}
{% block scripts %}
<script src="{{bootstrap_find_resource('jquery.js', cdn='jquery')}}"></script>
<script src="{{bootstrap_find_resource('js/bootstrap.js', cdn='bootstrap')}}"></script>
{%- endblock scripts %}
{%- endblock body %}
</body>
{%- endblock html %}
</html>
{% endblock doc -%}
No me funciona, aparece :
jinja2.exceptions.TemplateNotFound
jinja2.exceptions.TemplateNotFound: bootstrap/base.html
No encuentra el template base.html a pesar de crear la barpeta y el archivo. No sé si se instaló bootstrap de forma adecuada . Uso Ubuntu.
Si me decía que copie y pegue era mas fácil, no explicó nada, como funciona? por que funciona así? Magia? Por que es mejor este método de crear el html que el anterior? De hecho el nuevo html pierde semántica, al no usar el tag <nav>. Y ahora al tener un problema no tenemos como solucionarlo, por ejemplo hay un error en el title dentro del header, que lo repite dos veces, por que aparece? Y como se soluciona? Magia?
Va tomando forma
Recuerden desisntalar y quitar de requirements.txt flask-bootstrap si desean annadir bootstrap-flask, y agregar este ultimo al requirements.txt
buenas tarde tengo un problema al importar flask-bootstrap ya instale y me sale lo sigueinte
tambien ya instancie y me sigue saliendo error
ya tambien instale la ultima version de flask-bootstrap y no me soluciona el error
pip install Flask-Bootstrap4.
Sinceramente prefiero importarlo como CDN en el base y así tengo la última versión de bootstrap, creo que se me hizo más fácil, pero igual funciona lo de flask-bootstrap, no está mal
Al instalar la librería para trabajar con bootstrap, veo que instala bootstrap en su versión 3.3.7. Habrá otra librería que instale un bootstrap más actual?. Gracias.
@app.errorhandler(500)
def exception_found(error):
return render_template('500.html', error=error)
{% extends 'base.html' %}
{% block title %}
{{ super() }}
Error no controlado
{% endblock %}
{% block content %}
<h1>Se ha detectado un error al cargar el contenido</h1>
{{ error }}
{% endblock %}
En esta página encontraras todo relacionado al tema:
https://pythonhosted.org/Flask-Bootstrap/
Pero como carajos nos muestra Bootstrap y luego acaba sacando una plantilla toda x de otro lado :S 😕
Ojalá actualicen este curso, nos mal acostumbraron con Facundo y su gran manera de explicar y ser coherente con todo. 😕
¿Qué diferencia hay de usar Bootstrap directamente con el CDN?
¡Hola! Quería hacer mi aporte. Yo utilicé este código para el navbar con Bootstrap 4.
<nav class="navbar navbar-expand-lg navbar-dark" style="background-color: #002120;">
<a class="navbar-brand" href="{{ url_for('index') }}">
<img src="{{ url_for('static', filename='images/platzi.webp') }}"
style="max-width: 100px"
alt="AWESOME LOGO">
</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent"
aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav mr-auto">
<li class="nav-item active">
<a class="nav-link" href="{{ url_for('index') }}">Home <span class="sr-only">(current)</span></a>
</li>
<li class="nav-item">
<a class="nav-link" href="https://platzi.com" target="_blank">Platzi</a>
</li>
</ul>
</div>
</nav>
El resultado es algo como esto:
no me sale
Hola Comunidad.
.
He visto varias preguntas referentes al tema del actualización de versión y del problema con el menú responsive y he estado pegando un aporte que hace referencia a eso.
.
Para no hacer spam en los comentarios 😦 mejor lo dejo aquí como aporte.
.
https://platzi.com/tutoriales/1540-flask/9216-quieres-actualizar-o-cambiar-tu-version-de-flask-bootstrap-y-reparar-el-problema-del-menu-responsive-lee-esto/
.
Ojalá les sirva y si ven que hay algo que corregir me lo comentan.
.
¡Saludos!
Me funciono con la versión 3.4.1 de bootstrap. Pero no me funcionan los botones desplegables. a alguien le pasa lo mismo?
Las extensiones de flask son librerías que permiten agregar funcionalidades a flask.
¿Y si yo descargo los archivos de la página de Bootstrap y luego los linqueo igual que con main.css?
No me funciona flask_boostrap
No me renderiza los botones de Inicio y Platzi. Alguien sabe por que?
No es necesario que se instale ningun bootstrap para poder ser usado y poder usarlo con Flask. De hecho me parece mas incomodo tener que aprenderme toda esa estructura adicional.
Mi solución es parte de un curso que lleve con anterioridad y es simplemente usar la sintaxis de bootstrpa que viene en su pagina en los archivos html.
Para usar Bootstrap 4 con Flash:
https://pypi.org/project/Flask-Bootstrap4/
Y la documentación de como usarlo:
https://pythonhosted.org/Flask-Bootstrap/basic-usage.html
A los que le salga el problema unresolved import ‘flask bootstrap’ flask puede ser como en mi caso que hacia falta instalar flask-wtf.
Codigo navbar.html
<div class="navbar navbar-inverse" role="navigation">
<div class="container">
<div class="navbar-header">
<button type="button"
class="navbar-toggle"
data-toggle="collapse"
data-target=".navbar-collapse">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="{{ url_for('index') }}">
<img src="{{ url_for('static', filename='images/logo.png') }}"
style="max-width: 48px"
alt="Platzi logo">
</a>
</div>
<div class="navbar-collapse collapse">
<ul class="nav navbar-nav">
<li><a href="{{ url_for('index') }}">Inicio</a></li>
<li><a href="https://platzi.com" target="_blank">Platzi</a></li>
</ul>
</div>
</div>
</div>
TIP Me pase 1hr buscando cual era el error que tenia acerca de la importacionn de flask_bootstrap para instalarlo y luego importarlo les recomiendo apagar el servidor luego volverlo a encender y de ser necesario hacer un hard reset en el cliente
No es por nada pero me parece que este profesor tiene una excelente metodologia para explicar y va directo a la practica
Quería recomendarles que vayan aprendiendo a utilizar manejadores de dependencias que les facilitarán bastante la vida a la hora de instalarlas 😃 y ademas también facilitan el uso de ambientes virtuales, entre las mas populares están:
Esta última es la que utilizo y recomiendo mucho porque es la que más está automatizada, una vez la entiendes verás lo mucho que facilita las cosas!
para version 4 de bootstrap
flask-bootstrap4
alguno pudo hacer que el menu de hamburguesa le funcione? porque bootstrap es responsive, al achicar el menu de hamburguesa aparece pero no se despliega.
¿Quieres ver más aportes, preguntas y respuestas de la comunidad?
o inicia sesión.