relpers
A group of small React Helpers to reduce your React boilerplate.
$> npm install relpers --save
Documentation: https://goncalvesjoao.github.io/relpers/
@injectProps
Injects the selected properties (of the class instance) before the target method's parameters.
If no property is selected, defaults to 'props'.
; Component @injectProps { return <p> firstName lastName - email </p>; }
or
; Component @ { return firstName + ' ' + lastName; } { return <p> this - thispropsemail </p>; }
@killEvent
Executes event.stopPropagation() and event.preventDefault() for you.
; Component @killEvent { ; } { return <a href="#" onClick= thisonLinkClick > <span>"Notice that your browser's URL is not being updated with '#' in it."</span> </a> ; }
or
; Component { return <a href="#" onClick= > <span>"Notice that your browser's URL is not being updated with '#' in it."</span> </a> ; }
@applyMixin
thanks @sergiodxa
;; @Component { thishistory; } { return <button onClick= this > thispropschildren </button> ; }
applies mixins to your Component without the need to use React.createClass like the example below:
; const Link = React;
Notes:
This tool was built using:
- node 5.0
- npm 3.3.6
Contribute:
$> git clone git@github.com:goncalvesjoao/relpers.git
$> cd relpers
$> npm install
$> npm start
"npm start" will launch the site that you see at: https://goncalvesjoao.github.io/relpers/ but on your local machine at http://localhost:9000 where you can preview your changes in real-time and document how your helper should be used.
Then create some specs in 'test/specs/' directory and make sure all tests are green with:
$> npm test