web-components

Develop and reuse front-end components rapidly

Overview

• 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';

Enjoy!