Guía Rápida: Effect

¿Por qué querrías usar Effect en tu siguiente proyecto?

Usar Effect en proyectos frontend o full-stack, es útil porque permite gestionar la asincronía, los errores y las dependencias de forma clara y estructurada. 📋

A diferencia de las promesas tradicionales, Effect hace explícito en el tipo de cada función qué puede fallar y qué recursos necesita, lo que ayuda a evitar errores inesperados y facilita el mantenimiento del código. 🧠

Además, fomenta una forma de programar más predecible y fácil de probar, ya que el manejo de errores y la composición de operaciones se vuelven más sencillos y seguros. Esto resulta especialmente valioso para desarrolladores que están comenzando, ya que ayuda a escribir aplicaciones más confiables y fáciles de entender. ✅

1. Instalación

npm install effect

---

2. Conceptos Básicos

• Effect<A, E, R>: Representa un efecto que puede requerir un entorno R, fallar con un error E, o producir un valor A.
• Success: El valor exitoso.
• Failure: El error.

---

3. Crear un Effect

import * as Effect from "effect/Effect";

// Un efecto que siempre tiene éxito
const succeed = Effect.succeed("¡Hola!");

// Un efecto que puede fallar
const fail = Effect.fail("Algo salió mal");

---

4. Ejecutar un Effect

Effect.runPromise(succeed).then(console.log); // ¡Hola!
Effect.runPromise(fail).catch(console.error); // Algo salió mal

---

5. Encadenar efectos (flatMap/map)

const efecto = Effect.succeed(2)
  .pipe(
    Effect.flatMap(n => Effect.succeed(n * 2)), // 4
    Effect.map(n => n + 1) // 5
  );

Effect.runPromise(efecto).then(console.log); // 5

---

6. Manejo de errores

const efecto = Effect.fail("error")
  .pipe(
    Effect.catchAll(err => Effect.succeed(`Recuperado de: ${err}`))
  );

Effect.runPromise(efecto).then(console.log); // Recuperado de: error

---

7. Efectos asíncronos

const asyncEffect = Effect.async<never, string, void>(resume => {
  setTimeout(() => resume(Effect.succeed("Hecho!")), 1000);
});

Effect.runPromise(asyncEffect).then(console.log); // Hecho! (después de 1s)

---

8. Composición y paralelismo

const a = Effect.succeed(1);
const b = Effect.succeed(2);

const ambos = Effect.all([a, b]); // [1, 2]
Effect.runPromise(ambos).then(console.log);

---

9. Recursos y contexto

Puedes inyectar dependencias usando el contexto (como un "Dependency Injection" funcional):

import * as Context from "effect/Context";

interface Logger {
  log: (msg: string) => void;
}
const Logger = Context.Tag<Logger>();

const logEffect = Effect.serviceWithEffect(Logger, logger =>
  Effect.sync(() => logger.log("Hola desde Effect!"))
);

const loggerInstance: Logger = { log: console.log };

Effect.runPromise(
  logEffect.pipe(Effect.provideService(Logger, loggerInstance))
);

---

Si tú también estas estudiando cómo usar Effect lo más rápido posible, esta referencia rápida seguro te será tan útil como lo ha sido para mí. 👨🏻‍💻

Abrazo. Bliss. 🤓

---

Enlaces relacionados

• Documentación oficial
• Playground interactivo
• Ejemplos