JSX like syntax

[redexp]

Proposal

You know that jsx format made revolution in js world. Now jsx is must have in any js parser by default. Here good video about how jsx help think differently https://www.youtube.com/watch?v=Y12sGu8-qFE

Just a reminder that jsx is just a sugar for function call

x = <tag prop="value"><child/></tag>

is equal to

x = someFunc("tag", {prop: "value"}, someFunc("child", null))

name of someFunc and from where it's imported usually configurable

another example with components

User = function (props) {
  return <div>{props.name}</div>
}

x = <User name="Bob"/>

User = function (props) {
  return someFunc("div", null, props.name)
}

x = someFunc(User, {name: "Bob"})

I think this syntax can be easily transformed to go

I think jsx in go+ can be really good boost to use it for many users

Background

I just started using go and I found out that there no component based template engine for web frameworks.

I'v created one by my self https://github.com/redexp/express-engine-jsx

For example jsx template file could look like this

import Layout from "../layouts/Main"
import Header from "../components/Header"
import UserForm from "../components/UserForm"

<Layout>
  <Header title={`User ${user.name}`}/>
  <UserForm user={user}/>
</Layout>

which will first transform with help of one plugin to

import Layout from "../layouts/Main"
import Header from "../components/Header"
import UserForm from "../components/UserForm"

export default function ({user}) {
  return (
    <Layout>
      <Header title={`User ${user.name}`}/>
      <UserForm user={user}/>
    </Layout>
  )
}

and then to native js code

Workarounds

I found many packages that trying to mimic jsx https://pkg.go.dev/search?q=jsx

[redexp]

also there well known js framework Astro written on go has their own file format .astro which looks almost like I showed in example above and open source parser https://github.com/withastro/compiler