Automate creating your ReactJs components
This script is built for personal use when I got frustrated creating components manually and was all the same work I had to do. I came across this sample script to boot my productivity creating ReactJs component through the shell script by one single command with the code snippet along with the scss file too.
cloning
ssh
$ git clone git@github.com:lifeeric/automate-React-Component.git
or
https
$ git clone https://github.com/lifeeric/automate-React-Component.git
Permission
$ chmod +x arc
make it global
$ sudo cp arc /bin
Usage
syntax
$ arc [COMPONENT NAME]
example
$ arc Header
$ tree
.
└── src
└── components
└── Header
├── Header.scss
└── Header.tsx
example 2
$ arc Header/Navbar
$ tree
.
└── src
└── components
└── Header
├── Header.scss
├── Header.tsx
└── Navbar
├── Navbar.scss
└── Navbar.tsx
New features need to be added
It works fine until now for me even if I try to create a nested component, at the moment I'm configured for TypeScript
only. and hope to add Javascript
, CSS
as well. perhaps stop overwriting component
github link to download, review and contribute
lifeeric / Automate-React-Component
Creating ReactJs component with snippet and containing SCSS file too through this script by on command
Automate creating your ReactJs components
This script is built for personal use when I got frustrated creating components manually and was all the same work I had to do, I came across this sample script to boot my productivity creating ReactJs component through the shell script by one single command with the code snippet along with the scss file too.
cloning
ssh
$ git clone git@github.com:lifeeric/automate-React-Component.git
or https
$ git clone https://github.com/lifeeric/automate-React-Component.git
Permission
$ chmod +x arc
make it global
$ sudo cp arc /bin
Usage
syntax
$ arc [COMPONENT NAME]
example
$ arc Header
$ tree
└── src
└── components
└── Header
├── Header.scss
└── Header.tsx
example 2
$ arc Header/Navbar
$ tree
.
└── src
└── components
└── Header
├── Header.scss
├── Header.tsx
└── Navbar
├── Navbar.scss
└── Navbar.tsx
New features need to be added
It works fine until now for…
Top comments (2)
You could use plopjs.
Wow, this is a super awesome tool. Thanks for sharing this, Simt!