Newsletter para devsEntra
Web Reactiva

WR 159: Caso de estudio: 3 formas de resolver un requisito

Una pregunta inquietante, una pistola humeante y un contador de personas.

Escúchalo también en Spotify | Apple Podcasts | Google Podcasts | iVoox
Frontend:UX/UI
Frontend:CSS Library
Soft Skills:Aprendizaje

5 aprendizajes que te llevas de este episodio:

  • Importancia de la simplicidad y la lógica como base en el desarrollo web.
  • Diferenciación entre quienes buscan soluciones inmediatas y los que desean aprender.
  • El contador como ejercicio fundamental de programación y construcción de sistemas.
  • Exploración de herramientas y tecnologías (HTML, CSS, JavaScript, frameworks) para innovar en proyectos.
  • Reflexión sobre el aprendizaje continuo y la transformación de ideas en soluciones reales.

Un contador y la esencia de aprender haciendo

El desarrollo web no consiste en copiar códigos o aplicar fórmulas preestablecidas. Es, en cambio, un proceso de descubrir, experimentar y aprender a pensar en problemas simples desde la raíz. Un contador, esa sencilla aplicación que suma y resta sin perder de vista restricciones mínimas como no bajar de cero o limitar el aforo, se presenta como un ejercicio fundamental para cualquier persona que quiera, aún sin experiencia, comenzar a entender la magnitud de construir algo desde cero.

Hace unos momentos, en una transmisión en vivo se escucharon las palabras:
“¡Web Reactiva! Episodio 159 Bienvenidas todas y bienvenidos todos”
Esta invitación a aprender y explorar tecnologías sirve de entrada a un universo donde cada botón y cada parámetro codificado no son simples comandos, sino piezas de un rompecabezas mayor sobre la lógica y el diseño.

La sencillez como punto de partida

La esencia del propósito radica en la sencillez. La idea de contar personas en un espacio determina una serie de retos que, en apariencia, parecen triviales pero revelan aspectos profundos de diseño, usabilidad y lógica. El contador no es solo un componente aislado; es un componente que, aplicado con perspicacia, puede ser la base para sistemas complejos, integrándose en controles de aforo en bares, salas de reuniones e incluso interfiriendo con dispositivos inteligentes.

La reflexión sobre este “contador” permite formular un marco de aprendizaje divido en tres perfiles:

Personas que buscan la solución sin aprender

Hay quienes se encuentran en situaciones en las que necesitan una solución inmediata, sin el interés de sumergirse en la complejidad del desarrollo. Para ellos, la búsqueda se limita a herramientas ya desarrolladas, quizás con mínima personalización. Esta postura se caracteriza por los siguientes rasgos:

  • Se busca que el producto haga lo mínimo indispensable sin alterar la esencia.
  • La prioridad es la velocidad de implementación, aunque la solución no se adapte al crecimiento.
  • Se prefieren productos gratuitos o de bajo coste, como algún script o plugin ya consolidado.

El proceso de búsqueda se reduce a localizar un componente “hecho” en una plataforma confiable. Como se comentó en la transmisión, “… si he encontrado algo controldeaforo.com… hace lo que tiene que hacer.” Esto demuestra que, en ocasiones, dejarse llevar por la necesidad inmediata puede conducir a soluciones prácticas aunque poco personalizables.

Personas que quieren aprender y crecer con la herramienta

Para aquellos que, aun siendo novatos, tienen la motivación de adentrarse en el mundo del desarrollo, el ejercicio del contador se transforma en un taller de creatividad y autodescubrimiento. Este perfil se caracteriza por:

  • Buscar entender la lógica detrás de cada interacción, desde la suma y la resta hasta la manipulación de parámetros externos.
  • Aprovechar la oportunidad para experimentar con herramientas de frontend básicas como HTML, CSS y JavaScript, e incluso explorar marcos de trabajo modernos como Vue o React.
  • Descubrir en la simplicidad la posibilidad de construir, paso a paso, una aplicación web completa y escalable.
  • Considerar el proceso creativo como un camino para aprender y descubrir los “tres pasos” que se plantean en el reto: para quien no sabe y no quiere aprender, para quien quiere aprender y crecer, y para quien ya domina el tema.

