reasonml-q-a icon indicating copy to clipboard operation
reasonml-q-a copied to clipboard

Why let make? How are the components named, is it always by file name?

Open zth opened this issue 4 years ago • 0 comments

Question

@michael_rispoli on Twitter asked the following question

Why let make? How are the components named, is it always by file name?

Answer

In ReasonML, every file is a module. There are also no imports, and all modules in the global scope must therefore have a globally unique name. This means that every filename must be unique, as every file is a module and part of the global scope. You therefore can't have two files called index.re even if they're in separate folders, which is a convention a lot of people use in JavaScript. We'll get back to why this matters for component naming in a second.

When you write JSX in Reason, your JSX will be transformed into actual function calls creating React components. It looks something like this (not 100% correct but illustrates the point):

<SomeComponent someProp=true /> is turned into React.createElement(SomeComponent.make, { someProp: true }, [||])

Notice SomeComponent.make? make is what's actually your React component, but since we only reference the module <SomeComponent /> in our JSX, the transform makes the assumption that it can find the function that's the actual component at SomeComponent.make.

make is just a convention. It could've been called component , render or whatever, but it ended up being make (probably because make is used throughout the ecosystem as a convention for something that creates something).

Further reading

zth avatar Feb 12 '20 19:02 zth