flexx_like_react.py

## Option 1 - strings for verbatim html, dicts for elements with attributes
class MyReactlikeWidget(ReactLike):

    name = event.StringProp('john', settable=True)
    
    def render(self):
        return ['greet: ',
                dict(type='b',
                     onclick=lambda:print('clicked!'),
                     innerHTML='hi ' + self.name),
                '<br><button onclick="alert(\'told you!\')">dont click me</button>',
                dict(type='button',
                     onclick=lambda:window.alert('told you'),
                     innerHTML='dont click me'),
                ]

## Option 2 - Element class to ease the spelling, second arg can be dict with args
class MyReactlikeWidget(ReactLike):

    name = event.StringProp('john', settable=True)
    
    def render(self):
        return [Element('span', 'greet: '),
                Element('b', dict(onclick=lambda:print('clicked')),
                        'hi ',
                        self.name),
                Element('br'),
                Element('span', '<button onclick="alert(\'told you!\')">dont click me</button>'),
                Element('button', dict(onclick=lambda:window.alert('told you')),
                        'dont click me'),
                ]

This is awesome! I really like the second example!

Besides more structure (nesting widgets?) it would be cool to also extend the example with an input box that can be used to update self.name. That would complete the unidirectional feedback loop touted by react-likes.