grcmp

An opinionated CLI generator for ReactJS components.

Why?

As a ReactJS developer, from time to time, I have to create components of same structure, by manual copy & paste. It is a time consuming no-brainer process that any React dev may repeat everyday.

Typically, there are two kinds of components: Functional and Class Components, the basic structure of either could always look the same, in one project:

Functional Component:

import React from "react";

const Cmp = props => {
  return <div className={s.cover} style={bgStyle}></div>;
};

export default Cmp;

Class Component:

import React, { Component } from 'react'

class Cmp extends Component {
    componentDidMount() {
    }
    render() {
        return (
        )
    }
}

export default Cmp

It should be a super easy tool to automatically generate these files, without manual new file creation or copy & paste. So, here you are.

Install

Run

npm install -g grcmp

You may need to sudo it.

## Usage

Generate Class Component

Run

grcmp <ComponentName>

This will create a folder of your component name, and a Class Component js file with the same name.

Generate Pure Function Component

Run

grcmp <ComponentName> --pure

or

grcmp <ComponentName> -p

This will create a folder of your component name, and Pure Function Component js file of the same name.

### Generate Component (Class or Pure) with a CSS file

Run

grcmp <ComponentName> --pure --css

or

grcmp <ComponentName> -p -c

This will create a folder of your component name, and component (Functional if --pure) js file of the same name, and a css file of the same name.

That's it!

Enjoy and feel free to share your suggestion!

TODO

• Add yarn add globalsupport
• Add Chalk fancy colors