node package manager


Develop and reuse front-end components rapidly

Build Status


  • Real time React components' development using react-storybook
  • Develop components in ES2015 and CSS in PostCSS processor
  • Publish your complied components and stylesheets as individual Node.js module
  • Separating test and business logic by writing component tests using Enzyme right in this repo

Developing Components

  1. Run npm install
  2. Run npm start to start front-end development
  3. Develop and Write tests
  4. Define components to be exported: src/index.js
  5. Update package version and run npm publish

Available Components

Activate components by appending or toggling whether to show the stories by modifying stories.json

  • Playground: for quick testing
  • Counter: for testing Redux data flow
  • News: for getting data from json-server
  • Dialog
  • Gallery

Using Components in any other projects

  • Install latest version of this module
npm install --save web-components
  • Simply destruct your components like this:
import Hero from 'web-components/dist/hero';
  • Inject styling for your component in your project:
// Component Base Style 
import 'web-components/dist/gallery.css';