From 4e4ba15bab338ff55d90f3fa50759b5ddbca6342 Mon Sep 17 00:00:00 2001 From: Dan Abramov Date: Tue, 22 Sep 2020 16:29:56 +0100 Subject: [PATCH] Clarify --- .../2020-09-22-introducing-the-new-jsx-transform.md | 10 +++++++--- 1 file changed, 7 insertions(+), 3 deletions(-) diff --git a/content/blog/2020-09-22-introducing-the-new-jsx-transform.md b/content/blog/2020-09-22-introducing-the-new-jsx-transform.md index ff634a19..8fd7469b 100644 --- a/content/blog/2020-09-22-introducing-the-new-jsx-transform.md +++ b/content/blog/2020-09-22-introducing-the-new-jsx-transform.md @@ -28,17 +28,17 @@ Now let's take a closer look at the differences between the old and the new tran When you use JSX, the compiler transforms it into React function calls that the browser can understand. **The old JSX transform** turned JSX into `React.createElement(...)` calls. -For example, +For example, let's say your source code looks like this: ```js import React from 'react'; function App() { - return

Hello World

; + return

Hello World

; } ``` -gets transformed to +Under the hood, the old JSX transform turns it into regular JavaScript: ```js import React from 'react'; @@ -48,6 +48,10 @@ function App() { } ``` +>Note +> +>**Your source code doesn't need to change in any way.** We're describing how the JSX transform turns your JSX source code into the JavaScript code a browser can understand. + However, this is not perfect: * Because JSX compiled into `React.createElement`, `React` needed to be in scope if you use JSX.