React a gran escala con Nx

Rate this content
Bookmark

A medida que el código base crece, se vuelve más difícil de mantener. Todos los procesos informales de un equipo pequeño deben ser sistematizados y respaldados con herramientas a medida que el equipo crece. Ven y aprende cómo Nx permite a los desarrolladores centrar su atención más en el código de la aplicación y menos en las herramientas.

Construiremos un monorepo desde cero, creando una aplicación cliente y una aplicación de servidor que comparten una biblioteca de tipos de API. Aprenderemos cómo Nx utiliza ejecutores y generadores para hacer que la experiencia del desarrollador sea más consistente en todos los proyectos. Luego crearemos nuestros propios ejecutores y generadores para procesos que son únicos en nuestra organización. También exploraremos el creciente ecosistema de complementos que permiten la integración fluida de frameworks y bibliotecas.


This workshop has been presented at React Summit Remote Edition 2021, check out the latest edition of this React Conference.

FAQ

Puedes configurar Storybook en tu proyecto NX utilizando el complemento de Storybook. Primero, agrega el complemento con el comando 'nx add @nrwl/storybook'. Luego, genera la configuración de Storybook utilizando el comando 'nx g @nrwl/angular:storybook-configuration' especificando tu proyecto. Finalmente, ejecuta 'nx storybook [nombre_de_tu_proyecto]' para iniciar Storybook.

Para mover una biblioteca dentro de un espacio de trabajo NX, puedes utilizar el generador 'move' de NX. Ejecuta el comando 'nx g @nrwl/workspace:move --projectName [nombre_original] --destination [nuevo_nombre]' para mover la biblioteca a la nueva ubicación deseada.

Para crear una aplicación API con Express en un espacio de trabajo NX, primero debes instalar el complemento de Express con 'npm install @nrwl/express'. Luego, crea la aplicación API con 'nx generate @nrwl/express:application --name=api'. Esto configurará una nueva aplicación API en tu espacio de trabajo.

Para ejecutar pruebas de extremo a extremo con Cypress en una aplicación NX, asegúrate de que Cypress esté configurado en tu proyecto. Luego, utiliza el comando 'nx e2e [nombre_de_tu_app-e2e]' para ejecutar las pruebas de Cypress. Puedes añadir opciones adicionales para personalizar la ejecución de las pruebas.

Para agregar una dependencia implícita entre proyectos en NX, debes modificar el archivo 'nx.json'. Añade la dependencia bajo la clave 'implicitDependencies' especificando el proyecto y sus dependencias. Por ejemplo, para hacer que el proyecto 'store' dependa del proyecto 'api', añade '"store": ["api"]' en 'implicitDependencies'.

Puedes utilizar variables de entorno en un proyecto NX configurando archivos '.env' en la raíz del proyecto o directamente en las configuraciones de tus aplicaciones y bibliotecas. Utiliza la librería 'dotenv' para cargar estas variables en tus scripts o aplicaciones, asegurándote de que las claves de configuración estén correctamente referenciadas en tu código.

Isaac Mann
Isaac Mann
Zack DeRose
Zack DeRose
10 Jun, 2021
Video transcription, chapters and summary will be available after the recording is published.