RRU 026: Building React Applications in a Monorepo with Luis Vieira




React Round Up show

Summary: <p><strong>Panel:</strong></p> <ul> <li>Charles Max Wood</li> <li>Nader Dabit</li> <li>Lucas Reis</li> </ul> <p><strong>Special Guests:</strong> Luis Vieira</p> <p>In this episode, the React Round Up panelists talk to Luis Vieira about his <a href="https://medium.com/@luisvieira_gmr/building-large-scale-react-applications-in-a-monorepo-91cd4637c131">“Building large scale react applications in a monorepo”</a>. Luis works in Portugal at a company called <a href="https://www.farfetch.com/">FarFetch</a> as a front-end architect where he works mostly on <a href="https://www.javascript.com/">JavaScript</a> and infrastructure. They talk about the rationale behind his article, shared components, and what <a href="https://github.com/lerna/lerna">Lerna</a> is and what is does. They also touch on <a href="https://semver.org/">Semantic Versioning</a>, the difference between monolithic application and a monorepo, and more!</p> <p><strong>In particular, we dive pretty deep on:</strong></p> <ul> <li>Luis intro</li> <li>Front-end architect at <a href="https://www.farfetch.com/">FarFetch</a> </li> <li>Works with <a href="https://www.javascript.com/">JavaScript</a> </li> <li>Rationale behind his article</li> <li>Dividing a project in multiple packages</li> <li>Sharing components between multiple applications</li> <li>Editing shared components</li> <li>Working in a monorepo</li> <li>Simplifies managing between different projects</li> <li>Requires more tooling</li> <li>What is <a href="https://github.com/lerna/lerna">Lerna</a>?</li> <li>If you put multiple packages in one repo, how do you deal with things like the Git history getting mixed up?</li> <li>Versioning</li> <li>How does <a href="https://semver.org/">Semantic Versioning</a> interplay with monorepos?</li> <li>What if you’re not using Semantic Versioning?</li> <li>Using the conventional commit</li> <li>How is the state of CI tooling regarded?</li> <li>He is currently more focused on <a href="https://reactjs.org/">React</a> </li> <li>What he is experimenting with currently</li> <li>Building monolithic apps</li> <li>Monolithic aps VS monorepo</li> <li><a href="https://bazel.build/">Bazel</a></li> <li><a href="https://nrwl.io/nx">Nrwl Nx</a></li> <li>And much, much more!</li> </ul> <p><strong>Links:</strong></p> <ul> <li><a href="https://medium.com/@luisvieira_gmr/building-large-scale-react-applications-in-a-monorepo-91cd4637c131">“Building large scale react applications in a monorepo”</a></li> <li><a href="https://www.farfetch.com/">FarFetch</a></li> <li><a href="https://www.javascript.com/">JavaScript</a></li> <li><a href="https://github.com/lerna/lerna">Lerna</a></li> <li><a href="https://semver.org/">Semantic Versioning</a></li> <li><a href="https://reactjs.org/">React</a></li> <li><a href="https://bazel.build/">Bazel</a></li> <li><a href="https://nrwl.io/nx">Nrwl Nx</a></li> <li><a href="https://medium.com/@luisvieira_gmr">Luis’s Medium</a></li> <li><a href="https://twitter.com/luisvieira_gmr">@luisvieira_gmr</a></li> <li><a href="https://nuzzel.com/luisvieira_gmr">Luis’s Newsletter</a></li> </ul> <p><strong>Sponsors</strong></p> <ul> <li><a href="https://www.telerik.com/kendo-angular-ui/?utm_medium=cpm&amp;utm_source=adventuresinng&amp;utm_campaign=dt-kendo-ang2-nov16&amp;utm_content=audio">Kendo UI</a></li> <li><a href="https://www.digitalocean.com/">Digital Ocean </a></li> <li><a href="http://getacoderjob.com/">Get a Coder Job</a></li> </ul> <p><strong>Picks:</strong></p> <p>Charles</p> <ul> <li>Take some time off</li> <li>Take a step back to reevaluate</li> </ul> <p>Nader</p> <ul> <li>Free workshop with Tyler McGinnis to come soon. Keep an eye out at <a href="https://twitter.com/dabit3?ref_src=twsrc%255Egoogle%257Ctwcamp%255Eserp%257Ctwgr%255Eauthor">Nader’s Twitter</a> or <a href="https://tylermcginnis.com/newsletter/">Tyler’s Newsletter</a> </li> <li><a href="https://react-native.eu/">React Native EU</a></li> </ul> <p>Lucas</p> <ul> <li><a href="https://sketch.systems/">Sketch.systems</a></li> </ul> <p>Luis</p> <ul> <li><a href="https://github.com/vuejs/vue-cli">Vue CLI</a></li> </ul>