Paso 5: Mejora tu página web
1. crear los directorios necesarios y las carpetas
mkdir templates cd templates touch home_page.html atom home_page.html cd .. mkdir static cd static mkdir js cd js touch home_page.js atom home_page.js cd ../..
Estos serán los archivos HTML y JavaScript para nuestra página. Estos directorios son los nombres estándar en matraz y le recomiendo que use, sin embargo, puede especificar diferentes nombres al crear la aplicación en el paso anterior. Ahora puede editar estos archivos de ejemplo y mostrar que algo que quieres, es por debajo.
home_page.js:
alert('Testing JS'); // Simple alert to determine if file was imported home_page.html:
<html> <body> <h1>Our Home Page</h1> A list <ul> {% for i in range(num) %} <li>bullet {{i}}</li> {% endfor %} </ul> </body> <script type='text/javascript' src="{{url_for('static', filename='js/home_page.js')}}"></script> </html> Puedes ver el resultado en la imagen de arriba. Tenga en cuenta el uso de las llaves dobles y rizado por ciento de apoyo, estos se utilizan para las plantillas. Matraz utiliza un marco llamado "Jinja2", que utiliza estos símbolos. Las plantillas le permite pasar variables a la página html y controlar lo que es parece que antes de ser enviados a un navegador. Esto es muy potente, y puedes leer más aquí
2. cambiar el control
El controlador que hiciste anteriormente, en home/views.py, hay que cambiar para volver una pantalla para esta plantilla, en lugar de una cadena. Esto se logra con el uso de "render_template()" de frasco, que usted puede pensar en como devolver una página html. A continuación es lo que debe buscar el archivo home/views.py como ahora.
<p>from flask import Blueprint, render_template</p><p>home_view = Blueprint('home_view', __name__)</p> def display_home_page(): return render_template('home_page.html', num=10) Ahora podrá editar el parámetro dado a render_template() y el archivo html para el control de lo que se muestra.
