Cómo hacer nuestros CLIs más seguros con tipos

Rate this content
Bookmark

En esta charla, exploraremos los diversos problemas encontrados al construir CLIs en JavaScript, y demostraremos cómo TypeScript puede abordarlos y ayudarnos a hacer nuestras aplicaciones más seguras.

Al final de esta charla, comprenderás cómo abstraer las validaciones en tiempo de ejecución detrás de interfaces fáciles de usar, y tendrás todas las herramientas que necesitas para llevar esos beneficios a tus propios CLIs a un costo mínimo, ya sean proyectos de código abierto o herramientas internas.

29 min
21 Sep, 2023

AI Generated Video Summary

Esta charla explora los desafíos de construir CLIs e introduce un framework de CLI completamente tipado construido con TypeScript. Se discuten las complejidades y dificultades de la implementación de CLIs y los beneficios de usar decoradores para metadatos y lógica. La charla también aborda los desafíos de inferencia de tipos y presenta una tercera forma de asignar anotaciones como decoradores. Se destaca la integración de Tpanion, Zod y ClipAnion para la verificación de tipos y validación de formato. Por último, se mencionan otros frameworks de CLI como ClipAllian, Common.js y Oclif que ofrecen funcionalidades similares.

1. Introducción a la Charla

Short description:

Bienvenidos a esta charla sobre cómo hacer nuestro CLI más seguro con TypeScript. Discutiremos los problemas que enfrentamos al construir CLIs, las técnicas en TypeScript para una mejor inferencia y los frameworks existentes. ¡Comencemos!

Hola a todos, y bienvenidos a esta charla sobre cómo hacer nuestro CLI más seguro con TypeScript. Mi nombre es Mayr Neonaysan. Trabajo en Datadog como parte del equipo de desarrollo front-end, donde estamos construyendo todo tipo de herramientas para asegurarnos de que nuestros ingenieros front-end puedan ser tan eficientes como deseen ser. Puedes encontrarme en Twitter y GitHub como Arkalis, y sí, espero verte allí.

Entonces, primero, sobre esta charla, la vamos a dividir en cuatro partes diferentes. Primero, vamos a hablar sobre qué son los CLIs, cuáles son los problemas que enfrentamos al construir ellos. Luego vamos a ver algunas técnicas que podemos usar en TypeScript para hacer una mejor inferencia sobre el tipo de las opciones. Y finalmente, vamos a repasar algunos de los frameworks que ya hacen eso por nosotros antes de llegar a una conclusión y recapitular todo lo que aprendimos. ¿Suena bien? Entonces, primero, ¿cuáles son los problemas que enfrentamos al construir CLIs? ¿Qué son los CLIs? En su esencia, son solo un conjunto de palabras separadas por espacios.

2. Complejidades de los CLIs y el CLI de Yarn

Short description:

Los CLIs son simples y útiles para parametrizar acciones. Sin embargo, pueden ser complicados, como al usar npm run eslint ____ versión o el comando cp con argumentos al principio. El CLI de Yarn es uno de los más grandes en el ecosistema de JavaScript y tiene comportamientos específicos. Inicialmente se utilizó Commander JS, pero hicimos que la palabra clave run y el token dash dash fueran opcionales, lo que requirió una implementación adicional.

Son muy simples de leer y muy simples de implementar por lo general. Los utilizamos para parametrizar acciones, que pueden ser tan complicadas como una aplicación CLI completa como YARN, o algo mucho más simple como un script que estás utilizando dentro de tu pipeline de construcción. Lo que tienen en común es que suelen ser muy simples. En comparación con las aplicaciones de UI completas, requieren muy pocas plantillas, lo que los hace muy útiles si solo estás tratando de hacer que un par de comportamientos sean configurables.

Sin embargo, también pueden ser complicados. Por ejemplo, tomemos npm run eslint ____ versión. Si no usas el token ____ para separar eslint y el token de versión, terminarás ejecutando la opción de versión en npm mismo y no en eslint. Sin embargo, si estás ejecutando YARN, no tienes que usar este token ____. Pero para hacer eso, como veremos más adelante, las cosas comienzan a complicarse.

El comando cp parece simple. Sin embargo, a diferencia de muchos comandos donde la cantidad de parámetros o argumentos variádicos está al final del comando, en el caso de cp, está al principio del comando. Tienes slc1, slc2, cualquier número de otras fuentes, pero debes tener un destino al final. Por lo tanto, la posición requerida de los argumentos está al final en lugar de al principio. Tienes el comando arm que tiene la opción preserve-root, pero también tiene la opción "-no-preserve-root". Y si estás implementando algo como esto en tus scripts, generalmente quieres declarar ambas opciones en una sola, para no tener que duplicarlas. Y finalmente, tomemos el caso de vlc-v. Si miras este comando y no sabes nada más al respecto, pensarías que "-v" es en realidad una bandera booleana. Pero no lo es. Si ejecutas vlc-vvv, no obtendrás el mismo comportamiento que si estuvieras ejecutando vlc-v. Porque vvv es en realidad un contador. Cuenta la cantidad de veces que lo pasas al comando.

