Tipos de componentes de Angular
A lo largo y ancho del mundo de Angular2+, el componente es la principal entidad o bloque de construcción de aplicaciones Angular. Cada componente consiste en: Hasta aquí, es lo que nos enseña la propia web de Angular sobre componentes junto a más información como…
Utilidades npm: skott, visualiza las dependencias
Si hace poco elaboramos un artículo sobre madge, ahora le toca el turno a skott. Skott es una herramienta que genera un gráfico con las dependencias entre los módulos de los proyectos, descubriendo si tienes dependencias circulares (al igual que madge), tamaño de los archivos,…
Utilidades npm: npm-check-updates, actualiza las librerías
Como sabemos el software es algo vivo (habitualmente) y es por eso que siempre aparecen nuevas actualizaciones, nuevas versiones sea para arreglar algún bug, añadir nuevas funcionalidades o hacer algún cambio más drástico (breaking changes). Así que es posible que de un día a otro…
Utilidades npm: madge, buscando dependencias circulares
Tener dependencias circulares en un proyecto nunca es bueno dado que pueden aparecer efectos negativos que nadie desea. Veamos un ejemplo muy sencillo de dependencia circular: Tenemos dos archivos que se referencian mutuamente importanto alguno de sus métodos: Archivo «position.ts» (referencia a positionPlusOne): Archivo «positionPlusOne.ts»…
Utilidades npm: rimraf, alternativa al comando Unix rm -rf
Una de las acciones que solemos hacer más de lo habitual es el borrado de archivos o carpetas para dejar siempre nuestro entorno de trabajo lo más limpio y/o estable que podamos. Mientras desarrollamos muchas veces instalamos un paquete u otro, creamos archivos para probar,…
Storybook en Nx Angular monorepo: Documentos MDX
Habitualmente no basta con crear las stories para que el usuario vea cómo funciona un determinado componente. Se necesita también explicar cómo se instala y se configura, sus características, casos de uso, y un largo etcétera. En este artículo vamos a ver cómo crear esas…
Storybook en Nx Angular monorepo: Stories
Llegado el momento hay que crear las stories necesarias para las diferentes funcionalidades. Pero, ¿Qué es una stories? ¿Cómo se escriben? Bien, según la web de Storybook, una story captura el estado representado de un componente de la interfaz de usuario. Es una función que…
Storybook en Nx Angular monorepo: Estilos
Storybook viene por defecto con un diseño propio. No obstante, mostraremos cómo cambiar esos estilos propios mediante lo que Storybook llama «Theming«, es decir, crearemos un tema que incorpore las características de una guía de estilos: marca, tipografías, colores, etc. Instalación Comprueba que tienes instalada…
Storybook en Nx Angular monorepo: Linting
Para llevar a cabo la escritura de stories y la documentación vamos a seguir algunas recomendaciones. Mediante el proceso de linting nos comprometemos a seguir correctamente unas buenas prácticas a la hora de escribir. Para ello, nos apoyaremos en el eslint y unos packages para…
Storybook en Nx Angular monorepo: Configuración
En el artículo anterior vimos la instalación de Storybook en Nx Angular monorepo. Esa instalación venía con una configuración mínima por defecto que ahora vamos a ampliar un poco más para conocer un poco más su estructura y de paso tener alguna característica más. Antes…
