Recently, I began a new endeavour on a new project that would hopefully expand upon some of my old skills and start to expose new technologies I hadn't yet had the chance to work in. I chose to make a 'UI Kit', or in this case a React Component Library. What I hadn't expected was how difficult it would be to get a project like this off the ground.
My first goal was to create a package that I could include in other projects as a node module that would have many different preset React components included to speed up development time / mimic professional workflows. Because I had never done anything like this, I would need to wrap my head somewhat around many new technologies, including Bundlers, Rollup, Storybook, and eventually TypeScript as I thought it would be a good chance to learn how.
Ultimately, the setup phase involved the following:
- TypeScript
- Sass/Scss
- JSX
- All of the above plus regular JS and CSS to be (pre)processed and bundled for distribution, using Rollup and various plugi