Ahora, hablemos del CLI de Yarn en sí. Es muy interesante, porque el CLI de Yarn es una de las interfaces de CLI más grandes que todos usamos en el ecosistema de JavaScript. Cada uno tiene más de veinte comandos, y cada uno de ellos acepta opciones, y tenemos algunos comportamientos muy específicos como vimos anteriormente. Al principio, se comenzó a utilizar Commander JS, que es un framework de CLI para JavaScript que admite subcomandos, y eso es algo muy importante para Yarn, porque Yarn add, Yarn remove, Yarn upgrade interactúan contigo, todas esas cosas son comandos de la aplicación principal. Sin embargo, decidimos eventualmente hacer que la palabra clave run fuera opcional, para que pudieras ejecutar Yarn eslint en lugar de Yarn run-eslint, y eso no era algo que Commander JS admitiera de forma nativa. Así que tuvimos que implementar nuestro propio código para admitir eso. Luego, más adelante, decidimos también hacer que el token dash dash fuera opcional, para que si ejecutas Yarn eslint dash dash versión, entonces la versión de dash dash se aplique a eslint y no a Yarn mismo. Eso es muy útil. Sin embargo, requirió implementar algo más encima de Commander JS.

3. Desafíos de la Implementación de CLIs

Short description:

Implementar algo encima de Commander JS hizo que el código fuera complejo y difícil de mantener. Los CLIs pueden propiciar errores, con la posibilidad de olvidar declaraciones, valores predeterminados, validación o eliminar opciones no utilizadas.

Al final, el código terminó siendo bastante complicado y fue difícil razonar sobre él y mantenerlo. Esta es una imagen de mí cada vez que tenía que hacer eso. CLI está encima de eso, o también puede propiciar errores. Puedes olvidar muchas cosas al escribir un comentario. Puedes olvidar declarar una opción. Puedes olvidar declarar su valor predeterminado. Puedes olvidar validarla si tiene una forma específica que esperas. Incluso puedes olvidar usar la opción y puedes olvidar eliminarla una vez que ya no la necesites.

4. Construyendo un Marco de CLI Totalmente Tipado

Short description:

En 2018, decidimos reescribir Jan y hacerlo totalmente compatible con TypeScript. Necesitábamos un marco de CLI que fuera legible, totalmente verificado por tipos y protegido contra errores. Así que construimos nuestro propio marco y aprendimos mucho en el proceso. Construyamos un marco de CLI totalmente tipado desde cero utilizando metacadenas y decoradores.

Por ejemplo, en un par de casos cuando trabajaba en Jan, sucedió que en algún momento del desarrollo de una función agregué una opción, trabajé con ella por un tiempo y luego decidí eliminarla antes de gestionar la solicitud de extracción. Sin embargo, puede que haya olvidado eliminar el código en el que se basaba. O podría haber eliminado el código en el que se basaba esta opción, pero olvidé eliminar la opción de la declaración real del comando, lo que significa que alguien que ejecute el comando de ayuda vería que esta opción existe pero en realidad no estaría allí.

Entonces, en 2018, cuando comenzamos con un proyecto a gran escala para reescribir Jan y hacerlo totalmente compatible con TypeScript, decidimos desechar varios de nuestros sistemas heredados, y uno de ellos fue la implementación de la CLI. Así que comenzamos a buscar lo que existía y, desafortunadamente, no encontramos realmente nada que resolviera todos nuestros requisitos. Necesitábamos algo con buena legibilidad porque teníamos muchos colaboradores que se sumarían al código sin conocimiento previo de lo que estábamos usando. Necesitábamos algo que estuviera totalmente verificado por tipos porque queríamos prevenir tantos errores como fuera posible sin tener que depender de revisiones de código manuales, porque notamos que en cada revisión de código siempre hay algo que pasa desapercibido. Y finalmente, queríamos protegernos realmente contra errores. Queríamos que el camino del éxito estuviera allí. Si no estás familiarizado con el concepto, el camino del éxito es que cualquier cosa que hagas, caerás en un comportamiento de comando. Y luego, si puedes mejorarlo más tarde, pero por defecto todo es sensato y funciona como esperas. Y realmente tienes que esforzarte para hacer algo que esté roto.

