Skip to main content

React summary (https://react.dev/)

Summary​

What is React?​

A JavaScript library for creating user interfaces. A user interface is made up of components that can be seen as Lego bricks. (Button, text, image, etc...)

Mosaic​

Component creation​

  • function Example() /!\ Components must start with a capital letter to be valid. /!\ Don't forget the parentheses after return otherwise the following lines will be ignored. /!\ Never create a component within a component, Separation avoids a slowdown and possible bugs.

Export​

  • export default: exports the main function (component). /!\ Only one default export per file.

  • export (named): exports other secondary functions /!\ Multiple named exports per file.

Import​

Best practice: an import with its extension comes close to the operation of native ecmaScript modules.

[[img table export default/name2]]

JSX rules​

  1. A single block (the whole in a div or using Fragment)
  2. HTML-like attributes must be in camelCase (class => className)

HtML+SVG converter => JSX: https://transform.tools/html-to-jsx