.jsx File — React JSX Source

JSX (JavaScript XML) is a syntax extension for JavaScript that allows writing HTML-like markup directly within JavaScript code. Created by Facebook for use with the React UI library, JSX files combine component logic and markup in a single file, enabling a declarative approach to building user interfaces. JSX expressions look like HTML but are transformed into JavaScript function calls (React.createElement or jsx runtime) during compilation by tools like Babel or SWC. JSX supports JavaScript expressions within curly braces, conditional rendering, list rendering with map(), event handling, and component composition. The format encourages a component-based architecture where each JSX file exports a reusable UI component with its own logic, state, and presentation. JSX has been widely adopted beyond React — frameworks like Preact, Solid.js, and Astro also use JSX syntax. While plain .js files can contain JSX when properly configured, the .jsx extension explicitly signals that the file contains JSX markup, helping editors, linters, and build tools apply the correct parsing and transformation rules.