react-cnp-component-creator


Generates react components based on the Container&Presenter pattern.

Support Both class and functional components!
한국어 가이드 문서

💡Installation

#### npm

``bash
$ npm install -g react-cnp-component-creator
`

#### yarn

`bash
$ yarn global add react-cnp-component-creator
`

📖Usage

Generate component to the directory where you want.

`bash
$ crc -n -d
`

Can skip directory-name (default directory : src/)

`bash
$ crc -n
`

Will make 3 files.

`bash
$ crc -n example // The first character is automatically converted to uppercase.

CREATE src/Example/ExamplePresenter.js
CREATE src/Example/ExampleContainer.js
CREATE src/Example/index.js
`

Can make class component

`bash
$ crc -n -c
`

⚙️Options

| name | alias | description |
| --------- | ----- | -------------------------------------------- |
| name | n | Name of component will create |
| directory | d | Path of component will create (default: src) |
| classType | c | Create a component a class component |

📑File Content

##### index.js

`js
import Example from "./ExampleContainer.js";
export default Example;
`

##### ExampleContainer.js

`js
import react from "react";
import ExamplePresenter from "./ExamplePresenter";

const ExampleContainer = () => {
return ;
};

export default ExampleContainer;
`

##### ExamplePresenter.js

`js
import react from "react";

const ExamplePresenter = () => {
return <>;
};

export default ExamplePresenter;
`

$3

##### ExampleContainer.js

`js
import React, { PureComponent } from "react";
import ExamplePresenter from "./ExamplePresenter";

class ExampleContainer extends PureComponent {
state = {};
render() {
const {} = this.props;
const {} = this.state;
return ;
}
}

export default ExampleContainer;
`

##### ExamplePresenter.js

`js
import React, { PureComponent } from "react";

class ExamplePresenter extends PureComponent {
render() {
const {} = this.props;
return <>Example Component!;
}
}

export default ExamplePresenter;
``

😵Check list

Can't overide existing folder & file.