CODEWITHSUNDEEP
javascriptreactjsjsx
8protons
8protons

Reputation: 3959

Are these Microsoft docs wrong for having JSX in a JS file?

In the following Microsoft doc (as well as many others), they'll have a file explicitly called App.js but then have code like:

    return (
    <>
        <h5 className="card-title">Welcome {name}</h5>
        {accessToken ? 
            <p>Access Token Acquired!</p>
            :
            <Button variant="secondary" onClick={RequestAccessToken}>Request Access Token</Button>
        }
    </>
);

Isn't this JSX? I've noticed this being done a lot and it's starting to confuse me as to how JS and JSX differ.

Upvotes: 0

Views: 29

Answers (1)

user16165663
user16165663

Reputation:

There is a good discussion about JSX vs JS in the AirBNB repo here: https://github.com/airbnb/javascript/pull/985

Essentially, in bigger React projects especially, differentiating a .jsx file versus a .js file can come down to identifying what is used as a React component versus what is perhaps just plain Javascript logic. When it comes down to reading a .jsx and .js file, you don't need to worry about whether the extension is .jsx or .js - it will run fine as it does.

So yes technically the extension should be .jsx, but ultimately it does not matter.

Upvotes: 1

Related Questions