react.nim icon indicating copy to clipboard operation
react.nim copied to clipboard

support for JSX?

Open timotheecour opened this issue 6 years ago • 5 comments

eg:

class Greeting extends React.Component {
  render() {
    return (
        <div className="shopping-list">
          <h1>Shopping List for {this.props.name}</h1>
        </div>
     );
  }
}
proc makeGreeting(): ReactComponent =
  defineComponent:
    proc renderComponent(s: Greeting): auto =
        return """<div className="shopping-list">
          <h1>Shopping List for {this.props.name}</h1>
        </div>""".jsx

this would make it easier to transition back and forth bw react.js and react.nim

timotheecour avatar Apr 20 '18 22:04 timotheecour

I don't know, I actually prefer the explicit internal dsl, rather than having to put everything into opaque strings.

But if you do have a macro that would make your stringy DSL work, I would be glad to accept a PR.

andreaferretti avatar May 18 '18 17:05 andreaferretti

I kind of prefer the DSL as well, although I think it could be improved if it looked more like (or was even compatible with) the Jade/Emerald DSL since there are a number of developers who are already familiar with it and the Jade documentation is really good.

captainbland avatar May 26 '18 14:05 captainbland

I doubt I would ever be able to make it compatible with Jade: Jade is an external DSL, while this DSL is internal to Nim. This has the advantage that one can use all the Nim features inside it, but it has the limitation that it must be valid Nim.

I have nothing against experimenting, though, even if I do not have much time to work on React.nim today. If you have some improvements to the macro that allow a better DSL, please file a PR!

andreaferretti avatar May 28 '18 08:05 andreaferretti

No worries, just leaving my thoughts! I might play around with smooshing it together with the Emerald library (also a Nim DSL that is supposed to be very Jade-like) although I'm with you on the time front. I'm just taking interest because I think this is a really cool project. :)

captainbland avatar May 28 '18 13:05 captainbland

What about a transpiler that converts JSX code to macro calls?

jfilby avatar Jul 08 '22 13:07 jfilby