[idoubtit]

> That's precisely my issue with React though - JSX is a DSL

React does not require JSX, so it's a bit strange to raise the same issue with JSX as with the DSLs of Vue, etc.

If one wants to avoid JSX, it's always possible to write pure JS:

    return (<h1 className="sc">Hello {title}</h1>);

    return React.createElement('h1', {className: "sc"}, `Hello ${title}`);

[hbrn]

Guess what? Vue can also be used with render functions (or even JSX) instead of templates.

But JSX is a standard way to work with React. And Vue templates are a standard way to work with Vue.

[j45]

Is the point of the frameworks not to write less JavaScript?

[savy91]

You are still writing JSX in a string, aren't you?

[mostlylurks]

No, you're not. There is no JSX of any sort in the example the parent commentor provided, nor in the approach that they present, even outside of that specific example.

The first parameter is the component, which is string containing the HTML tag name for built-in components which are basically just HTML elements, such as div, span, img, h1, etc, but the actual component (a function or a class) for any other type of component. The second parameter is the props. The third parameter is the children, which happens to be a string in this case because the content of the h1 in the example is pure text, but if you'd want anything more complicated as children, you couldn't put in a string and pass that, you'd provide it more React.createElement -provided values.

[henryfjordan]

React at it's core is a function (or set of functions) that interpret strings like "h1" into DOM elements in a browser.

JSX is a shorthand for writing those function calls. <h1> becomes React.createElement("h1"). Sure you are still largely using HTML element names, but that's only because people don't really use JSX for anything else. The whole point is that it's easier to write JSX than the underlying function calls.

You can use JSX to target things other than DOM by supplying your own function instead of React.createElement(). Here's an example of an express web-server using JSX: https://betterprogramming.pub/how-to-create-a-web-server-wit...