The Melange Playground
A Powerful Browser Experience for Melange and Reason React
We're thrilled to announce the Melange playground, a new tool that is bound to become an essential part of your Melange journey. It’s available at melange.re/unstable/playground.
The Melange playground is an interactive, in-browser experience that showcases Melange compilation to JavaScript. The playground is designed to compile OCaml and ReasonML to JavaScript in real time. Additionally, it includes a React.js pane that renders reason-react components.
Seamless Compilation in Your Browser
In the Melange playground, you can write OCaml and ReasonML code directly in the browser. It displays and evaluates the resulting JavaScript in the “Console” pane, as you type. Syntax and other errors are displayed in the “Problems” pane.
JavaScript output is shown instantly, significantly enhancing the learning experience and debugging process.
Snippets you write in the playground can be shared with your team – click the “Share” button to copy a shareable URL.
Live Visualization of React.js Components
We tailored the Melange playground to work smoothly with reason-react. You can visualize your React components in the dedicated “Live” side pane. As you modify your ReasonML, you can instantly see how those changes appear on the page. And you guessed it: the results are also shareable.
Future work
We understand the need for a tool that showcases Melange’s features in real-time, in a browser environment. The Melange playground offers all of this, packaged in a simple, clean interface that requires no setup.
Stay tuned for future updates designed to improve your experience with the Melange playground. Next, we’re planning on adding diagnostic information to the editor, such as showing the types of expressions on hover.
As always, we value your feedback, so please don't hesitate to share your thoughts, questions, or suggestions.
Dive into the Melange playground today at melange.re/unstable/playground.
Happy hacking!
Huge thanks to Javi and Dave for their hard work shaping up the playground to be easy to use and ready for consumption.