Creating a Rush Monorepo with a React App and Shared Component Library

[@leighhalliday]

Would anyone like to see me make the same video but with Lerna?

[@abhinav.sharma]

Of course!!❤️❤️❤️❤️❤️❤️🔥🔥🔥🔥

[@dimitrisefstathiadis6562]

Can you do the same with Nx by Nrwl byes well?? I highly recommend it. It is so versatile you can make a series out of Nx..

[@muhamadimron9785]

yeah sir Leigh and it would be great , if u make it run along side with storybook/or react-styleguidist

[@igor_cojocaru]

Absolutely! Great idea

[@larube]

Yes i would really appreciate that !

[@abhinav.sharma]

"royally messed up" ah!! Mr. Halliday, you're a man of culture as well. Nice video as always!

[@leighhalliday]

Culture is my middle name! Thanks Abhinav!

[@mohssinerassy4733]

pnpm it let you share one node_modules folder so you will avoiding have alot of them for each npm project ...

[@kasunsaumya3151]

you can use any package manager(yarn or npm) to install mono-repo....

[@davidalexander8786]

something that I really take care on monorepos is the graph dependency and different versions within apps and libs, one just need to be very carefull

[@JacquiAmanda]

This is incredibly helpful, thank you !

[@alejonanez]

This was a great video - thanks for sharing!

[@lookintomyeyes2681]

The idea itself seems really cool, but isn't it hard to scale this up if we have many apps?.. am thinking of the monorepo size... It would be cool if different package manager install profiles itself can be globalized to minimize the size and get shared to run apps also does the rush takes more time to build if we deploy an app that does not include a component that another app uses?

[@leighhalliday]

I'm sure there are ways around excess build times! I think the key would be to know what your dependencies are, and then try to only build when the dependencies have changed. You'd have to do some work with the CI tool of your choice to make this happen, but I think it is possible! I think the other problem is worse... managing 15 different repos that are all somehow related and trying to keep them in sync.

[@davidalexander8786]

there is packages cache and only building what you need or change. Have you worked with 10 different repos at the same time for one app? crazy. Webpack is also a monorepo

[@kolta-1212]

🎉Incredible AWESOME ❤

[@leom553]

Good video. Should be great if you create any rig packages into rush structure.

[@beyondant]

Awesome video, but I found that after `rush deploy` you don't need to build it again, it should auto migrate the `build` file over unless you had it inside .gitignore of your app. Maybe they patched it from the point of the video.

[@milec7092]

Hi @Leigh Halliday🙂 , can you tell me how do you make the name of the branch appear in your terminal? Or can do you do a video for that. Or better give me the link to an article where I can learn how to place that, please. Thanks

[@leighhalliday]

Hey Mile! I am using oh-my-zsh with the powerlevel10k theme, which is what shows it :)

[@davidalexander8786]

there is no need to cd into every app/lib to run scripts. In a monorepo u should always run scripts from repository root folder

[@chitoan77]

Nice, thank you.

[@cray1303]

Thank You. This video was very useful. You have helped me to understand Rush Configuring. Best regards :)

[@leighhalliday]

Awesome! Glad it helped :)

[@lecongnha0901]

Can we do this with only using yarn workspace?

[@leighhalliday]

Maybe! But I am not familiar with yarn workspaces... give it a try!

[@MeatCatCheesyBlaster]

I got some error with netlify, think I followed all your steps correctly, but it could not build it

[@shrikanthps7409]

dude you are awesome

[@Chrosam]

Thanks for the video. Any thoughts on Rush vs Lerna ?

[@leighhalliday]

I'd love to tell you but I haven't used Lerna yet :) Have you?

[@Chrosam]

@@leighhalliday Yes, we're using lerna where I'm working, mostly to bump all modules at once with `lerna bootstrap`, and publish the new version of the monorepo to npm (private registry) with `lerna publish` (we're using a script to handle these commands and linking them through npm custom scripts) What caught my interest in rush (which I learned about from your video) is that it's by microsoft, but what stopped me from diving deep is that it doesn't seem to be widely adopted (other than a post I found on reddit saying they use it at Uber)

[@tarunsukhu2614]

I am using lerna with tsdx and cra , lerna does have good utilities where you can publish only the sub projects which are updated.. I am yet to check how rush handles it. The main concern I see is the new config json files which is more config over convention.. more code to maintain which you aren't really owning

[@sachinmogha5168]

learned a lot

[@malikbrahimi7504]

Can you do a tutorial on DevOps and scalable architecture for developers? I can containerize the components of my full stack apps but I really don't know how to setup CORS and the network between them, or how to decide which DB to use or how to scale it, how to use CI/CD, how to actually deploy and orchestrate containers, etc.

[@leighhalliday]

Hey Malik! Sorry, I wish I knew that stuff, but it's definitely outside of my strengths. I can barely get Docker working well on my mac locally!

[@malikbrahimi7504]

@@leighhalliday That's all good! Just wondering, thanks for the awesome content

[@chris3079]

@@malikbrahimi7504 is use TechWorld with Nana for that

[@viktorsoroka4510]

Good stuff. It would be great if you would explore lerna as well.

[@leighhalliday]

Hey Viktor! Great idea! I'll add it to my list.

[@yoyobu1666]

Can you do the same but between react js and react native please

[@leighhalliday]

Hey Yoyo! I'm not very experienced with React Native... in the future perhaps I'll cover RN, but not right now.

[@mortezatourani7772]

Awesome stuff

[@leighhalliday]

Thank you Morteza :)

[@rubiadias7677]

Muchas gracias una vez más. Saludos.

[@leighhalliday]

De nada Rubia!! Gracias por tu apoyo!

[@chris3079]

Did you try with tsdx react storybook, keep getting loaders error, thinking its like yarn workspaces no-hoist issue.

[@leighhalliday]

Hey Christopher, no that's not something that I've tried yet.

[@chris3079]

@@leighhalliday do u at work use Storybook? Any thought on it. Its a tool i wanna add to my bag.

[@leighhalliday]

Yes! At work we use it... but I don't do a lot of frontend dev at work so I am not super familiar with it.

[@abc-yg6tk]

tsdx is not actively maintained, when you use it with rush the unit tests dont work. A bunch of libraries like rollup and eslint are out of date. Unfortunately even in 2021 there are no gold standard updated tooling to just easily bootstrap a typescript react component library. If you do please let me know.

[@igor_cojocaru]

Thank you!

[@leighhalliday]

You're welcome, Igor!

[@johnsmith9288]

Can you do work on reversing code and using undocumented APIs

[@leighhalliday]

Hey John! I think the closest I'll get to that is this video on web scraping: kzbin.info/www/bejne/n4bXmnugd82Mgpo

[@manuelmorales8974]

Saludos!

[@dvjay1026]

I had high hope with Rush. Build up a project for more than a month. It's very buggy with no support. I don't think microsoft is very serious about Rush, neither the core developers. It feels more like their toy project. I moved on.

[@dennisdecoene]

Too.....many...... ADS! Otherwise thanks good info.

[@leighhalliday]

Think of it like you're helping me retire one day :)