DEV Community

loading...

Discussion on: Stop Using React

Collapse
ishman profile image
ishman

I think you have forgotten another of the main points why react should not be the first option. I'm talking about one of the ugliest and most aberrant things that have been done related to the web lately. Of course I'm talking about JSX

Collapse
markohologram profile image
Marko A

To each their own, I really like JSX. Prefer it way more than HTML templating for sure.

Collapse
ishman profile image
ishman

Comparing the ugly spaghetti code that forces you to produce JSX with the clean, comfortable and easy template engine of frameworks like Angular, Vue or Svelte??. Analyzing one of the most basic examples:

// React ul loop syntax
const names = [‘John’, ‘Sarah’, ‘Kevin’, ‘Alice’];
const displayNewHires = (
  <ul>
    {names.map(name => <li>{name}</li> )}
  </ul>
);
ReactDOM.render(
  displayNewHires,
  document.getElementById(‘root’)
);
// Same Vue Syntax
<ul>
  <li v-for=’name in listOfNames’>
    {{name}}
  </li>
</ul>

I'm really trying to understand your position my friend, but I just can't ...

Thread Thread
markohologram profile image
Marko A

As I've said, to each their own. I might have been burned by AngularJS that I don't really like HTML template strings or whatever. JSX feels really good to me and tooling for it is phenomenal since it's "mostly JavaScript". Although I do admit it can get a bit complicated at times if you have lot of conditional rendering or stuff like that.

One small flaw with this example is that you show React component rendering, but for Vue you just show the syntax for that component so these examples cannot really be compared. If this example didn't have ReactDOM.render call, it would then be apples to apples comparison in this case.

Thread Thread
joshuaamaju profile image
Joshua

You can't decouple view from the logic in react, no matter how hard you try, so it's a perfect example

Thread Thread
nrutledge profile image
nrutledge

Completely contrived example. You are comparing apples to oranges by including extraneous stuff in the React section. Once you strip that away, you are left with just a few lines of what is essentially HTML + JS.

One can certainly argue that the mixing of HTML and JS in JSX is strange/unconventional. But I'd rather think in terms of JS logic that can spit out HTML than deal with some random template syntax. To each their own.

Thread Thread
ishman profile image
ishman

I have never said that it is not useful or powerful. I just think it's pretty ugly at the code level. In any case, HTML came before Javascript and although a tag language may not be very attractive for modern programmers, for a reason of hierarchy and how the web works, I see more sense to put JS in HTML than the opposite

Thread Thread
Collapse
sebbdk profile image
Collapse
adarshhegde profile image
Adarsh Hegde

Garbage In, Garbage Out. Don't blame the tool.

Collapse
asadsaleh profile image
AsadSaleh

As a contrast, I really love JSX. I love how we use javascript's 'map' to render list. I don't know, maybe it's just me.

Collapse
phil_lgr profile image
Phil Léger

One thing I know... I don't want to maintain the templates that you wrote,

but you will find my typed JSX easy to maintain yourself

Collapse
patarapolw profile image
Pacharapol Withayasakpunt

Although I don't really like JSX in the past, I have changed my mind.

JSX is the best way for your template engine to be smart with IDE, being a mere JavaScript function, that is.

Spaghetti or not is something you have to learn to manage your code.

Collapse
pozda profile image
Ivan Pozderac

I found out that spaghetti code comes from either devs who are trying to learn/understand something new or from seasoned spaghetti dev who doesn't bother to stick to good practices and is often lazy to read the documentation/guides before actually using something.

That also determines if someone would like to work with you or not if you are that second kind of dev.

Thread Thread
lionelrowe profile image
lionel-rowe

Mmm seasoned spaghetti dev, my favorite 🤤🍝

Some comments have been hidden by the post's author - find out more