DEV Community

Why do people use JSX?

Wilson Tovar on November 10, 2018

Collapse
 
vonheikemen profile image
Heiker • Edited

I would say the number 1 reason is flexibility.

You see, when you use a template engine you are at the mercy of that engine. What you can do its limited by the tools that it provides you.

I know that in Vue you can "repeat" an element with the v-for directive, but what if it didn't have it? What would you do?

The JSX folks would argue that they don't need directives, because JSX "It's just javascript." You can use the full power of javascript to hide, show, repeat, transform anything in the UI.

One of the things I don't like about JSX is this:

You can actually make elements that describes a behavior. What bothers me it's not the fact that you can do it, is the fact that it's a common pattern in React apps.

Collapse
 
sleepyfran profile image
Fran González

That deserves a big: thanks, I hate it.

Collapse
 
saifadin profile image
Osamah 🚀 ⚛️

Simplicity, Composability and it makes thinking in components easier.

When you dive deeper into JSX and what happens with this syntaxic sugar is just functions, that’s why you can use JS in there.

I have built many Apps in React, AngularJS and Angular 3-5 and I can say with certainty, that it is easier and faster to set them up and write small atoms to build your app out of. The level of productivity is very high!

The biggest part of the Frontend Community uses JSX and they can’t be simply stupid.

If someone doesn’t like it, it’s fair, but it is a great pattern.

Collapse
 
moopet profile image
Ben Sinclair

"X million people can't be wrong!" is not a great argument :)

Collapse
 
skyrpex profile image

I use Jsx in Vue. The reasons are typehinting and code autocompleton. In template files, you can easily type de wrong variable name and not notice. this won't happen with typescript and Jsx together.

Collapse
 
patarapolw profile image
Pacharapol Withayasakpunt

I might try some day, as I also use TypeScript via Vue CLI.

But in reality, I don't really what to drop templating with Pug. I think there is lit-pug or something, but it isn't well developed.

It can get complex, indeed. i.imgur.com/benrTUc.png

Collapse
 
krthr profile image
Wilson Tovar

I tried React, but I think JSX extends the possibilities for tangled code. What advantages does it have over, for example, Vue?

Collapse
 
rhymes profile image
rhymes

A bigger community I guess and probably better support for mobile through React Native but in practice if you dislike it you're better off using Vue, it's a good choice for most use cases.

I don't like JSX either but I read they're working on getting more support for code organization in React's components through hooks:

This is a fair comparison of Vue and React: vuejs.org/v2/guide/comparison.html...

Collapse
 
caseycole589 profile image
Casey Cole

I don't like it personally. I prefer template literal style like hyperhtml and lithtml. But after saying that it's still better than nothing and it's simple which is a big plus in my book.

Collapse
 
katylava profile image
katy lavallee

I like it because it's easy for me to read it quickly and understand -- even the first time I saw it. I find it very readable.

Collapse
 
josegonz321 profile image
Jose Gonzalez

It’s declarative instead of imperative.