Nx - The Obvious Choice

We live in a world constantly being tempted with choices. Choices that drain our time and energy. How do you decide what to use? How do you make sure your choice is the right one? Who should you trust?

Let me enlighten you on what benefits you will reap by using Nx (and monorepos) in every project size and setup. Let me give you enough arguments to make the right choice. The obvious choice you were missing this whole time.

Get ready for the future! Get ready for the age of monorepos!

Transcript

1. Miroslav Jonas / @meeroslav / nx.dev / nrwl.io
   The Obvious Choice
   Angular Munich Meetup / March 2022
   

   View Slide

2. Miroslav
   

   Jonaš
   @meeroslav
   

   View Slide

3. CHOICES
   

   View Slide

4. STAY FRESH
   LONGER
   

   View Slide

5. FILTER
   THE NOISE
   

   View Slide

6. ONE EASY
   CHOICE
   

   View Slide

7. ONE OBVIOUS
   CHOICE
   

   View Slide

8. Homepage App
   Backend
   Every application*
   UI Components
   

   /
   

   Design system
   

   View Slide

9. Homepage App
   Backend
   Every application*
   UI Components
   

   /
   

   Design system
   Service 1 Service 1 Service 1 Service 1 Service 1 Service 1 Service 1
   

   View Slide

10. Homepage App
    Backend
    Every application*
    UI Components
    

    /
    

    Design system
    Service 1 Service 1 Service 1 Service 1 Service 1 Service 1 Service 1
    Admin Portal App
    Mobile App
    

    View Slide

11. Homepage App
    Backend
    Every application*
    UI Components
    

    /
    

    Design system
    Service 1 Service 1 Service 1 Service 1 Service 1 Service 1 Service 1
    Admin Portal App
    Mobile App
    Utility
    

    View Slide

12. Main library
    Website / Docs
    Every open source*
    Demo 1
    Example 2 Showcase 3
    

    View Slide

13. Homepage App
    Backend
    Collocation
    UI Components
    

    /
    

    Design system
    Service 1 Service 1 Service 1 Service 1 Service 1 Service 1 Service 1
    Admin Portal App
    Mobile App
    Utility
    

    View Slide

14. Code sharing
    

    View Slide

15. Just collocation
    NOT
    

    View Slide

16. Affected graph
    store
    games sales coupons
    core
    shared
    admin
    

    View Slide

17. Workspace analysis
    

    View Slide

18. Task orchestration
    Test Build Lint
    Build
    Lint
    Test
    Build
    Lint
    Test
    

    View Slide

19. Caching
    Never { build, test, lint… } same code twice
    { build, test, lint,... }
    Nx
    Local cache
    { build, test, lint,... }
    Nx
    Local cache
    

    View Slide

20. Distributed task execution
    10 tasks
    110 tasks
    100 tasks
    150 tasks
    10 tasks
    105 tasks
    5 tasks
    60 tasks
    35 tasks
    Agent 1
    Agent 2
    Agent 3
    Agent 4
    Agent 5
    Single agent
    

    View Slide

21. Code constraints
    

    View Slide

22. Code constraints
    store
    games sales coupons
    core
    shared
    admin
    

    View Slide

23. But I have only one
    project…
    

    View Slide

24. @angular/cli is awesome
    but Nx is über awesome
    

    View Slide

25. Powerful generators
    

    View Slide

26. Consistent tooling
    

    View Slide

27. Demo time
    

    View Slide

28. Monorepos bring clarity
    - workspace analysis
    
    
    - graph visualization
    

    View Slide

29. - local & remote caching
    
    
    - task orchestration
    
    
    - detecting affected nodes
    
    
    - distributed task execution
    
    
    - remote execution
    Monorepos bring speed
    

    View Slide

30. - code sharing
    
    
    - code collocation
    
    
    - powerful generators
    
    
    - consistent tooling
    
    
    - code constraints
    Monorepos make it easy
    

    View Slide

31. nx.dev / nrwl.io
    Use
    

    View Slide

32. Miroslav Jonas / @meeroslav / nx.dev / nrwl.io
    The Obvious Choice
    Angular Munich Meetup / March 2022
    

    View Slide