¿Cómo se creó BioPlayground?

Este artículo no es un tutorial de programación. Es una historia sobre "por qué empecé, con qué obstáculos me encontré y cómo los superé".

Espero que la experiencia de un investigador que no sabía ni una sola línea de código y terminó creando herramientas bioinformáticas sirva de inspiración para quienes comienzan con DevBench.

El inicio: "¿Tengo que dibujar este gráfico a mano cada vez?"

Todo comenzó con las tareas repetitivas.

El proceso de organizar semanalmente los resultados experimentales en Excel, crear repetidamente gráficos con el mismo formato y enviarlos por correo electrónico a los colegas. La pregunta "¿No se puede automatizar esto?" fue la semilla de BioPlayground.

Al principio, solo era un script de Python:

import matplotlib
matplotlib.use("Agg")
import matplotlib.pyplot as plt

data = [23.5, 45.2, 67.8, 89.1, 12.3]
labels = ["Sample A", "Sample B", "Sample C", "Sample D", "Sample E"]

fig, ax = plt.subplots(figsize=(8, 5))
ax.bar(labels, data, color="#2d5a3d")
ax.set_ylabel("Expression Level")
ax.set_title("Gene Expression Comparison")
fig.savefig("expression.png", dpi=150, bbox_inches="tight")
plt.close(fig)

print("Gráfico guardado: expression.png")
assert len(data) == len(labels)

Este script me ahorraba 30 minutos cada semana. "Así es como la programación resulta realmente útil".

La primera barrera: "¿Cómo hacer que otros también puedan usarlo?"

El script de Python solo podía usarlo yo. Cuando le decía a un compañero: "Instala Python y ejecuta este script", la respuesta siempre era la misma:

"Solo envíame los resultados".

Una aplicación web era la solución. Con una sola URL, cualquiera podría usarla desde cualquier dispositivo.

tech_stack = {
    "Frontend": "React (Next.js)",
    "Estilización": "Tailwind CSS",
    "Backend": "Supabase",
    "Despliegue": "Vercel",
    "Gráficos": "Recharts",
}

for category, tool in tech_stack.items():
    print(f"{category}: {tool}")

assert len(tech_stack) == 5

Al principio, los nombres de las tecnologías me parecían un idioma incomprensible. Pero, a medida que fui aprendiendo, me di cuenta de algo: un framework es solo una herramienta; lo importante es el problema que se quiere resolver.

La segunda barrera: "¿Por qué este código funcionaba ayer y hoy no?"

Es la pesadilla de programar sin Git.

• app_v1.py
• app_v2_final.py
• app_v2_final_real.py
• app_backup_20260315.py

Después de aprender Git, este problema desapareció por completo. Todos los cambios quedan registrados y se puede volver atrás en cualquier momento.

git_lessons = [
    "Los commits deben ser frecuentes y pequeños",
    "Los mensajes de commit explican el 'por qué'",
    "No se hace push directo a la rama principal",
    "La revisión de código es una red de seguridad para detectar errores propios",
]

for i, lesson in enumerate(git_lessons, 1):
    print(f"Lección {i}: {lesson}")

assert len(git_lessons) == 4

La tercera barrera: "Los datos son demasiado grandes y el navegador se bloquea"

Los datos biológicos son masivos. El conjunto de datos GTEx tiene decenas de miles de filas y los datos clínicos de TCGA incluyen miles de pacientes. Si se carga todo esto en el navegador, la pestaña se bloquea.

La solución fue resumir los datos en el servidor y enviar solo los resultados al navegador:

strategies = {
    "Filtrado del lado del servidor": "Enviar solo la parte necesaria de los datos completos a través de la API",
    "Paginación": "Mostrar solo 100 filas a la vez",
    "Cálculo previo": "Calcular y almacenar las estadísticas por adelantado",
    "Carga diferida": "Cargar datos adicionales al desplazarse",
}

for strategy, desc in strategies.items():
    print(f"- {strategy}: {desc}")

assert "Filtrado del lado del servidor" in strategies

Reflexión: Lo que gana un investigador al aprender a programar

Aprender a programar no te convierte en desarrollador. Sin embargo, te hace un investigador más poderoso.

gains = {
    "Automatización": "Liberación de tareas repetitivas → Concentrarse en la investigación",
    "Reproducibilidad": "Script = cuaderno de laboratorio perfecto",
    "Comunicación": "Hablar el mismo idioma que el equipo de desarrollo",
    "Independencia": "Poder crear las herramientas deseadas directamente",
    "Carrera profesional": "Expansión hacia la bioinformática y la ciencia de datos
}

for gain, desc in gains.items():
    print(f"✓ {gain}: {desc}")

assert len(gains) == 5

Para quienes comienzan con DevBench

No intenten aprenderlo todo perfectamente antes de empezar. Un código que resuelve el problema es buen código, aunque sea incompleto.

El primer commit de BioPlayground era vergonzosamente desastroso. Sin embargo, ese código imperfecto dio origen a la herramienta de hoy.

Nadie sabe a dónde les llevará su primer print("Hello, Biology!").

El uso de las herramientas tratadas en este artículo se puede aprender paso a paso en otros temas de DevBench. Comience con los fundamentos comunes.