Entonces hablamos de las CLI en términos abstractos. Y en el caso de YARN, lo que necesitábamos construir. Así que decidimos construir nuestro propio marco y al hacerlo aprendimos muchas cosas. Así que eso es lo que vamos a hacer juntos. Construyamos un marco de CLI totalmente tipado desde cero. Por supuesto, nos vamos a enfocar solo en el aspecto de verificación de tipos y no en la implementación de cómo analizar los argumentos porque eso sería mucho más que una charla de 25 minutos. Pero en cuanto a la verificación de tipos, tenemos tres formas de lograr estos efectos. Primero, podemos usar metacadenas, podemos usar decoradores y podríamos usar lo que llamo la tercera forma. Vamos a dejar esta para el final porque es bastante interesante, pero primero necesitamos repasar las dos primeras para entender mejor por qué es tan bueno. Así que primero hablemos de las metacadenas. Es la más simple, de hecho, es la misma sintaxis que usa Commander.js y eso es algo bueno porque significa que es familiar para cualquiera que solía hacer interfaces de CLI hace un par de años. Tienes un comando y luego declaras las opciones combinando los resultados de la función del comando y una vez que has declarado todas las opciones, puedes declarar qué hace el comando. Y luego el marco de CLI, cuando se llama al comando, analizará las opciones y llamará a la acción pasándole un OptionBug que contiene todas las opciones que se analizaron. Para esta charla, vamos a fingir que las opciones siempre están configuradas porque de lo contrario, todas las cosas como obd.check serían booleanas o indefinidas en lugar de solo booleanas y eso haría que el código fuera más difícil de leer. Pero aquí lo que queremos lograr es un estado en el que obd.check exista y sea un booleano, obd.require exista y sea una cadena y obd.foo sea detectado correctamente por TypeScript como que no existe y eso es lo importante. No podemos tener obd como any. Eso no funcionaría para nosotros. En términos de TypeScript, ¿cuál sería el tipo del valor resultante de la función del comando? Primero, queremos algo que devuelva un comando sin opción, porque no declara ninguna opción.

5. Interfaz de Comando y Encadenamiento de Métodos

Short description:

Cuando se utilizan las funciones booleanas y string, el comando se devuelve como un genérico con las opciones declaradas. Este enfoque tiene ventajas y desventajas. Es fácil de escribir y familiar para aquellos con experiencia en marcos de CLI. Sin embargo, puede ser verboso y menos idiomático, lo que dificulta su comprensión para los recién llegados. Además, tiene una integración deficiente con las herramientas. Por ejemplo, TypeScript puede no detectar las opciones no utilizadas en la devolución de llamada de acción.

Entonces, tan pronto como llamamos a boolean, esta vez el comando es un genérico con una propiedad check que es un booleano. Y luego, una vez que llamamos a la función string, el comando se devuelve como un genérico con tanto check como require. Y finalmente, cuando tenemos action, simplemente toma una devolución de llamada que acepta la bolsa de opciones como parámetro y devuelve void.

Al hacer eso, permitimos que TypeScript infiera correctamente cuando pasamos la devolución de llamada de acción que el tipo OPITIZ está compuesto por la opción que declaramos anteriormente. Para hacer eso, es muy simple, realmente. Eso es todo lo que necesitamos.

Entonces tenemos nuestra interfaz de comando con su tipo genérico, que se establece en void de forma predeterminada, y declaramos tanto Boolean como string como una función que toma una cadena literal como parámetro. Incluso usamos algún tipo de concatenación de cadenas como tipos, porque una versión reciente de TypeScript lo admite. Y cada vez que llamamos a Boolean o string, devolvemos el mismo tipo de comando, excepto que lo extendemos para incluir la opción recién declarada. Y finalmente, tenemos la función action que, como mencionamos, permite que TypeScript infiera el tipo de OPDs en función del propio genérico.

Este enfoque tiene ventajas y desventajas. Es lo suficientemente fácil de escribir. Claramente, no hay mucho código involucrado, como puedes ver. Se siente un poco como en 2017, porque la mayoría de los marcos de CLI de ese tiempo estaban escritos de esta manera, encadenando funciones, una tras otra. Esto significa que si ya estás familiarizado con este tipo de marco, entonces es exactamente lo que esperarías. Sin embargo, es un poco variable. Tienes que usar muchas funciones para declarar tus opciones. No es muy idiomático. Estás usando el encadenamiento de métodos, algo que no se encuentra en muchas interfaces de JavaScript. Por lo tanto, las personas que ingresen a tu código pueden encontrar esto un poco difícil de leer. Y tiene una integración deficiente con las herramientas. Y este es el principal del que quiero hablarles. Veamos el encadenamiento de métodos aquí. Como puedes ver, estamos declarando un comando con una opción de cadena. Y tenemos una acción aquí, que imprime una cadena con el nombre de la persona que ejecuta el comando. Pero ¿lo hace realmente? En realidad, no, no lo hace. Olvidamos usar opent.name. Pero TypeScript no puede ver eso, porque desde su perspectiva, tal vez la bolsa de opciones que se pasa del parámetro a la acción también se usa en otro lugar. Por lo tanto, no es local. Por lo tanto, la verificación de variables no utilizadas no podrá ver que olvidamos usar eso.

6. Uso de Decoradores para Metadatos y Lógica Especial

Short description:

