React and JSX
What is JSX and how to use it
|Cesare Ferrari||Sep 12, 2019|
JSX is the language used in React. It's similar to
XML, which is a superset of
We write our React components in
JSX but the browser doesn't understand
JSX natively, so we need to have a way to translate
When we translate one language into another one, we say that we transpile, the language.
A transpiler is a program that takes code in one language and translates it into another language. The transpiler that is used often with React is Babel.
You can find detailed information about Babel at its home page.
So, to quickly summarize what we have learned so far:
we write our React components in a HTML-like language called JSX
In order to write
JSX we need support for it into our files, that's why we import React at the top of all our component files.
Without this import, the browser would have trouble understanding the
The way we import React is to add this import statement at the top of each component file:
import React from 'react';
This works, as long as we install the necessary Node modules to work with React.
One way to work with React and create and manage React application is through
Tomorrow we will learn more about
create-react-app and how to use it to
jumpstart a React application.