Why should you care?

Static text is rare in real apps. You need to show user names, prices, and counts — expressions do that.

See it live — copy this example

Paste into src/App.jsx (or the file noted in the steps). Save and watch the browser update.

function PriceTag() {
  const price = 499;
  const qty = 2;
  return (
    <p>
      Total: ₹{price * qty} ({qty} items)
    </p>
  );
}

Run Example »

Edit the code and click Run to see the result update live.

What happened?

• Anything inside { } is JavaScript.
• price * qty runs before React draws the paragraph.
• You can call functions too: {formatDate(date)}.

Try it yourself

1. Add a const name in your component and show it in

   {name}

   .
2. Try {2 + 2} and {10 > 5 ? "yes" : "no"}.
3. Break it: remove a brace and read the error message.
4. Change text or labels in the example and save — watch the browser update.
5. Break the code on purpose (remove a bracket), read the error message, then fix it.

Remember

Use { } for dynamic values in JSX. Variables, math, and function calls work inside braces. Keep expressions short for readability.