Curso de Flutter con Firebase

Qué es el patrón BLoC en Flutter

Curso de Flutter con Firebase

Contenido del curso

Qué es el patrón BLoC en Flutter

Resumen

El patrón BLoC (Business Logic Component) es una arquitectura para aplicaciones Flutter que separa la lógica de negocio de la interfaz de usuario. Esta separación te da mayor rendimiento y escalabilidad cuando tu app empieza a crecer. Si vienes del desarrollo móvil y quieres ordenar tu código, aquí entenderás cómo encaja cada pieza.

Cómo entender BLoC con la analogía de una ciudad

Imagina que Flutter es una ciudad con varios medios de transporte: buses, camiones y trenes que mueven personas, animales y mercancías de un lado a otro.

Dentro de esa ciudad hay tres partes fundamentales que sostienen toda la operación:

  • La UI, que son las paradas de autobuses repartidas por la ciudad.
  • El BLoC, que actúa como el centro de control de todos los transportes.
  • Los streams, que son los autobuses por donde viajan los datos.

¿Qué hace exactamente un BLoC? Es el centro de control que recibe eventos desde la UI, decide qué hacer con ellos (como consultar una base de datos) y devuelve un estado con el resultado.

Cuáles son las 4 partes del patrón BLoC en Flutter

Para construir una aplicación con esta arquitectura vas a trabajar con cuatro piezas que se conectan en un flujo claro.

Eventos, BLoCs, streams y estados

Cada parte tiene un rol específico dentro del flujo de datos.

  • Eventos: son las personas subiendo al autobús. Representan acciones como obtener datos o enviar datos.
  • BLoCs: son el centro de control de transporte. Cuando llega un evento, deciden hacia dónde dirigirlo, por ejemplo, hacia una consulta a la base de datos.
  • Streams: son las rutas que toman los transportes para llegar a su destino. Por ahí viajan los datos en tiempo real.
  • Estados: son las paradas de autobús. Indican si la operación llegó a su destino, si fue exitosa o si hubo un error.

Con estas cuatro piezas tienes un ciclo completo de comunicación entre la interfaz y la lógica de negocio.

Cómo es el flujo completo de datos en BLoC

El flujo arranca cuando el usuario interactúa con la UI y termina cuando esa misma UI se actualiza con la respuesta.

  1. Se dispara un evento, como una persona subiéndose a su medio de transporte.
  2. El evento llega al BLoC, que decide hacia dónde dirigir esa información.
  3. El BLoC emite un estado, indicando si la operación fue exitosa o errónea.
  4. Ese estado viaja por un stream de regreso a la UI para actualizar la información en pantalla.

¿Por qué separar la lógica de la UI con BLoC? Porque ganas rendimiento, escalabilidad y un código más fácil de mantener cuando la app crece o cambia de diseño.

Este ciclo se repite cada vez que el usuario realiza una acción, y es la base que vas a aplicar dentro de tu aplicación Flutter. ¿Tú cómo organizas hoy la lógica de tus apps? Cuéntame en los comentarios.