Requisito previo: Conceptos básicos de HTML , Conceptos básicos de Python , Flask
No es posible escribir un curso de front-end cada vez que el usuario realiza cambios en su perfil. Usamos una plantilla y genera código de acuerdo al contenido.
Flask es uno de los marcos de desarrollo web escritos en Python. A través del matraz, se puede ejecutar un bucle en el código HTML usando la plantilla jinja y automáticamente se puede generar código HTML usando esto.
El código se almacenará en Directorios en el formato de Flask. Así que haremos dos directorios,
- estático : para archivos estáticos como imágenes, css, js
- templates – Para plantillas Html
El archivo app.py que contendrá todo el archivo de Python se almacenará en el directorio principal y el archivo index.html se almacenará en las plantillas.
app.py
El código de app.py es el mismo para ambos ejemplos. Imprimiremos una lista de Python con algunos nombres de Pokemons primero en formato de lista
y luego de tabla.
# importing modules
from flask import Flask, render_template
# declaring app name
app = Flask(__name__)
# making list of pokemons
Pokemons =["Pikachu", "Charizard", "Squirtle", "Jigglypuff",
"Bulbasaur", "Gengar", "Charmander", "Mew", "Lugia", "Gyarados"]
# defining home page
@app.route('/')
def homepage():
# returning index.html and list
# and length of list to html page
return render_template("index.html", len = len(Pokemons), Pokemons = Pokemons)
# if __name__ == '__main__':
# running app
app.run(use_reloader = True, debug = True)
Ejemplo n.º 1: hacer una lista
Usaremos el argumento Pokemons pasado desde el archivo python aquí para imprimir automáticamente una lista en lugar de escribirla cada vez.
índice.html
<!DOCTYPE html>
<html>
<head>
<title>For loop in Flask</title>
</head>
<body>
<ol>
<!-- For loop logic of jinja template -->
{%for i in range(0, len)%}
<li>{{Pokemons[i]}}</li>
{%endfor%}
</ol>
</body>
</html>
Salida:
Sin escribir ningún dato de la lista, la lista se generará automáticamente. Puedes usar css y js para que se vean hermosos. 
Ejemplo #2: Hacer una Mesa
Usaremos el argumento Pokemons pasado desde el archivo python aquí para imprimir automáticamente una tabla en lugar de Escribirla nosotros mismos. El código de app.py para este ejemplo es el mismo que el anterior.
índice.html
<!DOCTYPE html>
<html>
<head>
<title>For loop in Flask</title>
</head>
<!-- Adding some style to table (OPTIONAL) -->
<style type="text/css">
th:tr{
color: blue;
}
tr:nth-of-type(2n){
border: 1px solid black;
background-color: rgba(150, 150, 150, 0.5);
}
td{
padding: 8px 8px;
border: 1px solid black;
}
</style>
<body>
<table style="margin-left: 20px;">
<!-- Table headers -->
<th>
<tr style="color: green; ">
<td>Serial Number</td>
<td>Pokemon Name</td>
</tr>
</th>
<!-- For loop logic of jinja template -->
{%for i in range(0, len)%}
<!-- table rows -->
<tr>
<td>{{i}}</td>
<td>{{Pokemons[i]}}</td>
{%endfor%}
</tr>
</table>
</body>
</html>
Salida:
Sin escribir ningún dato de la lista, la tabla se generará automáticamente.
Instrucciones para ejecutar el código:
- Descargue los archivos del enlace proporcionado arriba o cree y almacene el código en el mismo formato
- Ejecute el archivo app.py en el directorio raíz
- Vaya al host local ( http://127.0.0.1:5000/ en mi caso) y allí tiene el sitio web
Publicación traducida automáticamente
Artículo escrito por Kartikaybhutani y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA