Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Let’s go monorepo - intro to Nx.dev

Let’s go monorepo - intro to Nx.dev


  1. 1 What is a monorepo A good intro: https://monorepo.tools/#understanding-monorepos ʻʻA

    monorepo is a single repository containing multiple distinct projects, with well-defined relationships.’’
  2. 4 Why monorepo? If no sharing code… 1. Significant code

    duplication… 2. Inconsistent tooling service 1 “swr”: “^2.0.3” service 2 “swr”: “^1.3.0” service 3 “swr”: “^0.4.2” ⇒ Unexpected Behaviors!! service 1 commit: Force prettier… service 2 commit: Force prettier… service 3 commit: Force prettier… ⇒ A lots of manual work!!
  3. 6 Nx - a monorepo tool ‘Nx is the vscode

    of monorepo.’ ⇒ Various plugins can be installed and Nx will control versions https://nx.dev/nx-api
  4. 8 Nx feature - project scaffolding Install plugin cc Create

    project 1. Command line tool npx nx generate @nx/expo:application --name=far-me --directory=projects/far- me --projectNameAndRootForma t=as-provided --no-interactive 2. Vscode plugin (need to install)
  5. 9 Nx feature - project scaffolding (conti.) 1. Run our

    previous far-me app: npx nx run far-me:start 2. Install the expo go app from app store or google play. 3. Scan the QRcode to open our app your phone need to connect to the same wifi with computer
  6. 10 Nx feature - code sharing Let’s create another to-be-used

    Javascript library. • npx nx generate @nx/js:library --name=foo --directory=lib/foo --projectNameAndRootFormat=as-provided --unitTestRunner=jest --no-interactive
  7. 14 Nx feature - affected (conti.) npx nx show projects

    --affected ⇒ Can be used in CI/CD~ npx nx affected -t deploy