Lerna and Monorepo architecture for JavaScript

Presentation of for the session of FOSSAsia's OpenTech Summit Sri Lanka 2020.

https://eventyay.com/e/3231dd0d

Transcript

1. Lerna and Monorepo architecture for JavaScript
2. Who am I Chathu Vishwajith Auth0 Ambassador Co-Founder of a startup Colombo JS Meetup Co-organizer @iamchathu Lerna and Monorepo architecture for JavaScript
3. Let's go on a journey together Lerna and Monorepo architecture for JavaScript
4. Lerna and Monorepo architecture for JavaScript
5. Project Lynx Lerna and Monorepo architecture for JavaScript
6. Project Lynx → Fullstack Javascript Lerna and Monorepo architecture for JavaScript
7. Project Lynx → Fullstack Javascript → Node.js/Typescript Backend Lerna and Monorepo architecture for JavaScript
8. Project Lynx → Fullstack Javascript → Node.js/Typescript Backend → React Frontend Lerna and Monorepo architecture for JavaScript
9. V 0.0 Lerna and Monorepo architecture for JavaScript
10. Multiple Projects (Multi-repo) Lerna and Monorepo architecture for JavaScript
11. Multiple Projects (Multi-repo) → Create separate projects for each. Lerna and Monorepo architecture for JavaScript
12. Multiple Projects (Multi-repo) → Create separate projects for each. → Separate CI tools. Lerna and Monorepo architecture for JavaScript
13. Multiple Projects (Multi-repo) → Create separate projects for each. → Separate CI tools. → Teams divided to each project. Lerna and Monorepo architecture for JavaScript
14. Lerna and Monorepo architecture for JavaScript
15. Shared Package Lerna and Monorepo architecture for JavaScript
16. Shared Package → Create another project. Lerna and Monorepo architecture for JavaScript
17. Shared Package → Create another project. → Add as a git dependancy. Lerna and Monorepo architecture for JavaScript
18. Shared Package → Create another project. → Add as a git dependancy. → yarn add https://gitlab.com/lynx/lynx-shared.git Lerna and Monorepo architecture for JavaScript
20. New updates! Lerna and Monorepo architecture for JavaScript
21. New updates! → Update version. Lerna and Monorepo architecture for JavaScript
22. New updates! → Update version. → Push new changes. Lerna and Monorepo architecture for JavaScript
23. New updates! → Update version. → Push new changes. → Update the dependency on the dependent packages. Lerna and Monorepo architecture for JavaScript
24. Lerna and Monorepo architecture for JavaScript
25. Nightmares Lerna and Monorepo architecture for JavaScript
26. Nightmares → Forgot to update. Lerna and Monorepo architecture for JavaScript
27. Nightmares → Forgot to update. → Duplicate dependacies. Lerna and Monorepo architecture for JavaScript
28. Nightmares → Forgot to update. → Duplicate dependacies. → Testing became hard. Lerna and Monorepo architecture for JavaScript
29. Nightmares → Forgot to update. → Duplicate dependacies. → Testing became hard. → Report issues in multiple places. Lerna and Monorepo architecture for JavaScript
30. Nightmares → Forgot to update. → Duplicate dependacies. → Testing became hard. → Report issues in multiple places. → Productivity went down! Lerna and Monorepo architecture for JavaScript
31. V 1.0 Lerna and Monorepo architecture for JavaScript
32. Monorepo Lerna and Monorepo architecture for JavaScript
33. Monorepo → Javascript has modules. Lerna and Monorepo architecture for JavaScript
34. Monorepo → Javascript has modules. → Local dependent modules. Lerna and Monorepo architecture for JavaScript
35. Monorepo → Javascript has modules. → Local dependent modules. → Share common dependancies. Lerna and Monorepo architecture for JavaScript
36. Monorepo → Javascript has modules. → Local dependent modules. → Share common dependancies. → One places to report issues. Lerna and Monorepo architecture for JavaScript
37. Monorepo → Javascript has modules. → Local dependent modules. → Share common dependancies. → One places to report issues. → Easy to test cross-modules. Lerna and Monorepo architecture for JavaScript
38. Monorepo → Javascript has modules. → Local dependent modules. → Share common dependancies. → One places to report issues. → Easy to test cross-modules. → Cross package changes. Lerna and Monorepo architecture for JavaScript
39. Monorepo → Javascript has modules. → Local dependent modules. → Share common dependancies. → One places to report issues. → Easy to test cross-modules. → Cross package changes. → Test across modules. Lerna and Monorepo architecture for JavaScript
40. Monorepo → Javascript has modules. → Local dependent modules. → Share common dependancies. → One places to report issues. → Easy to test cross-modules. → Cross package changes. → Test across modules. → Easy to publish Lerna and Monorepo architecture for JavaScript
41. Monorepo a Monorepo is a single repository holding the code of multiple projects which may or may not be related in some way. The projects managed in a Monorepo can be dependents of each other or they can be completely unrelated. Lerna and Monorepo architecture for JavaScript
42. Myths about Monorepo Lerna and Monorepo architecture for JavaScript
43. Myths about Monorepo → Anybody can change any file. Lerna and Monorepo architecture for JavaScript
44. Myths about Monorepo → Anybody can change any file. → Hard to scale. Lerna and Monorepo architecture for JavaScript
45. Myths about Monorepo → Anybody can change any file. → Hard to scale. → Big repository size. Lerna and Monorepo architecture for JavaScript
46. What are the tools Lerna and Monorepo architecture for JavaScript
47. What are the tools → Lerna. Lerna and Monorepo architecture for JavaScript
48. What are the tools → Lerna. → Yarn Workspace. Lerna and Monorepo architecture for JavaScript
49. What are the tools → Lerna. → Yarn Workspace. → Lerna with Yarn Workspaces. Lerna and Monorepo architecture for JavaScript
50. What are the tools → Lerna. → Yarn Workspace. → Lerna with Yarn Workspaces. → Nx. Lerna and Monorepo architecture for JavaScript
51. Who use Lerna Lerna and Monorepo architecture for JavaScript
52. Who use Lerna → React. Lerna and Monorepo architecture for JavaScript
53. Who use Lerna → React. → Babel. Lerna and Monorepo architecture for JavaScript
54. Who use Lerna → React. → Babel. → ZendDesk Garden. Lerna and Monorepo architecture for JavaScript
55. Lerna and Monorepo architecture for JavaScript
56. Lerna and Monorepo architecture for JavaScript
57. Nightmares Lerna and Monorepo architecture for JavaScript
58. Nightmares → Deployment. Lerna and Monorepo architecture for JavaScript
59. Nightmares → Deployment. → Project safety. Lerna and Monorepo architecture for JavaScript
60. Nightmares → Deployment. → Project safety. → Learning curve. Lerna and Monorepo architecture for JavaScript
61. Summary https://github.com/iamchathu/lerna-monorepo-test Lerna and Monorepo architecture for JavaScript
62. Summary → Mono repo is way of organizing multiple projects in single code reporsioty. https://github.com/iamchathu/lerna-monorepo-test Lerna and Monorepo architecture for JavaScript
63. Summary → Mono repo is way of organizing multiple projects in single code reporsioty. → Monorepo or Lerna are not silver bullets. https://github.com/iamchathu/lerna-monorepo-test Lerna and Monorepo architecture for JavaScript
64. Lerna and Monorepo architecture for JavaScript