app-annotated.js

// first, import whatever external modules will be needed
import React from 'react'
import { render } from 'react-dom'

// new 'class' App is based on the default React Component
class App extends React.Component {
  // inside, there are 'methods':
  // a special constructor method, called when the component is created 
  constructor () {
    // a 'super call' has to be made before using 'this' in a component
    super()
    // 'this' is simply the component (less simply, it's the current context, which here happens to be the component)
    // a 'state' in React is everything that can change. Try to have as little state as possible
    this.state = {
      who: "React"
    }
  }
  // another method - 'render' - it tells React how to... render the component
  render () {
    return (
      // this 'HTML in JS' is called JSX
      <div>
        {`Hello ${this.state.who}`}
      </div>
    )
  }
}

// Finally, we use React-DOM. React can be used in many contexts, websites are just one of them.
render(<App />, document.getElementById('root'))