This is an old revision of the document!

Frontend Development

React

React is typically compiled to turn the JSX components into function calls
- It is possible to use React without compiling by calling the functions directly
  - https://react.dev/reference/react/createElement#creating-an-element-without-jsx
Webpack bundles files together to speed up page load times
- Also lets you import CSS (or images or whatever) in the same way you would import JS
  - https://webpack.js.org/loaders/css-loader/
- Webpack is typically used in conjunction with compiling React
- HTTP/2.0 doesn't replace bundling
  - https://blog.khanacademy.org/forgo-js-packaging-not-so-fast/
BEM is a systematic way of naming CSS classes
- https://en.bem.info/methodology/quick-start/
- Done automagically by Webpack (and consequently by React, when compiled)
CSS uses specificity to decide between multiple styles that have been applied to an element
- https://css-tricks.com/specifics-on-css-specificity/
CSS uses ORDER OF DEFINITION (precedence) to decide between multiple styles WITH EXACTLY THE SAME SPECIFICITY
- https://css-tricks.com/precedence-css-order-css-matters/