Skip to content

Instantly share code, notes, and snippets.

@StoneCypher
Last active January 3, 2018 18:15
Show Gist options
  • Save StoneCypher/96e2c147694bddb91c98 to your computer and use it in GitHub Desktop.
Save StoneCypher/96e2c147694bddb91c98 to your computer and use it in GitHub Desktop.
// this is the react app. it knows nothing of the vanilla app, other than that the information
// will come in in props, and that it should call this hook when this button is pressed, or etc
var Spinner = (props) =>
<div>
{this.props.data}
<button value="↑" onclick={this.props.hooks.inc}/>
<button value="↓" onclick={this.props.hooks.dec}/>
</div>;
export {Spinner};
import {Spinner} from './brainless_renderer.js';
// this is a vanilla js app. it knows nothing of react, other than
// to call `.render` on line 9 with relevant data and callbacks.
var App = function() {
var repaint = () => ReactDOM.render(document.body, <Spinner data={counter} hooks={hooks}/>),
counter = 0,
inc = () => { ++counter; repaint() },
dec = () => { --counter; repaint() },
hooks = {inc, dec};
return {
value: () => counter,
inc,
dec,
repaint
};
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment