ref

[phymo]

keep components pure

let guest = 0;

function Cup() {
  // Bad: changing a preexisting variable!
  guest = guest + 1;
  return <h2>Tea cup for guest #{guest}</h2>;
}

export default function TeaSet() {
  return (
    <>
      <Cup />
      <Cup />
      <Cup />
    </>
  )
}

[phymo]

• React lets you create components, reusable UI elements for your app.

• In a React app, every piece of UI is a component.

• React components are regular JavaScript functions except:

  • Their names always begin with a capital letter.
  • They return JSX markup.