What’s the best way to organize reusable components in projects?

I’ve been just lurking, but this question got me thinking! I’m no expert, but I find per-project setups less overwhelming. A shared library sounds good theoretically, yet I worry I’d get lost in maintaining it and overthink everything. With a per-project approach, it might be messier, but at least I know where everything is. It probably depends on project size though. I’m interested to hear what others think!

Per-project libraries are definitely better than a single monolith, change my mind! Monorepo setups scale better, and you can share what you need via npm workspaces or Turborepo which helps avoid versioning headaches. A single library? It turns into a nightmare when it comes to merging across multiple repositories.

One solid approach is to start with components in your project first. Only move them to a shared library once they've shown stability from real use cases. Shared libraries do enhance consistency, but pulling components too soon can result in fragile abstractions that require more maintenance down the line. The best reuse happens after components have seen repeated usage, not just because you anticipate needing them.

It really depends on the scale of your projects. For smaller tasks, keeping things per project is quicker and has less overhead. Shared libraries start to make sense when you're reusing the same components in multiple places. For larger setups, I usually maintain a small shared base (like buttons and inputs) and let projects build on that instead of cramming everything into one massive library. I've tried the 'one library for all' approach before, and it just became a maintenance nightmare.

I personally have my own library that I take with me from job to job. It acts like my very own toolset. It's handy having everything I need in one place!