React is a JavaScript library for building user interfaces that uses a component-based approach. It uses a virtual DOM that synchronizes the real DOM efficiently. Components declare their inputs through properties and local state, and outputs through events. This document compares React to other frameworks and covers core concepts like JSX, rendering, component lifecycle, and unidirectional data flow.

2. A JAVASCRIPT LIBRARY FOR BUILDING
USER INTERFACES

3. REACT IS EASIER THAN JQUERY

4. WHAT MAKES REACT DIFFERENT?

5. MVC

6. MV*

7. BACKBONE ANGULAR EMBER
KNOCKOUT

8. TWO WAY DATA BINDING
CONTROLLER
OR
ROUTER
MODEL VIEW

9. TWO WAY DATA BINDING
CONTROLLER
OR
ROUTER
MODEL VIEW
MODEL
MODEL
VIEW
VIEW

10. SHARED MUTABLE STATE

11. We should do our utmost to shorten the
conceptual gap between the static
program and the dynamic process, to
make the correspondence between the
program and the process as trivial as
possible.
- Edsger W. Dijkstra

12. TRADITIONAL DATA FLOW

13. REACT DATA FLOW
DATA VIEW VIEW
VIEW
VIEW

14. API

15. RENDER

16. CREATING COMPONENTS

17. JSX RUNTIME

18. NESTING COMPONENTS

19. PROPERTIES

20. STATE

21. COMPONENT LIFECYCLE

22. VIRTUAL DOM

23. EVENTS

24. EXAMPLES