https://github.com/chrvadala/react-refactor

:wrench: Convert your React Class Component to Functional Component and vice-versa
https://github.com/chrvadala/react-refactor

component-builder react refactoring-tools tools

Last synced: about 1 year ago
JSON representation

:wrench: Convert your React Class Component to Functional Component and vice-versa

• Host: GitHub
• URL: https://github.com/chrvadala/react-refactor
• Owner: chrvadala
• License: mit
• Created: 2017-11-07T21:30:13.000Z (over 8 years ago)
• Default Branch: master
• Last Pushed: 2018-07-29T15:07:58.000Z (almost 8 years ago)
• Last Synced: 2024-11-01T11:42:43.397Z (over 1 year ago)
• Topics: component-builder, react, refactoring-tools, tools
• Language: JavaScript
• Homepage: https://chrvadala.github.io/react-refactor
• Size: 2.36 MB
• Stars: 16
• Watchers: 4
• Forks: 4
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

          
# react-refactor

[![Build Status](https://travis-ci.org/chrvadala/react-refactor.svg?branch=master)](https://travis-ci.org/chrvadala/react-refactor)

[![Beerpay](https://beerpay.io/chrvadala/react-refactor/badge.svg?style=beer)](https://beerpay.io/chrvadala/react-refactor)

How many times have you converted a **React Class component** to a **React Functional component** and vice-versa? It’s a boring task, and we know...  "*developers don’t like boring tasks*".

Thanks to **React Refactor** you can convert any React component from and to Class component.

It's made with Babel Babylon and thanks to string replacing it’s able to instantly convert your component to the opposite kind of component that you provided.

**React Refactor** is available in three different packages: Library, CLI, Web Interface

## Library

[![npm](https://img.shields.io/npm/v/react-refactor.svg?maxAge=2592000?style=plastic)](https://www.npmjs.com/package/react-refactor)

[![Downloads](https://img.shields.io/npm/dm/react-refactor.svg)](https://www.npmjs.com/package/react-refactor)

The package *react-refactor* offers methods to programmatically convert a component. You can use it to make new useful utilities that integrate this ability.

````js

const {execRefactor} = require('react-refactor')

let {output} = execRefactor(source)

````

## CLI

[![npm](https://img.shields.io/npm/v/react-refactor-cli.svg?maxAge=2592000?style=plastic)](https://www.npmjs.com/package/react-refactor-cli)

[![Downloads](https://img.shields.io/npm/dm/react-refactor-cli.svg)](https://www.npmjs.com/package/react-refactor-cli)

You can globally install the package **react-refactor-cli** and use it to convert your component on the fly.

````

$ yarn global add react-refactor-cli

$ react-refactor [--output ] 

````

## Web interface

You can avoid installing anything and convert your component through the web interface available at [https://chrvadala.github.io/react-refactor/](https://chrvadala.github.io/react-refactor/)

## Changelog

- **v0.0** - Preview version

- **v1.0** - First stable version

## Run tests

````

yarn install

yarn run bootstrap

yarn build

yarn test

yarn run clean

````

## Contributors

- [chrvadala](https://github.com/chrvadala) (author)