[ng12]

Agreed 100% about JSX. Especially since the only alternative anyone uses is opaque stringly-typed template nonsense (Angular, Vue, Ember, etc).

[enraged_camel]

I use single-page components in Vue and write templates like this:

  <template>
      <div>
          <h2>{{ title }}</2>
      </div>
  <template>

  <script>
    export default {
        data() {
            return {
                title: "Hello world"
            }
        }
    }
  </script>

Works well in my opinion. Separates the template into its own section but keeps it inside the same file.

[ng12]

In my mind this is strictly inferior to JSX, which would be:

   export default ({title}) => (
      <div>
         <h2>{title}</h2>
      </div>
   )

The only benefit to the template is if you use fancy features (#each, binding, etc) which is worse because now you have two places where the logic happens.

[mnutt]

I'm not sure ember's HTMLBars (the default, a drop-in replacement for handlebars) is any more stringly-typed than JSX.

[boubiyeah]

Humm no, JSX is just a DSL. I much, much prefer virtual DOM over String templates but I also prefer hyperscript over JSX: h('div')

[zdragnar]

JSX is a macro (it's expended to plain JS at compile time). Almost every other major framework uses DSLs (strings are evaluated and transformed into code at run time).