Chapter 2. JSX in Depth

In the first chapter, we built our first component using React. We saw how using JSX makes the development easy. In this chapter, we will dive deep into JSX.

JavaScript XML (JSX) is an XML syntax that constructs the markup in React components. React works without JSX, but using JSX makes it easy to read and write the React components as well as structure them just like any other HTML element.

In this chapter, we will cover following points:

  • Why JSX?
  • Transforming JSX into JavaScript
  • Specifying HTML tags and React components
  • Multiple components
  • Different types of JSX tags
  • Using JavaScript expressions inside JSX
  • Namespaced components
  • Spread attributes
  • CSS styles and JSX
  • JSX Gotchas

At the end of the chapter, we will get familiar with ...

Get ReactJS by Example - Building Modern Web Applications with React now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.