JSX

Summary

A syntax extension that lets you write HTML-like markup directly inside JavaScript, which React compiles into `React.createElement` calls under the hood.

How to Learn This

1Write a few JSX expressions and inspect what they compile to (Babel REPL).
2Learn JSX's rules: one root element, `className` not `class`, `{}` for JS expressions.
3Practice conditional rendering with `&&` and ternaries inside JSX.

Convert JS projects into TypeScript

Components

More topics in React

Components Props State Lifecycle Hooks Context API React Router Forms Controlled Components Refs Memoization Error Boundaries Lazy Loading Suspense Portals Custom Hooks Render Props HOC React Patterns

Stuck on this topic? Ask an Insider

Get 1:1 guidance from people who've walked this exact path — free on the InsideEdge app.

Download