JSFiddle - React, Tailwind, and code Playground

by shapeshifta

JavaScript

class Component {
  constructor(name) {
    this.name = name;
    this.state = {};
    this.init();
  }
  init() {
    this.render();
    this.componentDidMount();
  }
  update(data) {
    if (!_.isEqual(this.state, data)) {
    	console.log('component will render');
      this.render();
      this.state = Object.assign({}, this.state, data);
    }

    console.log(`state is now ${JSON.stringify(this.state)}`);
  }
};

class User extends Component {
  componentDidMount() {
    console.log('mounted')
  }
  render() {
    console.log('render')
  }
}

const user = new User("Dude"); // Hello Dude!
user.update({});
user.update({'foo': 'bar'});
user.update({'foo': 'bar'});