En este escenario, construir un contador es tan solo el inicio. Se trata de aprender a:

  • Configurar parámetros y leer valores externos, por ejemplo, recibir datos de la URL.
  • Utilizar la persistencia de datos y pensar en la integración con bases de datos o colas de mensajes.
  • Dar un paso extra en el despliegue, optando por servicios gratuitos en la nube, como Netlify o AWS, en lugar de depender de soluciones tradicionales.

El ejercicio enseña que lo básico es fundamental para cimentar conocimientos futuros y que la resolución de pequeños problemas es la llave a desafíos mayores.

Personas que dominan la materia y buscan innovar

El perfil de los expertos, el más peligroso y a la vez el más prometedor, se enfrenta al desafío de evitar caer en la trampa de lo “sencillo” sin cuestionarse la mejora continua. Estos desarrolladores, con una amplia experiencia, tienden a:

  • Recurrir a las herramientas habituales, incluso si estas no son las óptimas para el caso, simplemente por inercia.
  • Agregar funcionalidades adicionales que exceden el alcance mínimo requerido, lo que lleva a sistemas innecesariamente complejos y difíciles de mantener.
  • Arriesgarse a experimentar con tecnologías y marcos nuevos, buscando, por ejemplo, implementar una lógica usando vanilla JavaScript en lugar de librerías comunes, o migrar entre diferentes paradigmas de despliegue.

El reto para ellos es mantener la claridad y la precisión. Se requiere una revisión constante del código, la eliminación de malas prácticas y la búsqueda de una solución que, pese a su simplicidad, sea robusta y escalable.

Reflexiones sobre la filosofía del desarrollo

La idea de construir un contador puede parecer trivial, pero invita a pensar en varios conceptos fundamentales de la programación:

  • La importancia de la simplicidad como un punto de partida que, al ser bien ejecutado, permite construir sistemas complejos sobre esa base.
  • La necesidad de autoevaluarse constantemente. Al igual que la escritura, plasmar ideas en código obliga a posteriormente repasar y ajustar cada línea, cada algoritmo, hasta conseguir la solución óptima.
  • La capacidad de la tecnología para ser un vehículo de aprendizaje continuo. Cada iteración, cada cambio en el código, aporta un grado nuevo de comprensión que solo se adquiere a través de la práctica.

Esta analogía con la escritura se vuelve palpable cuando se medita en el valor de transformar ideas vagas en soluciones contundentes. Al igual que poner en palabras un concepto requiere revisar, reescribir y afinar la estructura, programar un contador o cualquier otra aplicación requiere de constantes revisiones y refactorización para alcanzar la perfección.

La práctica enfatiza que:

  • La claridad en el código refleja un pensamiento ordenado y una visión precisa del problema.
  • La experimentación, aunque a veces lleve a funcionalidades de más o a complicaciones innecesarias, forma parte integral del aprendizaje.
  • Incluso las soluciones inmediatas o “compradas” pueden ser útiles si se acompañan de una mentalidad crítica que observe las limitaciones y busque la mejora.

Adoptar la mentalidad del contador

El ejercicio del contador nos permite también repensar cómo se abordan problemas aparentemente simples:

  • A veces, se opta por la comodidad y la inmediatez, eligiendo una solución ya implementada sin cuestionar el porqué.
  • En otras ocasiones, se ve en la limitación del proyecto la oportunidad de aprender, configurando el contador de manera que, además de cumplir la función básica, se abra la puerta a la personalización.
  • Con experiencia, se llega a comprender que la verdadera esencia del desarrollo consiste en equilibrar lo aprendido con la innovación, evitando la trampa de la “zona de confort” tecnológica.

Esta reflexión invita a mantenerse en constante búsqueda de nuevas formas de mejorar el proceso, sin perder de vista que lo elemental —la suma, la resta, el control— es el verdadero motor de la creatividad.

Una lista de aprendizajes clave

El análisis de un proyecto tan elemental como un contador de personas puede resumirse en algunos aprendizajes esenciales:

  • El diseño minimalista permite establecer una base sólida para proyectos futuros.
  • La persistencia en el proceso de construcción es tan crucial como la solución en sí.
  • La exposición de ideas en código requiere clarificar y retocar constantemente la propuesta original.
  • La variabilidad en la elección de herramientas (vanilla JavaScript, frameworks modernos o soluciones en la nube) enriquece la experiencia y amplía el espectro de posibilidades técnicas.
  • Las soluciones inmediatas pueden ser útiles, pero el verdadero progreso se alcanza cuando se busca comprender y, eventualmente, innovar.

