Creando Estados Imposibles con fp-ts y TypeScript en una Aplicación React

Hola, voy a hablar sobre cómo crear estados imposibles con TypeScript y FPTS en una aplicación de React.

Me llamo Cristian Motochi y soy desarrollador de software en Stackbuilders. Aquí he estado aprendiendo sobre Haskell y PureScript.

Hay dos cosas que me gustan de estos lenguajes y siempre intento aplicar en los lenguajes o frameworks que uso. La primera es la tipificación estática, porque me ayuda a detectar errores mientras desarrollo el código y si algo no pasa la comprobación de tipos, no podré ejecutar el código hasta corregirlo. La segunda es la programación funcional, porque al componer funciones puedo definir mi programa de manera más clara. Creo que la mejor manera de obtener tipificación estática en una aplicación real es con TypeScript. El sistema de tipos es muy completo, con análisis de tipos, uniones de tipos, interfaces, variables de tipo y muchas otras cosas. Al combinar TypeScript con Rambda o Ramda, obtendremos programación funcional.

Y eso sería todo, ¿verdad? Sin embargo, recientemente descubrí FPTS, que es una biblioteca de programación funcional que tiene muchas características. Proporciona muchos tipos de datos, como Option para representar cálculos que pueden o no existir, cálculos que pueden o no fallar, arrays no vacíos y tipos de datos para envolver operaciones asíncronas que pueden o no fallar. También ofrece funciones auxiliares funcionales, como la función back que tenemos aquí, que ayuda a definir un flujo de datos de arriba a abajo sin necesidad de variables numéricas o de definir una línea de código muy larga, lo cual puede ser difícil de mantener. Esta función va de arriba a abajo explicando lo que hace en cada paso. Y la mejor parte de FPTS es que ofrece clases de tipos y sentidos de tipificación. Las clases de tipos son una buena manera de obtener polimorfismo ad-hoc. Aquí tenemos un ejemplo de la clase de tipo Enqueue con una variable de tipo T, y necesitamos definir un método equals para definir una instancia de tipo de esta clase de tipo. Podemos definir instancias de tipo utilizando objetos de JavaScript y configuraciones con tipos completos. FPTS tiene muchas clases de tipos definidas, como monoides, funtores, aplicativos, mónadas y muchas más. Vamos a combinar JavaScript y FPTS para crear estados imposibles, algo que aprendí con John Feldman en esta conferencia hace algunos años, como pueden ver. El propósito es obtener errores del compilador para evitar estados indefinidos. Imaginemos el siguiente ejemplo. Tenemos este formulario para ordenar una pizza, donde tenemos la selección principal y el ingrediente principal, luego el segundo ingrediente, que es opcional, y la lista de ingredientes extra. El ingrediente principal no está seleccionado por defecto al principio. Podemos pensar en el siguiente tipo de datos para representar la información que colocamos en ese formulario. El ingrediente principal puede estar seleccionado o no, y el segundo ingrediente es opcional.

Y la lista de extras. Y este tipo podría funcionar, sin embargo. Podemos tener estados que no queremos en nuestra aplicación. Por ejemplo, no queremos que los usuarios tengan la lista de extras si no han seleccionado el ingrediente principal. OK, así que no queremos que este estado ocurra. Eso es porque en algún momento recibiremos una queja con este caso.

Si definimos el tipo... Si definimos este tipo de barra. Así que pensemos en algo que hagamos para obtener un error de tipo si definimos este tipo de estado. OK, podríamos pensar en este. El ingrediente principal no va a ser solo el ingrediente, va a ser el ingrediente y la lista de opciones adicionales. Sí, así que si intentamos definir algo como esto, con este tipo directo, esta vez obtendremos un error de tipo. Y eso podría ser el problema.

Sin embargo, tenemos otro escenario. Donde el usuario no ha seleccionado el ingrediente principal pero sí ha seleccionado su segundo ingrediente. Así que eso es algo que tampoco queremos. OK, así que pensemos un poco más y lleguemos a este tipo directo. Usando el sistema de tipos de TypeScript para obtener un mejor tipo que se queje en los casos anteriores. Así que en este caso tenemos un ingrediente no principal que es un tipo directo que no tiene ningún valor. Así que no se puede seleccionar nada más. Y un nombre seleccionado que va a tener la selección principal. Podría tener la segunda selección o no. Y luego están los ingredientes extra. Así que este tipo se quejará si intentamos definir esto o esto es agradable. Y eso es agradable. Ahora podemos definir constructores inteligentes y otras funciones alrededor de este tipo. E incluso podemos definir instancias de tipo para este tipo de datos para poder usarlo más tarde. Por ejemplo, queremos usarlo con frutas. No podemos usarlo con las frutas reales porque usan... ya sabes, por razones de rendimiento hemos cambiado la referencia del objeto y desactivado el objeto, pero eso no nos va a ayudar. Tendremos que usar FPTS con el estado de las frutas que utilizará la instancia de eco para saber si un tipo ha cambiado, si el estado ha cambiado en un tipo de datos o algo así para evitar renderizados en nuestra aplicación. OK, así que en conclusión, si te gusta la seguridad de tipos y la programación funcional, JavaScript y FPTS son una buena opción. Muchas gracias por su atención.