GISELA MIRANDA DIFINIGI
Navigate back to the homepage

React Components Library

Gisela Difini
July 14th, 2020 · 1 min read

Hi! Just wanted to share this repo that I’ve created with typescript, styled-components, storybook, and react testing library for starting new react components library.

Github Repository

https://github.com/GiselaMD/react-lib-components

Generating New Components

There is a file under utils called create-component.js to help creating new components:

Component auto creation

Instead of copy pasting components, you can instead run this command to generate all the files you need to start building out a new component. To use it, just run:

1npm run generate ComponentName

Then you’ll have this component structure:

1/src
2 /ComponentName
3 ComponentName.tsx
4 ComponentName.stories.tsx
5 ComponentName.test.tsx
6 ComponentName.types.ts
7 ComponentName.styles.ts

👋🏻

More articles from Gisela

Creating a custom chart.js legend style

Hi! For those who don't know chart.js , it's a javascript chart library. Using a library for creating data visualization can be a little…

September 18th, 2020 · 1 min read

Creating a React Input component in typescript

🇺🇸 Here is a nice way to create a React Input component using typescript! Using an interface to declare your own prop types as well as…

August 9th, 2020 · 1 min read
© 2020 Gisela
Link to $https://github.com/GiselaMDLink to $https://instagram.com/giselamirandaLink to $https://www.linkedin.com/in/giselamd/Link to $https://dribbble.com/GiselaDifini