Minimal React example

minimal-react.js

const React = (() => {
  let hooks = [];
  let idx = 0;

  function useState(initValue) {
    let state = hooks[idx] || initValue;
    let _idx = idx;
    let setState = (newValue) => {
      hooks[_idx] = newValue;
    };

    idx += 1;

    return [state, setState];
  }

  function render(component) {
    idx = 0;
    const c = component();
    c.render();
    return c;
  }

  return { useState, render };
})();

function MyComponent() {
  const [count, setCount] = React.useState(1);
  const [text, setText] = React.useState("Message");

  return {
    render: () => console.log({ count, text }),
    click: () => setCount(count + 1),
    type: () => setText(word),
  };
}

let app = React.render(MyComponent); // { count: 1, text: "Message" }
app.click();
app = React.render(MyComponent); // { count: 2, text: "Message" }
app.click();
app = React.render(MyComponent); // { count: 3, text: "Message" }