rbiggs

<input type="text" oninput={ e => send({type: 'updateInputValue', value: e.target.value})} />

rbiggs

{
  type: 'newValue',
  value: 'This is the new value!'
}

rbiggs

view(state, send) {
  return render(<List {...{ state, send }}/>, '#app')
}

rbiggs

function List({ state, send }) {
  return (
    <div class="list-container">
      <p>
        <input type="text" />
        <button class="add-item">Add</button>
      </p>
      <ul class="list">
        {
          state.fruits.map(item => <li key={item.key}>

rbiggs

init() {
  // Return state to use in program:
  return state
}

rbiggs

init() {
  // always return state:
  return state
}

rbiggs

const state = {
  newKey: 104,
  inputValue: '',
  fruits: [
    {
      key: 101,
      value: 'Apples'
    },
    {
      key: 102,

rbiggs

run(program)

rbiggs

const program = {
  init() {

  },
  view(state, send) {

  },
  update(state, msg) {

  },

rbiggs

// Counter for view:
function Counter({state, send}) {
  return (
    <p>
      <button onclick={() => history.go(0)} id='reload-btn'>Restart</button>
      <button class='counter' onclick={() => send()}>{state}</button>
    </p>
  )
}