Hacia nuevas fronteras en el desarrollo personal

El proceso de escribir y construir un proyecto, sea tan simple como un contador, se convierte en una metáfora del desarrollo personal en programación y en la vida. La transformación ocurre en la iteración, en la búsqueda del detalle y en el desafío de plasmar ideas en una estructura que funcione de forma real y comprobable.

Más allá de la funcionalidad, está la pregunta acerca de cómo se aprende y se construye sobre la base misma de lo que se conoce, sin temor de equivocarse o de sobrecomplicar las cosas. La experiencia nos enseña que atender a lo mínimo puede llevar a soluciones sofisticadas si se combina la mentalidad de aprendiz con la audacia de un experto.

La mentalidad del desarrollador, ya sea primario o consumado, se fortalece en la medida en que se enfrenta a retos pequeños y aparentemente triviales, transformándolos en oportunidades constantes de crecimiento. Un contador, en última instancia, es mucho más que un simple acumulador de dígitos: es una lección sobre la claridad, la precisión y la capacidad de crear con intención.

Adentrarse en esta práctica implica reconocer que:

  • Cada línea de código es una oportunidad para pensar de manera crítica.
  • Los errores, por mínimos que sean, son el terreno fértil para aprender y mejorar.
  • La tecnología nunca deja de sorprender, y en su simplicidad reside la posibilidad de construir sistemas que impacten en la forma en que interactuamos con el mundo real.

En el camino del desarrollo, la búsqueda constante de la perfección técnica se mezcla con la necesidad humana de dejar una marca, de encontrar en cada problema una puerta a nuevas ideas. Así, construir un contador se vuelve un microcosmos de todo lo que significa programar: un equilibrio en el que se funden la lógica, el diseño y la creatividad.

Aprovechar cada oportunidad para revisar y repensar nuestras soluciones es, en cierto modo, el reflejo de cómo debemos abordar la vida misma: con humildad, persistencia y la convicción de que, aunque nuestras ideas sean inicialmente simples, el proceso de plasmarlas en una realidad concreta siempre nos empuja a ser mejores.

El otro día Óscar Martín me lanzaba una pregunta “A calzón quitado” en Fenómeno Mutante.

Me daba tres opciones para algo.

Antes te voy a proponer tres opciones a ti:

  1. Leer a la 🧨 newsletter de Web Reactiva, la columna dominical más developer en castellano.
  2. Suscribirte gratis a CocoStack para estar al día de lo que ocurre en el ecosistema Jamstack.
  3. Verme con gorra de capitán una vez más en un nuevo curso sobre CSS en la Zona Premium.

Las tres formas de construir una web

La pregunta de Óscar era triple. Quería saber, sin yo conocer lo que me iba a soltar, cuál era mi consejo para comenzar un proyecto en la web con cada uno de estos supuestos:

  1. Si alguien no sabe nada y no quiere aprender
  2. Si alguien no sabe nada pero si le gusta aprender
  3. Alguien que si que sabe

La pregunta me gustó tanto que me la he traido hoy al podcast, después de tratar sobre renovaciones de aplicaciones viejas en el último premium.

Requisito único: contador de personas

He adaptado la pregunta a un requisito con mucho futuro en los tiempos que corren: una aplicación web que cuente personas.

Que tenga un límite de aforo en porcentaje sobre el total de personas que entren en la sala.

Y que no pueda contar en negativo, no tenemos en cuenta a los espectros, de momento.

La aplicación web parece muy tonta pero no lo es a medida que avanza el episodio.

Es más, ¿por qué no convertirla en un negocio real?

Algunos recursos

Por supuesto, La fábula de los tres hermanos de Silvio Rodríguez.

En el plano más técnico hablamos de controldeaforo.com, tiinyhost, kuzzle, appwrite o beanstalkd.

También te recomiendo que busques “counter” en codepen.io o, si quieres algo más avanzado, veas esta lección básica sobre Vuex sobre un contador.

¡Nos escuchamos el próximo martes!

Escrito por:

Imagen de Daniel Primo

Daniel Primo

CEO en pantuflas de Web Reactiva. Programador y formador en tecnologías que cambian el mundo y a las personas. Activo en linkedin, en substack y canal @webreactiva en telegram
Web Reactiva Newsletter