.png)
%209.33.34%E2%80%AFp.m..png "Sistema de Encuestas en Línea con Python + Flask y Bootstrap")
%209.33.34%E2%80%AFp.m..png)
%209.33.43%E2%80%AFp.m..png)
Introducción
Las encuestas en línea son una herramienta fundamental para recopilar opiniones, obtener datos y tomar decisiones informadas. En este artículo, exploraremos cómo construir un sistema de encuestas en línea utilizando Python con Flask, Bootstrap 5 y Matplotlib para la visualización de resultados.
Tecnologías Utilizadas
Para el desarrollo de esta aplicación utilizamos:
Python: Lenguaje de programación principal.
Flask: Framework web ligero para la gestión del backend.
Bootstrap 5: Librería de diseño responsivo para mejorar la interfaz de usuario.
Matplotlib: Para generar gráficos de resultados de encuestas.
HTML5, CSS3 y JavaScript: Para la estructuración y estilización del frontend.
Características del Proyecto
✔ Crear encuestas dinámicas ingresando una pregunta y múltiples opciones. ✔ Votar en encuestas de manera fácil e intuitiva. ✔ Visualizar resultados con gráficos generados dinámicamente. ✔ Interfaz moderna y responsiva con Bootstrap 5. ✔ Modo oscuro y diseño atractivo para mejorar la experiencia de usuario.
Estructura del Proyecto
📁 encuesta-app/ # Carpeta raíz del proyecto
│── 📄 app.py # Archivo principal de la aplicación Flask
│── 📂 templates/ # Carpeta para archivos HTML
│ │── 📄 index.html # Página principal con la lista de encuestas
│ │── 📄 encuesta.html # Página para responder una encuesta
│ │── 📄 resultados.html # Página para ver los resultados de una encuesta
│ │── 📄 nueva_encuesta.html # Página para crear nuevas encuestas
│── 📂 static/ # Carpeta para archivos estáticos
│ │── 📄 estilos.css # Archivo CSS opcional para personalización
│── 📄 requirements.txt # Lista de dependencias para instalar con pip
│── 📄 README.md # Documentación del proyectoCódigo Fuente
📌 Backend con Flask (app.py)
from flask import Flask, render_template, request, redirect, url_for
import matplotlib
import matplotlib.pyplot as plt
import os
matplotlib.use('Agg') # Evita errores en macOS
app = Flask(__name__)
encuestas = {}
@app.route('/')
def index():
return render_template('index.html', encuestas=encuestas)
@app.route('/nueva_encuesta', methods=['GET', 'POST'])
def nueva_encuesta():
if request.method == 'POST':
pregunta = request.form.get('pregunta')
opciones = request.form.get('opciones').split(',')
if not pregunta or not opciones:
return render_template('nueva_encuesta.html', error="Debe completar todos los campos.")
nueva_id = str(len(encuestas) + 1)
encuestas[nueva_id] = {
"pregunta": pregunta,
"opciones": opciones,
"respuestas": {opcion: 0 for opcion in opciones}
}
return redirect(url_for('index'))
return render_template('nueva_encuesta.html')
if __name__ == '__main__':
if not os.path.exists('static'):
os.makedirs('static')
app.run(debug=True)📌 Interfaz de Creación de Encuestas (nueva_encuesta.html)
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Crear Nueva Encuesta</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
</head>
<body class="bg-dark text-light">
<div class="container mt-5">
<h1 class="text-center">➕ Crear Nueva Encuesta</h1>
<form action="/nueva_encuesta" method="post">
<div class="mb-3">
<label for="pregunta" class="form-label">Pregunta:</label>
<input type="text" name="pregunta" id="pregunta" class="form-control" required>
</div>
<div class="mb-3">
<label for="opciones" class="form-label">Opciones (separadas por coma):</label>
<input type="text" name="opciones" id="opciones" class="form-control" required>
</div>
<button type="submit" class="btn btn-success w-100">Crear Encuesta</button>
</form>
<a href="/" class="btn btn-secondary mt-3 w-100">Volver</a>
</div>
</body>
</html>
No hay comentarios