Event listeners and components in React. Today I Learned: Friday 24th June 2022

  • Self-closing tags are tags that close themselves. <img> and <input> are examples in HTML, but in JSX you need to include a ‘ /’. For example: <br> in HTML would be <br /> in JSX.
  • If you want to put JavaScript into a JSX expression, you need to wrap it in curly braces{}
  • Event listeners are attributes added to elements that trigger an action. One example is onClick = {function}, another is onMouseOver = {function}.
    • They start off with the word ‘on’, followed by the action.
    • One this to note is that in HTML, event listeners are written in lowercase. Whereas in JSX, they’re written in camelCase.
  • In javascript, you use ‘===’ to compare two variables. In Python and Go, its just two = signs. Why is this?
  • JSX keys are an attribute. They are used by React to keep track of lists. A list will need a key if it has memory. I’m not sure what exactly this means yet.
  • Components are what React applications are made out of.
    • They are small, reusable chunks of code that are responsible for one job. Usually it is to render some HTML.