Los decoradores proporcionan una segunda opción para verificar la corrección del código. Te permiten adjuntar anotaciones sobre las propiedades de una clase, proporcionando metadatos y lógica especial. Este enfoque es mejor que el encadenamiento de metadatos, ya que utiliza propiedades de clase privadas regulares, que TypeScript puede analizar en busca de variables no utilizadas. Sin embargo, los decoradores tienen una historia complicada y problemas de compatibilidad con decoradores antiguos y nuevos. Además, no pueden afectar a los tipos, lo que puede llevar a problemas de inferencia potenciales.

Entonces, eso es a lo que me refiero con la integración de ajuste. Dado que estamos evitando un poco la declaración de variables locales y ese tipo de cosas, no podemos verificar tan fácilmente que nuestro código sea correcto. Tenemos una segunda opción para hacer eso: los decoradores. Los decoradores son interesantes porque utilizan una nueva sintaxis que ha aparecido muy recientemente. Ahora está en la etapa tres. Hasta entonces, era difícil saber si podíamos usarlos o no. Con los decoradores, adjuntas anotaciones sobre cada propiedad de tu clase. Al hacer eso, puedes atribuir metadatos especiales y lógica especial a esas propiedades.

En teoría, podríamos imaginar algo como esto, donde declaramos una clase para nuestro comando. Luego declaramos las opciones. Y luego adjuntamos una anotación que declara si la verificación, por ejemplo, es una opción booleana o una opción de cadena, como require. Y eso es mucho mejor que el encadenamiento de metadatos en términos de integración de ajuste. Porque esta vez, tenemos propiedades de clase regulares, que se declaran como privadas. Por lo tanto, TypeScript sabe que no se van a utilizar en ningún otro lugar de este archivo. Si no se utilizan en este archivo, significa que hay un problema y te advertirá al respecto.

Además, sí, ese es el ejemplo al que me refería. Si no estás usando name, entonces TypeScript emitirá un error. Sin embargo, los decoradores tienen un par de problemas de los que debemos hablar. En primer lugar, tienen una historia complicada. Hay dos tipos diferentes de decoradores: los decoradores antiguos y los decoradores nuevos, porque los decoradores han pasado por varias etapas y tienen varios diseños. Por lo tanto, si tienes una biblioteca que depende de decoradores antiguos en tu código base, entonces no puedes usar los decoradores nuevos. Y si tienes una biblioteca que utiliza los decoradores nuevos, entonces no puedes usar bibliotecas con soporte para todos los decoradores. También significa que necesitas tener pasos de transpilación compatibles. Como vimos, hay pasos de transpilación antiguos y pasos de transpilación nuevos. Por lo tanto, es un poco difícil conciliarlos. Y quizás el mayor problema es que no pueden afectar a los tipos. Si tomamos nuevamente el ejemplo que escribimos aquí, tenemos la opción check que es un booleano y la opción string y la opción require que son de tipo cadena.

7. Desafíos de Inferencia de Tipos

Short description:

TypeScript no puede inferir los tipos de check y require, por lo que tenemos que establecerlos explícitamente. Esto conduce a la duplicación y la posibilidad de cometer errores. También requiere mucho código.

Sin embargo, TypeScript no puede inferir que el tipo de check es booleano y el tipo de require es cadena, a pesar de la anotación. Lo que debemos hacer es establecer explícitamente que check es un booleano y require es una cadena. Esto significa que tenemos cierta duplicación, ya que tenemos que escribir booleano dos veces, cadena dos veces. No es ideal. Además, ¿qué sucede si cometemos un error y establecemos booleano en lugar de cadena al declarar la opción require? Resulta que tenemos alguna forma de evitar eso, pero aún existe el problema de duplicación. Y requiere mucho código solo para asegurarnos de que TypeScript esté satisfecho.

8. La Tercera Forma: Asignar Anotaciones como Decoradores

Short description:

Con la tercera forma, asignamos la anotación como decoradores a la propiedad, eliminando la necesidad de declaraciones y tipos duplicados. TypeScript puede inferir los tipos de check y require, lo que lo convierte en una solución conveniente.

Idealmente, querríamos algo donde no tengamos que duplicar tanto la declaración como los tipos. ¿Cómo podemos hacer esto? Eso es lo que llamo la tercera forma. Con la tercera forma, en lugar de asignar la anotación como decoradores, simplemente los asignamos a la propiedad. Entonces aquí, tenemos nuestra clase de comando. Tenemos nuestras opciones de check y require. Y para cada una de ellas, simplemente asignamos el resultado de un valor booleano y una cadena. Y una vez que se llama a la acción, es mágico. Todo funciona perfectamente. TypeScript es capaz de inferir el tipo de check y require, y nunca tuviste que declararlos tú mismo. Parece lo mejor de ambos mundos, ¿verdad? Esto es cómo se vería en términos de configuración.

9. Detalles de Implementación de la CLI

