web-lego v1.0.0

Web Lego

Like lego this library is a reusable design system to unify the whole airtel web with one design language.

Few useful tasks

• yarn storybook it will open an isolated development environment for the developer in storybook.
• yarn build it will create a build for the npm module.
• yarn test will create run test cases for npm module.
• yarn test:watch will run the test cases in developer mode.
• yarn build-storybook will create a build for the storybook module which can be published anywhere.
• yarn publish will clear the existing library, then create a new build and publish the newly built library to npm nexus.

How to setup the code

• Checkout the code
• Run yarn
• You may face some issues in downloading all the dependencies outside VPN so do the same within VPN and outside VPN
• For development run yarn storybook to have an isolated environment for individual component.

Tech used

The decisions we took to create the component library was tough and we ended up using the below tech stack.

• React as primary framework.
• Rollup for bundling the lib efficiently.
• Storybook to develop/test the components in complete isolation.

Standard process to develop any component in the library

We are willing to move forward with the standard approach WIP

Tasks to be accomplished

• Add linting and husky for precommit phase of the codebase.

Completed tasks

• Scaffolding prep.
• Rollup integration
• Story book Integration
• Move the development module development utility to npm module

Future enhancements items

• Move Story book to webpack 5 (Done)
• Enable documentation for stories. (Done)
• Move the development module development utility to npm module
• npm registry file to publish the document to be added.