flask app flask project layout with blueprint bootstrap
Este tutorial explica cómo usar la aplicación Flask, Flask Blueprint y Flask Bootstrap en un proyecto Flask:
En este tema, nos alejaremos un poco del arquetipo de Flask-Appbuilder para desarrollar nuestra comprensión de Flask Blueprints. Lea nuestro tutorial sobre Flask, Plantillas y vistas de Flask y Flask con bases de datos como MongoDB, SQLite y MySQL. Hemos estado usando un proyecto de ejemplo llamado flaskTutorialApp.
Sin embargo, también puede crear el proyecto desde cero usando el comando flask fab create-app. Este comando crea el andamiaje requerido para un proyecto de Flask junto con un directorio de aplicaciones basado en el nombre de la aplicación que usted proporcionó.
=> Ver la serie de capacitación en matraces para todos
En este tutorial, explicamos sobre la aplicación Flask, Flask Blueprint y Flask Bootstrap. Desarrollamos nuestra aplicación Flask inicialmente con el andamio preexistente proporcionado por Flask-Appbuilder. Luego creamos un plano de matraz llamado hello2. Finalmente, describiremos el concepto de Flask Docker al dockerizar nuestra aplicación Flask.
Lo que vas a aprender:
Aplicación Flask
Flask App es otro nombre para una aplicación Flask. Si observa el código escrito en el archivo __init__.py, notará que se crea una instancia de Flask y la variable se denomina app. La instancia de la clase Flask es la aplicación Flask, que es la instancia de la aplicación WSGI.
|_+_|Plano de matraz
Flask Blueprint nos permite mantener juntas las funciones relacionadas y ayuda a mejorar las prácticas de desarrollo. Algunos de los beneficios de Flask Blueprints son los siguientes:
- Fácil organización de aplicaciones a gran escala.
- Aumenta la reutilización del código al registrar el mismo Blueprint varias veces.
- Se registra un conjunto de operaciones y se puede reproducir posteriormente después de registrar un plano.
Con el trasfondo anterior proporcionado en Flask Blueprint, podemos avanzar y diseñar nuestro primer Blueprint. También podemos pensar en Blueprint como un módulo. Creemos un plano de HelloWorld.
Todos los componentes, recursos y características de un plano se mantienen y organizan por separado del otro código fuente de la aplicación Flask. Significa que un Flask Blueprint puede tener sus vistas, formularios, modelos, archivos estáticos y plantillas.
Puede crear varios Blueprints a partir del mismo conjunto de recursos. Sin embargo, es probable que eso genere confusión y no es una buena práctica.
Crear directorios y archivos de planos de matraces
Comencemos a crear un plano de matraz con el nombre de hello2. Use el script que se proporciona a continuación para crear la estructura del directorio después de activar su entorno virtual usando el origen venv / bin / activo después de ir al directorio de la aplicación.
|_+_|Queremos que nuestro hello2 Blueprint tenga sus vistas que importaremos en su __init__.py. Creamos un directorio separado para nuestro Blueprint con plantillas y directorios estáticos para representar vistas de Flask y servir recursos estáticos, respectivamente.
Estructura del directorio de planos de matraces
La estructura del directorio del Blueprint debe verse como se muestra a continuación. Utilice el comando de árbol para crear una salida similar.
comando tar en unix con ejemplos|_+_|
Ahora definamos una vista simple dentro de views.py. Abra hello2 / views.py e ingrese el fragmento de código que se proporciona a continuación.
|_+_|Importamos la clase Blueprint y el método render_template. Luego creamos un objeto Blueprint dando los nombres de la plantilla y los directorios estáticos.
Luego definimos una ruta, usando el decorador @ hello2.route, y un controlador con el nombre hello2_view. Este controlador es una función de Python. En esta función, asignamos un valor a una variable llamada saludo y luego lo pasamos al método render_template.
Crear plantilla de plano de matraz
Ahora creemos la plantilla hello.html. Si ha estado leyendo nuestros tutoriales anteriores, debe haber notado que la plantilla tiene el mismo nombre que creamos para reproducir la vista HelloWorld. Para este Blueprint hello2, creamos una nueva plantilla ampliando la anterior.
Además, observe que hemos utilizado una ruta semántica hello2 / hello.html mientras llamamos a render_template para representar el saludo en la plantilla. Este patrón evita conflictos entre las plantillas del mismo nombre.
Utilice el fragmento de código que se proporciona a continuación para crear hello.html y guárdelo en hello2 / templates / hello2 / path.
|_+_|Esta plantilla es casi similar a hello.html. Sin embargo, hereda la mayoría de sus partes HTML de hello.html. Observe el uso de {% block hello%} y {% endblock%}. Bloquear hola en hello2 / hello.html anula el bloque hola de la plantilla base hello.html.
Ahora abramos el archivo __init__.py del plano hello2 y mencionemos el código que se proporciona a continuación.
|_+_|En esta declaración, importamos todos los métodos decorados que hemos creado en views.py del Blueprint hello2. Si es necesario, podemos importar solo aquellos métodos / controladores que están listos para ser usados o probados.
Registrar un plano de matraz con la aplicación Flask
Ahora abramos __init__.py en el directorio de la aplicación Flask y registremos nuestro Blueprint hello2 como se muestra en el siguiente código.
|_+_|Aquí también, tenga en cuenta que podemos importar vistas de forma selectiva y registrar solo aquellas que están listas para usar o probar.
Ejecutemos nuestra aplicación Flask en modo de depuración con el comando python run.py desde el directorio raíz del proyecto y naveguemos hasta http: // localhost: 8080 / hello2 para ver si la vista de hello2 funciona bien.
El resultado en el navegador debería ser similar al ejemplo que se muestra a continuación.
Trabajemos en una mejor presentación del plan hello2 utilizando el marco de arranque de Twitter. Además, en la siguiente sección, aprenderá más sobre los parámetros opcionales para cambiar el comportamiento de un plano de matraz. Veámoslo con la ayuda de un ejemplo de un plano de matraz llamado Flask Bootstrap.
Ejemplo de aplicación de matraz modular con plano de matraz
Basándonos en nuestro aprendizaje de hello2 Flask Blueprint, agreguemos algunos planos más para comprender cómo podemos crear aplicaciones modulares en Flask.
Supongamos que tenemos una aplicación web que ofrece contenido a los visitantes en forma de libros electrónicos, tutoriales y cursos. También tiene contenido adicional sobre información sobre el equipo y una página de inicio.
Si intentamos acomodar estas nuevas características en la aplicación existente, entonces tendremos que crear vistas en views.py y las plantillas correspondientes en el directorio de plantillas de la aplicación. De manera similar, necesitamos crear modelos y formas en models.py y forms.py.
Sin embargo, mantener todo el código de la aplicación se volverá engorroso y la colaboración con los otros miembros del equipo será demasiado complicada y podría resultar en conflictos de compromiso o en un flujo de trabajo de desarrollo complejo.
Actualmente, en este enfoque convencional, la estructura de la aplicación es como se muestra a continuación.
Para evitar tal escenario, podemos hacer uso de Flask Blueprints para crear módulos específicos para las características y el contenido respectivo. Creemos algunos planos de matraces, con sus recursos separados.
Cada uno de los diseños de Flask Blueprint se verá similar al que se muestra a continuación.
Utilice el script que se proporciona a continuación para crear los archivos y directorios necesarios para los planos de matraces planificados. Ejecute este script desde el directorio raíz del proyecto.
|_+_|Primero creemos funciones para el módulo de inicio.
Abra views.py en el directorio de inicio y actualícelo con el código que se proporciona a continuación.
|_+_|En este archivo, hemos importado la clase Blueprint de Flask y la hemos instanciado con los parámetros requeridos con plantillas separadas y una carpeta estática. Luego usamos la decoración @home para declarar la ruta asociada del método de vista llamado index.
Ahora cree una plantilla base.html Jinja2 en el directorio de plantillas de la aplicación. Utilice el código que se proporciona a continuación para actualizar el archivo.
|_+_|Hemos ampliado desde base.html de Bootstrap. Observe el uso de div del contenedor de clase y hero-unit. Además, hemos creado un botón para que los usuarios aprendan más. Modificamos este HTML y usamos clases del marco Bootstrap de Twitter.
Ahora actualice la página en el navegador en http: // localhost: 8080 / hello2.html para ver el aspecto cambiado del hello2.html.
La vista de Changed Hello2 será similar a la que se muestra a continuación.
El uso de Flask-Bootstrap depende completamente de los bloques que están disponibles para anular o modificar. Podemos utilizar los bloques que se mencionan a continuación para personalizar la experiencia. Se puede ver una lista detallada de todos los posibles bloques en https://pythonhosted.org/Flask-Bootstrap/basic-usage.html.
A veces, cuando solo queremos modificar un bloque en lugar de reemplazarlo por completo, podemos usar la función super () de Jinja2 para lograr los resultados.
Cree un archivo llamado hello2.css en hello2 / static y coloque el siguiente fragmento de código para diseñar el color del párrafo en hello2 / hello.html.
|_+_|Tome el fragmento de código que se muestra a continuación y colóquelo en hello2 / hello.html.
|_+_|Ahora abra views.py del Flask Blueprint hello2 y modifique la declaración del blueprint como se muestra a continuación.
|_+_|Vaya a la URL registrada del Flask Blueprint, es decir, http: // localhost: 8080 / hello2 nuevamente. El resultado debido a los cambios realizados hasta ahora debería verse como se muestra a continuación.
Matraz Docker
Docker ayuda a contener una aplicación. Aísla el entorno que necesita la aplicación Flask de manera que no se requieren entornos virtualizados completos, como máquinas virtuales.
Además, los contenedores Docker tienen una huella mínima y son más cómodos de administrar y escalar con la ayuda de una plataforma de orquestación. En estos días, cuando todas las demás aplicaciones también tienen una implementación en contenedores, nosotros también debemos aprender a implementar nuestra aplicación de muestra como un contenedor acoplable.
Un contenedor basado en Linux puede ejecutarse en Windows y MAC. Una aplicación Flask acoplada, por lo tanto, se puede implementar en cualquier sistema operativo, independientemente del sistema operativo en el que se creó.
En esta sección, explicaremos los pasos para dockerizar una aplicación Flask. Dockerizaremos este proyecto para que se pueda implementar en un contenedor con todas las dependencias empaquetadas en su interior.
Primero, instalar Docker en su máquina.
sudo apt-get install docker.io
Una vez que se complete la instalación, vaya al directorio raíz de nuestro proyecto de muestra y cree un Dockerfile.
Escriba el código que se proporciona a continuación en ese Dockerfile.
|_+_|Actualice el archivo config.py y cambie la base de datos a SQLite, como se muestra a continuación.
|_+_|Además, si esta es la primera vez que trabaja con SQLite en esta serie de tutoriales, cree el usuario administrador utilizando el comando flask fab create-admin.
Compruebe si el usuario administrador puede iniciar sesión en la aplicación.
Ahora cree la imagen de la ventana acoplable de nuestra aplicación de muestra con el siguiente comando.
|_+_|Este comando lleva algo de tiempo mientras descarga recursos del concentrador de la ventana acoplable. Una vez que este comando esté completo, verifique que las imágenes hayan aparecido usando el siguiente comando.
|_+_|Ahora ejecute esta imagen de Docker creada recientemente.
|_+_|La consola mostrará los mensajes de registro del servidor de desarrollo.
La instalación de Docker da como resultado la creación de una NIC virtual con el nombre docker0. Busque la dirección IP mediante el comando sudo ifconfig. Una vez que obtenga la IP de Docker, puede acceder a la aplicación navegando a la URL que se proporciona a continuación.
http://:5001
Una vez que esté seguro con el desarrollo de la aplicación, puede implementar su imagen de Docker en Docker Hub para que los demás la descarguen y usen.
Probar el plano del matraz
Ahora creemos algunas pruebas para probar el Blueprint hello2. Veamos si nuestra aplicación de muestra devuelve el código HTTP correcto cuando el cliente envía una solicitud de obtención de recursos en el punto final / hello2 o no. Si recuerdas, registramos nuestro Flask Blueprint hello2 con un url_prefix con el valor / hello2.
Cree un archivo llamado test_blueprint.py bajo pruebas y agregue la siguiente prueba en él.
|_+_|HTTP 308 pertenece a Redirección permanente, y se espera que nuestra aplicación Flask necesite redirigir la solicitud a los recursos relacionados con el Blueprint llamados hello2.
Ahora agreguemos otra prueba para verificar la ruta raíz de los recursos de nuestro Blueprint. Agreguemos una prueba para ver si tiene valor o no.
|_+_|Ahora ejecutemos estas pruebas junto con las otras pruebas para asegurarnos de que estén pasando.
|_+_|Vería una salida similar de los resultados de la prueba, como se muestra a continuación.
Ahora confirme todos los cambios en el repositorio y publique esos cambios en el repositorio remoto en Github. Compare las diferencias con el código con el de la rama maestra y cree una solicitud de extracción si no hay conflictos.
La solicitud de extracción invoca los trabajos de compilación que forman parte de nuestro flujo de trabajo de Github. Si todas las comprobaciones de las solicitudes de extracción del tutorial-4 no fallan, entonces podemos fusionar de manera segura esta rama con el maestro.
Preguntas frecuentes
P # 1) ¿Qué es Flask BluePrint?
Responder: Flask Blueprint es una forma de estructurar una aplicación Flask en módulos más pequeños y reutilizables. Un Flask Blueprint tiene sus recursos separados como vistas, plantillas, archivos estáticos, modelos, formularios, etc. Usamos el enfoque Flask Blueprint para crear Aplicaciones Flask escalables y fáciles de mantener.
P # 2) ¿Cómo se usa Flask Blueprint?
Responder: Para usar Flask Blueprint, necesitamos importarlo y registrarlo con el objeto Flask Application, usando el método app.register_blueprint. Podemos pasar un valor al parámetro url_prifix para anteponer una ruta a las rutas del Flask Blueprint.
Conclusión
En este tutorial, explicamos Flask Blueprints junto con los conceptos de creación de recursos estáticos para una aplicación Flask. Exploramos los beneficios de usar Flask Blueprint junto con los pensamientos de los recursos de blueprint con la ayuda de un complemento de Flask llamado Flask-Bootstrap.
También cubrimos los conceptos de creación de la imagen de Docker de la aplicación tutorial de muestra de Flask. Además, también creamos dos pruebas para validar los planos de matraces.
En nuestro próximo tutorial, cubriremos los patrones que se siguen comúnmente al crear funciones en las aplicaciones web usando Flask.
=> Visite aquí para aprender el frasco desde cero
Lectura recomendada
- Tutorial de API de matraz con ejemplo | Ampliación de Flask con API
- Las 31 preguntas más populares de la entrevista con Python Flask con respuestas
- Django Vs Flask Vs Node: Qué marco seleccionar
- Patrones de diseño de matraces y mejores prácticas para aplicaciones web
- (Top 10) Las mejores plataformas de software de desarrollo de aplicaciones de 2021
- Las 51 preguntas y respuestas principales de la entrevista de Bootstrap