Short description:

Las funciones Boolean y String devuelven metadatos que se hacen pasar por el tipo deseado. Usamos 'as any' para aligerarlo para el comprobador de tipos. La función inject options into command recupera metadatos asociados con la opción y asigna el valor real basado en el tipo prometido. Esto permite la validación de formato y la compatibilidad con bibliotecas de TypeScript como Tpanion y Zod.

Entonces tendrías tu array argv, instanciarías tu comando, inyectarías opciones en el comando, y luego simplemente funciona. Puedes llamar al método de acción como quieras. Pero ¿cómo funciona realmente, verdad? Porque parece demasiado bueno para ser verdad. No hay una transpilación compleja. Está directamente en el AST, por lo que cosas como TypeScript o ESLint pueden operar muy fácilmente en él y verificar que todo coincida con tus requisitos. Y no tienes duplicación de tipos como vemos en los decoradores. Eso es extraño.

Ahora vamos a profundizar un poco para entender cómo es posible. Primero, nos vamos a centrar en la implementación de las funciones Boolean y String. ¿Cómo se ven? Bueno, son muy simples, son solo funciones que devuelven un Boolean y un String. ¿Pero lo son? No, en realidad son funciones que devuelven un conjunto de metadatos que se hacen pasar por el tipo que queremos al final. Por ejemplo, aquí tenemos Boolean que devuelve el objeto de tipo Boolean. Pero eso le dice a TypeScript, no, en realidad es un Boolean, te lo prometo. Usamos as any para aligerarlo para el comprobador de tipos. Eso puede parecer extraño.

No, en el código de configuración, en el código de configuración, lo siento, vimos que tenemos una función inject options into command. ¿Cómo funciona? Este es el código general de esta función. Para cada argumento, vamos a eliminar las dobles barras y vamos a recuperar los metadatos que están asociados a la opción. Como vimos anteriormente cuando hacemos check igual a Boolean o require igual a string, estamos asignando un objeto que contiene una propiedad de tipo. Aquí, simplemente estamos recuperando este objeto. Dado que hemos tipado el comando como any dentro del parámetro de inject options into command, TypeScript nos permitirá hacer esto. Y ahora que tenemos el tipo, todo lo que tenemos que hacer es asignar el valor real a la opción, que coincide con el tipo que los metadatos prometieron que sería. Y al hacer eso, funciona. En otras palabras, le mentimos al comprobador de tipos, pero es por una buena causa, así que está bien. Incluso nos permite hacer cosas más complejas, como la validación de formato. Tomemos una función de opción que devuelve un string, al igual que la anotación de string que declaramos anteriormente. También podemos agregar sobrecarga para que acepte validadores. En TypeScript, tienes diferentes validadores que te permiten verificar en tiempo de ejecución que un valor específico tenga un tipo específico, y luego para el resto de tu código, tratarlo como el tipo correcto que validas. Tienes dos bibliotecas que hacen eso. Entonces tienes Tpanion y Zod que son compatibles con TypeScript.

10. Integración de Tpanion, Zod y ClipAnion

Short description:

Puedes integrar Tpanion y Zod con la sintaxis descrita. Este enfoque ofrece un tipo que ha sido verificado por el tipo, lo que permite que TypeScript infiera el tipo resultante. Requiere una sintaxis mínima y admite genéricos. Funciona bien con ESLint y Prettier, y la sintaxis es agradable de leer. La complejidad está oculta dentro del núcleo, lo que facilita la declaración de opciones de CLI sin preocuparse por requisitos especiales. Sin embargo, puede sorprender a los usuarios avanzados de TypeScript y la composición puede ser más desafiante. Otra opción es ClipAnion, que sigue un enfoque similar. Utiliza clases de comando, un espacio de nombres de opciones y la función runExit(). TypeScript puede inferir los tipos en función de las anotaciones proporcionadas. Las opciones se pueden asignar como booleanos o cadenas, con soporte para valores indefinidos.

Entonces tienes un Tpanion y Zod que son compatibles con TypeScript. Y podemos integrarlos con la sintaxis que describimos. Dado que ambas bibliotecas ofrecen un tipo que tiene un genérico en el tipo que ha sido verificado por el tipo, todo lo que tienes que hacer es decirle a TypeScript que tu función de opción acepta un validador que devuelve algo. Y a cambio, una vez que se analiza la opción, será este mismo tipo y simplemente funcionará. Por ejemplo, aquí con T-Banyon, estamos declarando una opción que tiene un validador que verifica que el argumento sea un número. Y luego, dentro de la acción, TypeScript infiere correctamente que count es un número.

