1. Bit

bit.dev — Search and choose components by bundle-size, dependencies, labels and snapshot previews

Bit is more than just a component playground. It’s an open-source tool that lets you encapsulate components with all their files and dependencies, and run them across different applications out-of-the-box.

As Bit makes it easy to share and collaborate over components across projects. It provides a free cloud-based hub called bit.dev in which you can easily share, discover and colalborate on your components.

The components you share to bit.dev become discoverable in your team’s a shared component hub. You can search your components by context, bundle-size or even dependencies. You can quickly browse results based on visual snapshots of the actually-rendered components, and choose with your eyes.

→ Explore components on bit.dev

When you go into one of your component’s web-page, you will discover that Bit presents the component in a live playground so that you can play with it before choosing to consume it in your application. If you have JSDocs or an .md file as part of the code, Bit will parse and present these docs as well. If the components include unit-test files, Bit will run them in isolation and present the results as part of the documentation for every component.

When finding a component you like to use, just use NPM or Yarn to install it. You can even use Bit to develop and update the components directly from any consuming application, so your team can collaborate and build together.

When sharing components through Bit you don’t have to set up any more repositories or tools, no need to refactor or change your code, and the same hub where you share components are where they become documented and discoverable, pretty much out of the box.

Get started:

2. Codesandbox