Get started with mobx-react-lite CDN

import React from 'react';
import { observer, makeAutoObservable } from 'mobx-react-lite';

class CounterStore {
  constructor() {
    makeAutoObservable(this);
    this.count = 0;
  }

  increment = () => {
    this.count++;
  };

  decrement = () => {
    this.count--;
  };

  get doubleCount() {
    return this.count * 2;
  }
}

const CounterStoreInstance = new CounterStore();

const Counter = observer(() => {
  const { increment, decrement, count, doubleCount } = CounterStoreInstance;

  return (
    <div>
      <button onClick={increment}>Increment</button>
      <button onClick={decrement}>Decrement</button>
      <p>Count: {count}</p>
      <p>Double Count: {doubleCount}</p>
    </div>
  );
});

React.render(<Counter />, document.getElementById('root'));