Esta tercera forma tiene pros y contras como las otras. En primer lugar, no requiere ninguna sintaxis especial. Son solo clases y propiedades, por lo que requiere lo mínimo de las características de ES. También admite genéricos como vimos. Es bastante fácil escribir código que infiere el tipo resultante en función del parámetro proporcionado a la anotación. Funciona muy bien con ESLint y Prettier. La sintaxis es agradable de leer. Y finalmente, toda la complejidad está completamente oculta dentro del núcleo. No tienes que lidiar con nada especial para entender cómo estás declarando tus opciones de CLI. No tienes que preocuparte por nada, incluso si algo es requerido. Por ejemplo, si quieres declarar un argumento posicional requerido, eso es algo que se abstrae dentro de la declaración de los argumentos posicionales, pero los usuarios no tendrán que preocuparse por ello para que el tipo funcione de inmediato.

La desventaja es que nos estamos alineando un poco con TypeScript, por lo que puede sorprender a las personas que son usuarios avanzados de TypeScript y pueden esperar algo y no entender por qué no funciona como esperaban. Además, la composición es un poco más difícil porque luego tienes que envolver la anotación dentro de otra. Pero por lo general, en mi experiencia, la composición es bastante rara en las CLI, por lo que esto nunca ha sido un problema en la CLI en la que trabajé.

Entonces, ahora hablemos de las opciones que tienes al escribir herramientas de CLI. Cuando hablo de YARN y digo que lo mejoramos, terminamos escribiendo nuestro propio marco de CLI. Así que primero, voy a hablarles de este. Es ClipAnion y te permite hacer algo muy similar a la tercera forma que describí anteriormente. Tienes una clase de comando, tienes un espacio de nombres de opciones que contiene un montón de anotaciones, y tienes la función runExit() que te permite ejecutar tu programa real. Aquí estás declarando un comando que contiene un par de opciones, check y require. Y los estás asignando a una opción que es un booleano o una cadena, con todos los nombres de opciones que desees. Y finalmente, TypeScript es capaz de inferir sus tipos gracias a todas las sobrecargas que ClipAllian declara y asegurarse de que se sigan durante el análisis de la CLI. De hecho, aquí puedes ver que esta vez agregamos el or-undefined() porque una opción puede estar configurada o no estar configurada. Si no está configurada, entonces debe ser un booleano, en caso de que esté configurada, o indefinido.

11. ClipAllian y Otros Marcos de CLI

Short description:

ClipAllian es un poderoso marco de CLI que admite validadores, argumentos posicionales opcionales y requeridos, sobrecargas, manejo de errores nativo y es completamente seguro en cuanto a tipos. Utiliza una máquina de estados para el análisis de tokens, lo que reduce los errores. Otras herramientas como Common.js y Oclif ofrecen funcionalidades similares con sintaxis ligeramente diferentes.

También admite validadores a través de ClipAllian, a través, perdón, a través de TipAllian, que es el validador de tipos, el validador de tipos en tiempo de ejecución que mencioné antes. Entonces, si tienes una opción de cadena, también puedes validar que su formato sea realmente un número, en cuyo caso TypeScript refinará correctamente el número para que sea un número en lugar de una cadena. ClipAllian admite muchas cosas. Es el marco que estamos utilizando en la CLI de Yarn, que hace muchas cosas diferentes. Admite argumentos posicionales opcionales, argumentos posicionales requeridos, argumentos posicionales de tarjeta. Por ejemplo, cuando ejecutas Yarn ESLint y aceptas opciones, eso es una tarjeta porque estamos aceptando cualquier cosa. Admite booleanos, cadenas, matrices, tablas, contadores. Implementa el análisis de los tokens de la CLI a través de una máquina de estados, lo cual es algo muy único. Significa que simplemente estamos generando una máquina de estados completa con poco margen para errores. Muchos marcos de CLI en la actualidad intentan analizar los tokens uno por uno a través de un bucle for, básicamente. Pero corres el riesgo de tener muchos errores. También nos permite admitir sobrecargas. Por ejemplo, puedes tener comandos diferentes con la misma ruta pero opciones o requisitos diferentes. ClipAllian podrá determinar cuál es el que debe usar, dependiendo de lo que el usuario haya proporcionado. Manejo de errores nativo, anulación de tiempo de ejecución baja y, por supuesto, es completamente seguro en cuanto a tipos. Por ejemplo, dada la siguiente declaración de comando, podrá refinar correctamente los tipos según lo que declares. Por supuesto, hay una opción regular que es booleana, que es booleana o indefinida. Pero también puedes asignar un valor predeterminado, en cuyo caso ClipAllian verá que, dado que hay un valor predeterminado, ya no puede ser indefinido. También puedes declarar una opción opcional que acepta una cadena como argumento, en cuyo caso será una cadena o indefinida, pero también puedes marcarlas como requeridas, en cuyo caso serán una cadena, porque son requeridas y si no están presentes, ClipAllian lanzará un error. También puedes declarar tuplas usando la opción ret. Tienes muchas opciones diferentes y cada vez ClipAllian hace lo correcto y realiza una comprobación de tipos adecuada. Pero también tienes otras herramientas que hacen lo mismo con sintaxis ligeramente diferentes. Primero, tienes Common.js, por supuesto, que es el más antiguo y realmente admite muy bien los tipos utilizando el paquete de typings adicionales. Funciona igual que la metacadena que vimos anteriormente. Y también tienes Oclif que tal vez sea un poco más verboso pero funciona de manera similar a ClipAllian. Eso es casi todo. ¿Qué debes recordar de esta charla? Quiero que recuerdes un par de cosas. Primero, TypeScript es una gran herramienta para los autores de CLI, incluso para las CLI internas. Cuando estás escribiendo CLI, escribiendo una aplicación dentro de una empresa, es posible que te tientes a usar TypeScript para todo lo relacionado con tu plataforma web, pero noté que muchos scripts comienzan escribiendo JavaScript, porque no se necesita transmutación. Sin embargo, si estás utilizando herramientas como TS Node, esto ya no es un problema. Puedes ejecutar tu código directamente desde las fuentes de TS sin tener que transpilarlo antes y eso es algo genial porque significa que podemos tipar correctamente el script de construcción que estamos utilizando en nuestra infraestructura. A través de un mecanismo como el que discutimos con ClipAllian, con Oclif, este tipo de cosas, significa que también puedes asegurarte de que tus scripts estén bien escritos y acepten las opciones adecuadas que esperas. La próxima vez que escribas una CLI interna, considera usar TypeScript para eso y considera usar un marco de CLI porque realmente facilitan mucho tu trabajo y evitan que cometas errores. Tienes diferentes sintaxis que puedes elegir según tus preferencias en términos de sintaxis. Vimos la metacadena, los decoradores y la tercera forma. Las nuevas características aún no están completamente listas por las razones que mencioné antes, especialmente en cuanto a la necesidad de duplicar tus tipos tanto en la anotación como en el tipo de TypeScript, pero creo que mejorarán en los próximos años, así que eso también es algo que debes tener en cuenta para el futuro. Finalmente, recuerda que ClipAllian está ahí, ha estado en producción durante muchos años, y pruébalo para tu próxima CLI. Gracias a todos, puse el enlace en la pantalla, siéntanse libres de revisar todo lo que hice para esta charla, y estoy aquí para responder sus preguntas. ¡Que tengan un buen día!

