Python Academy · Lección

Creación de una aplicación web sencilla

Cree su primera aplicación web con Flask

Creación de una aplicación web sencilla es una lección gratuita de Python Academy en CoddyKit. Esta es la lección 3 de 4. Puedes leer la lección completa abajo gratuitamente — luego la practicas en el navegador con un editor de código integrado y un tutor de IA 24/7. Forma parte de la ruta de aprendizaje de Python Academy, y tu progreso se sincroniza en la web y la app de CoddyKit. El curso de Python Academy incluye 4 lecciones en total.

Crear una aplicación web sencilla

Ahora que ha aprendido los conceptos básicos de Flask, es hora de crear una aplicación web sencilla. Esta aplicación incluirá varias rutas, plantillas HTML y cierta interactividad.

En esta lección, crearemos una aplicación web básica paso a paso.

Creación de una aplicación web sencilla — ilustración 1

Paso 1: Configurar el proyecto

Cree una carpeta nueva para su proyecto e inicialice un entorno virtual:

python -m venv venv

Active el entorno virtual e instale Flask:

pip install flask

# Setting up the project
from flask import Flask

app = Flask(__name__)
print("Project setup complete")

Paso 2: Crear la estructura de la aplicación

Cree las siguientes carpetas y archivos:

app.py: Archivo principal de la aplicación.
templates/: Carpeta para las plantillas HTML.
static/: Carpeta para archivos estáticos, como hojas de estilo CSS e imágenes.

Paso 3: Definir las rutas

En app.py, defina las rutas para la página de inicio y una página about:

# Defining routes
from flask import Flask

app = Flask(__name__)

@app.route('/')
def home():
    return '<h1>Welcome to My Web App</h1>'

@app.route('/about')
def about():
    return '<h1>About This App</h1>'

if __name__ == '__main__':
    app.run(debug=True)

Paso 4: Añadir plantillas

Cree un archivo HTML llamado home.html dentro de la carpeta templates/:

<!-- home.html -->
<!DOCTYPE html>
<html>
<head>
    <title>Home</title>
</head>
<body>
    <h1>Welcome to My Web App</h1>
    <a href="/about">About</a>
</body>
</html>

Paso 5: Usar render_template

Actualice las rutas home y about para que utilicen las plantillas:

# Using templates
from flask import render_template

@app.route('/')
def home():
    return render_template('home.html')

@app.route('/about')
def about():
    return render_template('about.html')

Paso 6: Añadir archivos estáticos

Cree un archivo style.css dentro de la carpeta static/ y vincúlelo en home.html:

/* style.css */
body {
    font-family: Arial, sans-serif;
    background-color: #f4f4f9;
    color: #333;
}

Paso 7: Ejecutar la aplicación

Ejecute su aplicación Flask:

python app.py

Abra el navegador y vaya a http://127.0.0.1:5000/ para ver su aplicación web en funcionamiento.

Errores comunes al crear aplicaciones web

Estos son algunos errores que debe evitar:

No organizar la estructura de la aplicación (por ejemplo, no incluir las carpetas templates/ y static/).
Codificar directamente las URL en lugar de usar url_for().
No probar la aplicación en modo de depuración.

¿Qué ha aprendido?

En esta lección, ha aprendido:

Cómo configurar la estructura de un proyecto Flask.
Cómo definir rutas y usar plantillas.
Cómo incluir archivos estáticos, como CSS, en su aplicación.
Cómo ejecutar su aplicación Flask y verla en un navegador.

¡Excelente trabajo! Pasemos al siguiente tema.

Creación de una aplicación web sencilla — ilustración 11

Preguntas frecuentes

¿La lección «Creación de una aplicación web sencilla» es gratis?

Sí — el texto completo de «Creación de una aplicación web sencilla» es gratis para leer aquí en la web. Para practicarla de forma interactiva (editor de código integrado y tutor de IA 24/7) y desbloquear el resto del curso de Python Academy, actualiza a CoddyKit PRO. El curso de Python Academy incluye 4 lecciones en total.

¿Qué aprenderé en «Creación de una aplicación web sencilla»?

Cree su primera aplicación web con Flask Practicas Python Academy con código real que ejecutas directamente en el navegador, y un tutor de IA 24/7 responde tus preguntas mientras trabajas en la lección.

¿Necesito experiencia previa para empezar Python Academy?

No se requiere experiencia previa. Python Academy en CoddyKit está estructurado para principiantes hasta estudiantes avanzados, así que puedes empezar aquí o desde el inicio y avanzar a tu ritmo. Esta es la lección 3 de 4.

¿Cuánto tiempo toma la lección «Creación de una aplicación web sencilla»?

La mayoría de las lecciones de CoddyKit toman alrededor de 5–10 minutos. Cada una es compacta e interactiva, así que avanzas constantemente y retomas exactamente por donde dejaste en la web y la app.

¿Puedo escribir y ejecutar código en esta lección de Python Academy?

Sí. Cada lección de Python Academy incluye un editor de código integrado, así que escribes y ejecutas código real directamente en tu navegador y obtienes retroalimentación instantánea de IA — sin configuración local necesaria.

Todas las lecciones de este curso

← Volver a Python Academy