Learn
Advanced JSX
Curly Braces in JSX
The code in the last exercise didn’t behave as one might expect. Instead of adding 2 and 3, it printed out “2 + 3” as a string of text. Why?
This happened because 2 + 3 is located in between <h1> and </h1> tags.
Any code in between the tags of a JSX element will be read as JSX, not as regular JavaScript! JSX doesn’t add numbers - it reads them as text, just like HTML.
You need a way to write code that says, “Even though I am located in between JSX tags, treat me like ordinary JavaScript and not like JSX.”
You can do this by wrapping your code in curly braces.
Instructions
1.
Add a pair of curly braces to the code from last exercise, so that your JSX expression looks like this:
Everything inside of the curly braces will be treated as regular JavaScript.