Check out more articles and videos

We constantly think of articles and videos that might spark Git people interest / skill us up or help building a stellar career

Vue.js London 2023Vue.js London 2023
30 min
Stop Writing Your Routes
The more you keep working on an application, the more complicated its routing becomes, and the easier it is to make a mistake. ""Was the route named users or was it user?"", ""Did it have an id param or was it userId?"". If only TypeScript could tell you what are the possible names and params. If only you didn't have to write a single route anymore and let a plugin do it for you. In this talk we will go through what it took to bring automatically typed routes for Vue Router.
TypeScript Congress 2023TypeScript Congress 2023
31 min
Making Magic: Building a TypeScript-First Framework
I'll dive into the internals of Nuxt to describe how we've built a TypeScript-first framework that is deeply integrated with the user's IDE and type checking setup to offer end-to-end full-stack type safety, hints for layouts, middleware and more, typed runtime configuration options and even typed routing. Plus, I'll highlight what I'm most excited about doing in the days to come and how TypeScript makes that possible not just for us but for any library author.
React Day Berlin 2023React Day Berlin 2023
21 min
React's Most Useful Types
We don't think of React as shipping its own types. But React's types are a core part of the framework - overseen by the React team, and co-ordinated with React's major releases.In this live coding talk, we'll look at all the types you've been missing out on. How do you get the props type from a component? How do you know what ref a component takes? Should you use React.FC? And what's the deal with JSX.Element?You'll walk away with a bunch of exciting ideas to take to your React applications, and hopefully a new appreciation for the wonders of React and TypeScript working together.
React Advanced Conference 2021React Advanced Conference 2021
6 min
Full-stack & typesafe React (+Native) apps with tRPC.io
Why are we devs so obsessed with decoupling things that are coupled nature? tRPC is a library that replaces the need for GraphQL or REST for internal APIs. When using it, you simply write backend functions whose input and output shapes are instantly inferred in your frontend without any code generation; making writing API schemas a thing of the past. It's lightweight, not tied to React, HTTP-cacheable, and can be incrementally adopted. In this talk, I'll give a glimpse of the DX you can get from tRPC and how (and why) to get started.
TypeScript Congress 2022TypeScript Congress 2022
10 min
How to properly handle URL slug changes in Next.js
If you're using a headless CMS for storing content, you also work with URL slugs, the last parts of any URL. The problem is, content editors are able to freely change the slugs which can cause 404 errors, lost page ranks, broken links, and in the end confused visitors on your site. In this talk, I will present a solution for keeping a history of URL slugs in the CMS and explain how to implement a proper redirect mechanism (using TypeScript!) for dynamically generated pages on a Next.js website.

