NxFrontends

This project was generated using Nx (v12.0.6)

ℹ️  use the node.js v12 LTS

🌎  Pipelines (builds) on MS Azure DevOps

Goal

• create 2 simple frontend application using react, have one a shared assets lib and a shared ui components lib used from both of the applications

• master how to define and use the Azure DevOps Services | Microsoft Azure CI/CD pipelines as code (YAML)

• integrate the gatsby support and identify how to use it

• use the storybook support and integrate it to the azure pipelines

Documentation

• Dev environment known issues

• GitHub Tips

• Nx

  • Nx Gatsby Plugin

  • Nx Storybook Plugin

• Project creation commands (steps)

• Build and release flows

  • Proposed idea

  • Using the Microsoft Azure DevOps

    • Pipelines flows

    • Load .yml pipeline into Azure DevOps

    • Trigger pipeline over a REST API call

  • Create and use a GitHub PAT

Project dependencies graph

implicit - means kind of manual mapping

Findings

• it's possible to have more flexible libs

  • create an assets lib to share the SASS (.scss) common files and also the images, which is a folder with the given content needed inside (no ts or other nx lib stuff related inside of it)

    • Sass: LibSass is Deprecated - sass package | npm

  • have a component lib that expose the whole content of itself and with that gain more flexibility to access the shared components from others libs or applications

• it's possible to use the gatsby inside of the nx workspace, but it demands a bit of some extra manual steps to map the paths alias that will be used on the code and with that avoid to handl e the relative imports (avoid the need of this: ../..)