ReactFoo Pune

On lessons learned during implementation.

Kamlesh Chandnani


React shared libraries and module systems

Submitted Nov 30, 2017

So my day job is to design and architect projects at my workplace and soon I realized that there were many common UI elements required across projects and I always end up copy-pasting those elements to newer as well as existing projects over and over again.

This was tearing me down me and I know everyone has gone through this phase in one or the other way.

So, I decided to extract the common elements which were used across the projects and compose an npm package out of it, and I have figured out all the steps and measures that can help you to do it in a proper way.


The talk will cover all the dos, don’ts, guides etc. that should be taken care of while extracting out some piece of code and compose them as a tiny UI library in the form of an npm package.


  1. What are the different module systems.
  2. What module systems to target and when.
  3. How to Make the library Tree Shakeable.
  4. When to use Babel.
  5. When to use Bundlers.
  6. How to manage the meta data for your libraries using the power of package.json
  7. What to publish to npm.

And when we sum up all the above points we will be able to build our own React UI Library the right way. :)


Basic javascript and understanding of react.

Speaker bio

Speaker at ReactiveConf 2017 • 💚 web • Foodie 🍜 • Open Source Enthusiast • Built react-chunkable • Tech Speaker • Blogger @medium • Obsessed by Web Performance 🚀


{{ gettext('Login to leave a comment') }}

{{ gettext('Post a comment…') }}
{{ gettext('New comment') }}
{{ formTitle }}

{{ errorMsg }}

{{ gettext('No comments posted yet') }}

Hosted by

A community - for and of - front-end engineers to share experiences with ReactJS, performant apps with React, crafting better User Interfaces (UI) with React and GraphQL ecosystem. ReactFoo also discusses design patterns and user experience. more