Skip to main content

React ↔ Minimalist Lib to build App UI via Declarative Component Based Architecture

aka Reactjs

React Concepts​

Definitions on React Concepts, Paradigms & Comparisons to other frameworks

React API​

core lib to expose react functionality

React Stack​

Broader React Ecosystem, third party libraries & frameworks

React Snippets​

useful React custom hooks/patterns

React Versions​

breaking change, major features

References​

  1. Diffing ↔ React HeuristicAlgorithm to reconcile change in state vs view & handle update to DOM

  2. React Element ↔ immutable stateless building blocks of React apps, returned by components

  3. CC ↔ React class Instance extends React.Component, provides render() Method to return UI, manage state & perform side effects on Lifecycle Methods

  4. ReactComponentElement ↔ Type for React CC or FC

  5. ReactDOM ↔ Renderer for React, to handle DOM updates

  6. React.Fragment ↔ empty React placeholder container w/o "physical" Element add to final HTML

  7. Memo() ↔ React function from useMemo() API for Memoization of any function !snippet for addition

<code>import</code>  {memo} 
const add = (a, b) => a + b;
const memAdd = memo(add)

  1. React DevTools ↔ Browser Extension to inspect React App (dev build only!) to view Component Hierarchy, props & state

  2. react-router-dom ↔ React Lib for Routing Primitives to Client Routing & Server Side Render in Declarative Composable way

  3. High Compat ↔ React is Backend-agnostic, readily plugs into other Lib/Frameworks

  4. Declarative ↔ You tell React HOW you want the final web page to LOOK & let VDOM Abstracts & handle DOM manipulation more efficiently

  5. Back-end agnostic ↔ React integrates with any Backend framework/language ie Java, Ruby, Go, Python

  6. Minimalist ↔ React focus to UI Primitives , defer other design concerns to React Ecosystem

  7. react-redux ↔ sub-library with React Binding for redux

  8. CRA ↔ CRAp Scaffolding Dev tool to gen new React project with app skeleton & Boilerplate

  9. Hooks API ↔ React API to make React more Functional

  10. Escape Hatch ↔ (mech) to express logic outside React model - to direct manipulate DOM

  11. <div id="root"></div> ↔ root container to render React App into

  12. Unidirectional binding ↔ React restricts data flow to one-way down Component Hierarchy. optional Escape Hatches exist