Monorepos

In order to maintain everything in one place and make somethings easier to do, we’ve decided to try monorepos for client portal. I know, monorepos could sound messy, but the community have been using a lot of them and many incredible tools have been appearing.

At first I watched Ben’s wad tutorial on Monorepos:

At this point, you’re probably very confident that Lerna is the way to go, at least thats what I thought until I find out about Nx

The good things about NR is that it seems to be founded by a Ex Googler. Nx helps you to implement good practices like the ones used at Google, Mircosoft and Facebook that’s what they say at least.

Key Differences at Front

NX

• Heavily Opinated
• Full Suite
• Cypress Included
• Focus on Backend Frontend Integration

Lerna

• Unopinated
• Focus on multiple projects (npm packages)

So let’s find out!

My goal is to create a project using each of the monorepo tools so I can have a better opinion on which one to choose for my current problem

My Goal

Our goal is to create a project that contains

- Mongodb
- Webapi (Express) (GraphQL)
- React Webapp
- Cypress E2E

Lerna

Lerna’s getting started is pretty straightforward but unfortunaly since lerna is not an opinated tool, it doesn’t tech you or guide you on how should you build your project.

Fortunatly, Erzhan Torokulov wrote this incredible blog post on medium with his opinions on how to get started with lerna

Other resources:

• https://github.com/benawad/react-apollo-monorepo
• https://dev.to/shnydercom/monorepos-lerna-typescript-cra-and-storybook-combined-4hli

Conclusion

Lerna is a good very flexible tool! Is probably one of the bests tools out there to help you de-couple big projects.

Nx

Nx tutorials are simply awesome, they have a lot of youtube videos with great explanation. The first thing that you notice while using Nx for the first time is it’s knowledge of how big applications work. It already comes with e2e using cypress and a lot of things that helps you to share code on big companies.

One magical thing Nx have is a graph of your dependencies. By using this graph Nx reduces the time of build and test on your pipeline since it only lint/test/executes what actually needs. This makes Nx veeeery scalable for big projects. Nx also uses a lot of resources to extend the linting rules and make them work nicely with a base set of rules

Nx enforces a lot of good practices right out of the box. Some things that I’ve found interesting contain:

Nx Monorepos

Yarn Workspaces

While doing the monorepo, I’ve stumbled into Yarn Workspaces and we ended up using yarn workspaces.