Add to the talk notes: https://github.com/ondrabus/kontent-boilerplate-next-js-ts-congress-2022 

Workshops on related topic

React Advanced Conference 2021React Advanced Conference 2021
174 min
React, TypeScript, and TDD
Featured WorkshopFree
ReactJS is wildly popular and thus wildly supported. TypeScript is increasingly popular, and thus increasingly supported.

The two together? Not as much. Given that they both change quickly, it's hard to find accurate learning materials.

React+TypeScript, with JetBrains IDEs? That three-part combination is the topic of this series. We'll show a little about a lot. Meaning, the key steps to getting productive, in the IDE, for React projects using TypeScript. Along the way we'll show test-driven development and emphasize tips-and-tricks in the IDE.
React Advanced Conference 2022React Advanced Conference 2022
148 min
Best Practices and Advanced TypeScript Tips for React Developers
Featured Workshop
Are you a React developer trying to get the most benefits from TypeScript? Then this is the workshop for you.In this interactive workshop, we will start at the basics and examine the pros and cons of different ways you can declare React components using TypeScript. After that we will move to more advanced concepts where we will go beyond the strict setting of TypeScript. You will learn when to use types like any, unknown and never. We will explore the use of type predicates, guards and exhaustive checking. You will learn about the built-in mapped types as well as how to create your own new type map utilities. And we will start programming in the TypeScript type system using conditional types and type inferring.
TypeScript Congress 2022TypeScript Congress 2022
116 min
Advanced TypeScript types for fun and reliability
Workshop
If you're looking to get the most out of TypeScript, this workshop is for you! In this interactive workshop, we will explore the use of advanced types to improve the safety and predictability of your TypeScript code. You will learn when to use types like unknown or never. We will explore the use of type predicates, guards and exhaustive checking to make your TypeScript code more reliable both at compile and run-time. You will learn about the built-in mapped types as well as how to create your own new type map utilities. And we will start programming in the TypeScript type system using conditional types and type inferring.
Are you familiar with the basics of TypeScript and want to dive deeper? Then please join me with your laptop in this advanced and interactive workshop to learn all these topics and more.
You can find the slides, with links, here: http://theproblemsolver.nl/docs/ts-advanced-workshop.pdf
And the repository we will be using is here: https://github.com/mauricedb/ts-advanced
TypeScript Congress 2023TypeScript Congress 2023
131 min
Practice TypeScript Techniques Building React Server Components App
Workshop
In this hands-on workshop, Maurice will personally guide you through a series of exercises designed to empower you with a deep understanding of React Server Components and the power of TypeScript. Discover how to optimize your applications, improve performance, and unlock new possibilities.
 
During the workshop, you will:
- Maximize code maintainability and scalability with advanced TypeScript practices
- Unleash the performance benefits of React Server Components, surpassing traditional approaches
- Turbocharge your TypeScript with the power of Mapped Types
- Make your TypeScript types more secure with Opaque Types
- Explore the power of Template Literal Types when using Mapped Types
 
Maurice will virtually be by your side, offering comprehensive guidance and answering your questions as you navigate each exercise. By the end of the workshop, you'll have mastered React Server Components, armed with a newfound arsenal of TypeScript knowledge to supercharge your React applications.
 
Don't miss this opportunity to elevate your React expertise to new heights. Join our workshop and unlock the potential of React Server Components with TypeScript. Your apps will thank you.
TestJS Summit 2023TestJS Summit 2023
78 min
Mastering Node.js Test Runner
Workshop
Node.js test runner is modern, fast, and doesn't require additional libraries, but understanding and using it well can be tricky. You will learn how to use Node.js test runner to its full potential. We'll show you how it compares to other tools, how to set it up, and how to run your tests effectively. During the workshop, we'll do exercises to help you get comfortable with filtering, using native assertions, running tests in parallel, using CLI, and more. We'll also talk about working with TypeScript, making custom reports, and code coverage.
Node Congress 2021Node Congress 2021
245 min
Building Serverless Applications on AWS with TypeScript
Workshop
This workshop teaches you the basics of serverless application development with TypeScript. We'll start with a simple Lambda function, set up the project and the infrastructure-as-a-code (AWS CDK), and learn how to organize, test, and debug a more complex serverless application.
Table of contents:        - How to set up a serverless project with TypeScript and CDK        - How to write a testable Lambda function with hexagonal architecture        - How to connect a function to a DynamoDB table        - How to create a serverless API        - How to debug and test a serverless function        - How to organize and grow a serverless application


Materials referred to in the workshop:
https://excalidraw.com/#room=57b84e0df9bdb7ea5675,HYgVepLIpfxrK4EQNclQ9w
DynamoDB blog Alex DeBrie: https://www.dynamodbguide.com/
Excellent book for the DynamoDB: https://www.dynamodbbook.com/
https://slobodan.me/workshops/nodecongress/prerequisites.html