Bienvenidos

http://www.ipeacetv.com/

sábado, 4 de abril de 2026

Pagina web con python

 from flask import Flask, render_template


app = Flask(__name__)


# Definir ruta principal

@app.route("/")

def index():

  """Renderiza la página de inicio."""

  return render_template("index.html")  # Busca index.html en la carpeta 'templates'


# Definir otra ruta

@app.route("/acerca")

def acerca():

  """Renderiza la página 'Acerca de'."""

  return render_template("acerca.html")


# Definir una ruta con parámetro

@app.route("/usuario/<nombre>")

def usuario(nombre):

  """Renderiza una página de usuario con un nombre específico."""

  return render_template("usuario.html", nombre=nombre)



if __name__ == "__main__":

  app.run(debug=True)



Explicación detallada:

1. Instalación de Flask:

Primero, necesitas instalar Flask. Abre una terminal o línea de comandos y ejecuta:

# pip install flask

Pasos para instalar Flask en Debian:

 

sudo apt update  && sudo apt upgrade -y 

2 . Instalar Python 3 y el gestor de paquetes pip:


sudo apt install python3  python3-pip  python3-venv -y

 

3- Crear el directorio de tu proyecto y un entorno virtual (venv):

 

mkdir mi_proyecto

cd mi_proyecto

python3 -m venv venv  


4Activar el entorno virtual

source venv/bin/activate

Al hacer esto, tu terminal mostrará (venv) al inicio

5. Instalar Flask:

Pip install flask


6. Verificar la instalación escribe en una terminal

flask --version

Nos devolvera en nuestro caso

Python 3.13.12

Flask 3.1.2

Werkzeug 3.1.5

Ejecutar una primera aplicación

Una vez instalado, puedes crear un archivo app.py, activar el entorno y ejecutar con  flask run

Para salir del entorno virtual, simplemente escribe deactivate


  1. Creación de la aplicación Flask:

    • app = Flask(__name__): Crea una instancia de la clase Flask__name__ es una variable especial de Python que contiene el nombre del módulo actual. Es importante para que Flask sepa dónde buscar los archivos de plantilla y otros recursos.
  2. Definición de rutas (endpoints):

    • @app.route("/"): Este decorador asocia una función de Python (en este caso, index()) con una URL específica (en este caso, la ruta raíz /). Cuando un usuario visita la URL /, la función index() se ejecuta.
    • @app.route("/acerca"): Define una ruta para la página "Acerca de".
    • @app.route("/usuario/<nombre>"): Define una ruta con un parámetro llamado nombre. Este parámetro será pasado a la función usuario() como un argumento. Por ejemplo, si un usuario visita /usuario/Juan, la función usuario() se llamará con nombre = "Juan".
  3. Funciones de las rutas:

    • def index():: Esta función se ejecuta cuando un usuario visita la ruta /. Utiliza render_template("index.html") para renderizar el archivo HTML llamado index.html que debe estar ubicado en la carpeta templates.
    • def acerca():: Similar a index(), esta función renderiza el archivo acerca.html.
    • def usuario(nombre):: Esta función renderiza el archivo usuario.html y pasa el valor del parámetro nombre a la plantilla HTML. Esto permite que el nombre del usuario se muestre en la página.
  4. Ejecución de la aplicación:

    • if __name__ == "__main__":: Esta condición asegura que el código dentro del bloque if solo se ejecute cuando el script se ejecuta directamente (no cuando se importa como un módulo).
    • app.run(debug=True): Inicia el servidor de desarrollo de Flask. debug=True habilita el modo de depuración, que proporciona mensajes de error más detallados y reinicia el servidor automáticamente cuando se realizan cambios en el código. Es muy importante NO usar debug=True en producción (desarrollo).

Estructura de archivos:

Debes crear una estructura de archivos como la siguiente:

mi_pagina_web/
├── app.py        # Tu código Python (este archivo)
└── templates/    # Carpeta para las plantillas HTML
    ├── index.html   # Página de inicio
    ├── acerca.html   # Página "Acerca de"
    └── usuario.html  # Página de usuario

Ejemplos de archivos HTML (dentro de la carpeta templates):

  • templates/index.html:
<!DOCTYPE html>
<html>
<head>
  <title>Mi Página Web</title>
</head>
<body>
  <h1>¡Bienvenido a mi página web!</h1>
  <p>Esta es la página de inicio.</p>
  <a href="/acerca">Acerca de</a>
</body>
</html>
  • templates/acerca.html:
<!DOCTYPE html>
<html>
<head>
  <title>Acerca de</title>
</head>
<body>
  <h1>Acerca de</h1>
  <p>Esta es la página "Acerca de".</p>
  <a href="/">Inicio</a>
</body>
</html>
  • templates/usuario.html:
<!DOCTYPE html>
<html>
<head>
  <title>Perfil de Usuario</title>
</head>
<body>
  <h1>Perfil de Usuario</h1>
  <p>Bienvenido, {{ nombre }}!</p>  <!-- Usamos la variable 'nombre' pasada desde Python -->
  <a href="/">Inicio</a>
</body>
</html>

Cómo ejecutar la aplicación:

  1. Guarda el código Python como app.py.
  2. Crea la carpeta templates y los archivos HTML dentro de ella.
  3. Abre una terminal o línea de comandos y navega al directorio donde guardaste app.py.
  4. Ejecuta el comando: python app.py
  5. Abre un navegador web y visita la URL http://127.0.0.1:5000/ (o la URL que se muestre en la terminal).

Puntos importantes:

  • Plantillas HTML (Jinja2): Flask utiliza el motor de plantillas Jinja2. Las plantillas HTML se escriben con una sintaxis especial que permite insertar variables de Python y lógica de control.
  • Carpetas y archivos: Asegúrate de que la estructura de archivos sea correcta. Los archivos HTML deben estar en la carpeta templates.
  • Modo de depuración: El modo de depuración es útil durante el desarrollo, pero debes desactivarlo en producción. En producción, el servidor se ejecuta de otra manera para mayor seguridad y rendimiento.
  • URL dinámicas: Las rutas con parámetros como /usuario/<nombre> permiten crear URL dinámicas que pueden mostrar información diferente según el valor del parámetro.
  • render_template: Esta función es crucial porque busca los archivos HTML dentro de la carpeta templates y los renderiza, reemplazando las variables con los valores correspondientes.
  • Variables en las plantillas: En el ejemplo templates/usuario.html{{ nombre }} es cómo insertas una variable de Python dentro del HTML. Flask/Jinja2 reemplazará {{ nombre }} con el valor de la variable nombre que pasaste desde el código Python.

Próximos pasos:

  • Aprender más sobre Jinja2: Profundiza en la sintaxis de las plantillas Jinja2 para crear plantillas más complejas.
  • Agregar más rutas y funciones: Crea más rutas y funciones para agregar más páginas y características a tu sitio web.
  • Usar bases de datos: Conecta tu aplicación Flask a una base de datos para almacenar y recuperar datos.
  • Desarrollar el front-end: Utiliza CSS y JavaScript para mejorar la apariencia y la interactividad de tu sitio web.
  • Despliegue: Aprende a desplegar tu aplicación Flask en un servidor para que esté disponible en Internet.
  • Seguridad: Implementa medidas de seguridad para proteger tu aplicación contra ataques.
  • Frameworks front-end: Considera usar frameworks como Bootstrap, Tailwind CSS, o React para simplificar el desarrollo del front-end.














No hay comentarios:

Publicar un comentario