Live data from Hacker News

JSX is no longer my friend

medium.com

21–30 of 144 posts

Re: JSX is no longer my friend

#21
post #16

Earlier quoted context omitted.

"If you're ever writing code like this, please reevaluate your career in software development." That's a pretty nasty comment to make about anyone in this industry over a simple for loop.

Well, it is just plain wrong. Even if you wanted to do a for loop in JSX you'd do {for (var x=0;x }} Not a templated component like that. That said, I have created repeater components and the like before, largely because JSX is so friendly that more design-minded people can use it very easily. EDIT: turns out that doesn't actually work, ha. I've never written JSX that way. {[0,1,2,3].map((i) => { }} on the other hand…

That shouldn't work since syntactically you are in a middle of a function call where you can only have expressions. This is funny because one of the author's point was that JSX makes that confusing because you would never think to write `callFunction(for (var i = 0; ...))` normally.

Re: JSX is no longer my friend

#22
post #9

This article includes a tweet which demonstrates a very contrived example of a for loop using JSX. If you're ever writing code like this, please reevaluate your career in software development. As an aside, we recently moved from Nunjucks templates to React / JSX at work and the frontend team couldn't be more pleased. Components reflect improvements made to them across the board and provide a happy medium between desi…

"If you're ever writing code like this, please reevaluate your career in software development." That's a pretty nasty comment to make about anyone in this industry over a simple for loop.

I apologize and you are correct in stating this. Less experienced developers may come across these sorts of mistakes when conflating JSX with templating languages that contain logic constructs (Handlebars et al). It is important to clarify.

To be more constructive, I believe an understanding of when to use the right tool for the right job is paramount to a good software developer. JSX nodes are suitable for representing UI components but certainly not control statements such as a for loop.

Re: JSX is no longer my friend

#24
post #16

Earlier quoted context omitted.

"If you're ever writing code like this, please reevaluate your career in software development." That's a pretty nasty comment to make about anyone in this industry over a simple for loop.

Well, it is just plain wrong. Even if you wanted to do a for loop in JSX you'd do {for (var x=0;x }} Not a templated component like that. That said, I have created repeater components and the like before, largely because JSX is so friendly that more design-minded people can use it very easily. EDIT: turns out that doesn't actually work, ha. I've never written JSX that way. {[0,1,2,3].map((i) => { }} on the other hand…

Generally speaking, I do not recommend this pattern. My preference is to handle enumeration within a function, for example:

  
    {this.listItems(items)}
  
Then, within a function implemented on the same component:

  listItems: function(items) {
      items.map((item) => {
          return {item.name}
      });
  }

Re: JSX is no longer my friend

#26
post #5

The thing that the author misses is that JSX is very natural for designers. If you properly encapsulate any logic into methods on the component rather than having it all inline in the render return, even designers with mediocre technical skills can productively work with JSX files. This can be a huge productivity win, and beyond that honestly I don't know many engineers that enjoy translating designer mock-ups.

JSX is also very natural for people who've written HTML for years. I wasn't a fan when I started, but now I love it to bits.

I fell in love at first sight. Since it was in wide use at Facebook I got my team to take a look at it. Now they love it. Once you start breaking up things into small mostly reusable components, the true power of JSX shines through. And since most files never end up being very large with well reasoned interfaces between components, it's much easier to reason about your user interfaces.

Re: JSX is no longer my friend

#27
post #12

Finally, somebody said it. I thought we abandoned that garbage when we left PHP, and now all of a sudden everybody wants to start mixing markup and code again?

1) Like it or not PHP is still one of the top 5-10 languages used today.

2) The separation of concerns argument is completely invalid. They aren't separate concerns, they are separate languages.

Re: JSX is no longer my friend

#28
After many Medium posts of uninformed, not very insightful complaints about react and the state of JavaScript I am becoming inclined to just avoid Medium posts about JavaScript in general.

Medium has become the analog to Tumblr posts for opinionated engineers to whine about things that don't really impact development in ways that matter.

Really all this developer had to do was talk about Hyperscript in a positive way and I would have found this post interesting instead of rolling my eyes paragraph after paragraph. Oh poor you and your angle brackets, such a burden! Putting HTML directly into my JavaScript is awesome and I never want to go back to separate template files ever again. It's wonderful and results in great code that works well, is readable, and is easy to test.

Re: JSX is no longer my friend

#29
Better markup DSLs have already been written, which "mingle" better in code: HAML and Jade. Unfortunately reactjs-jade never gained any momentum it seems.

Hyperscript seems like a "reasonable alternative" to JSX. I won't say "better" because you're trading for `h([ , ])` symbols that also contribute to line noise. And other common pain points like "you can't put an `if` block inside your markup" still persists.

Re: JSX is no longer my friend

#30
post #20
post #16

Earlier quoted context omitted.

Well, it is just plain wrong. Even if you wanted to do a for loop in JSX you'd do {for (var x=0;x }} Not a templated component like that. That said, I have created repeater components and the like before, largely because JSX is so friendly that more design-minded people can use it very easily. EDIT: turns out that doesn't actually work, ha. I've never written JSX that way. {[0,1,2,3].map((i) => { }} on the other hand…

You just proved the author's point. The JSX you provided is invalid, since you can't pass `for` as a function argument (see his equivalent bit about `if`).

Huh. Well, my only defense is that I would never even try to write JSX like that anyway - the actual JS in my JSX templates is basically just Array.map calls.
Post reply on HN