JSX

Q: How deeply does React Hooks in Action: With Suspense and Concurrent Mode cover JSX?

Defines JSX and its preprocessing, then explicitly defers further exploration.

As explained in React Hooks in Action: With Suspense and Concurrent Mode

JSX is a JavaScript syntax extension for describing user-interface elements with an HTML-like notation.

JSX is an HTML-like syntax for describing user-interface elements inside JavaScript. It supports React’s reusable, composable component model while keeping UI structure close to related code. section 1.1 section 1.1.1

Quiz interface

A quiz can reuse TextToggle for both question and answer content: <TextToggle title="Question" text="Who created JavaScript?" show={true} /> and <TextToggle title="Answer" text="Brendan Eich" show={false} />. JSX is preprocessed into JavaScript before the app runs, commonly with Babel. section 1.1.1

<TextToggle title="Question" text="Who created JavaScript?" show={true} />

<TextToggle title="Answer" text="Brendan Eich" show={false} />

Inspect the compact JSX listing showing component reuse, props, text values, and Boolean display state. section 1.1.1

How React Hooks in Action: With Suspense and Concurrent Mode covers it

Cover of React Hooks in Action: With Suspense and Concurrent Mode

liveBook manning.com

Read React Hooks in Action: With Suspense and Concurrent Mode on liveBook Get the book at manning.com

Also explained in

liveBook manning.com

React Quickly, Second EditionJSX is a JavaScript syntax extension that expresses React elements with HTML-like notation and is compiled into JavaScript.
liveBook manning.com

Essential TypeScript 5, Third EditionA JSX class is a class whose implementation contains JSX elements that are transformed into standard JavaScript.
liveBook manning.com

Building User-Friendly DSLsA JavaScript syntax extension that permits XML-like markup to be embedded in JavaScript expressions.
liveBook manning.com

Build a Frontend Web Framework (From Scratch)A JavaScript syntax extension that allows markup-like expressions to be written in JavaScript code.
liveBook manning.com

D3.js in Action, Third EditionJSX is a JavaScript syntax extension for expressing user-interface markup within JavaScript code.

Compare how 6 books explain JSX →

Related concepts

JavaScriptkind of · JavaScript is a high-level, dynamically typed, multi-paradigm programming language standardized as ECMAScript and used for web and general-purpose programming.
Reactused by · React is an open-source JavaScript library for building user interfaces from declarative, reusable components.
Babelused by · Babel is a JavaScript compiler and transformation tool that converts modern JavaScript syntax and related extensions into code compatible with specified environments.
HTMLproduces · HTML (HyperText Markup Language) is the standard markup language for structuring content and elements in web documents.
childuses · A child is an entity or content directly contained within, nested in, or subordinate to a parent in a hierarchical or compositional structure.

This explainer was generated by Manning's knowledge graph from the text of React Hooks in Action: With Suspense and Concurrent Mode. The section links point to the parts of the book it draws on.