https://reasonml.github.io/reason-react/

Reason bindings for ReactJS
https://reasonml.github.io/reason-react/

melange react reasonml

Last synced: 3 days ago
JSON representation

Reason bindings for ReactJS

• Host: GitHub
• URL: https://reasonml.github.io/reason-react/
• Owner: reasonml
• License: mit
• Created: 2017-03-26T06:25:03.000Z (over 7 years ago)
• Default Branch: main
• Last Pushed: 2024-04-25T23:58:30.000Z (2 months ago)
• Last Synced: 2024-05-02T05:55:40.019Z (about 2 months ago)
• Topics: melange, react, reasonml
• Language: Reason
• Homepage: https://reasonml.github.io/reason-react/
• Size: 44.1 MB
• Stars: 3,228
• Watchers: 64
• Forks: 347
• Open Issues: 38
• Metadata Files:
  • Readme: README.md
  • Changelog: CHANGES.md
  • Contributing: CONTRIBUTING.md
  • License: LICENSE

Lists

• awesome-react - ReasonReact
• awesome-react - ReasonReact
• drafbit-re-font-awesome-reproduction - here
• awesome-react-enaqx - ReasonReact
• awesome-react-cn - ReasonReact
• awesome-react - ReasonReact
• awesome-react - ReasonReact

README

        
> **Warning**

> For **ReScript** users, we recommend using [@rescript/react](https://github.com/rescript-lang/rescript-react) instead. Before, ReasonReact was designed to be used with BuckleScript and it got packaged into @rescript/react. More context on the move [here](https://rescript-lang.org/blog/bucklescript-is-rebranding).

# [ReasonReact](https://reasonml.github.io/reason-react/)

[![PRs Welcome](https://img.shields.io/badge/PRs-welcome-brightgreen.svg?style=flat-square)](http://makeapullrequest.com)

![contributors](https://img.shields.io/github/contributors/reasonml/reason-react)

[![discord](https://img.shields.io/discord/235176658175262720.svg?logo=discord&colorb=blue)](https://discord.gg/reasonml)

[![twitter](https://img.shields.io/twitter/follow/reasonml?style=social)](https://twitter.com/reasonml)

ReasonReact is a safer, simpler way to build React components. You get a great type system with an even better developer experience. Why choose ReasonReact? Read more [here](https://reasonml.github.io/reason-react/docs/en/what-and-why)

ReasonReact is just React.js under the hood. This makes it super easy to integrate with your current Next.js, Create React App, JavaScript, Flowtype or TypeScript project. Learn more about getting started [here](https://reasonml.github.io/reason-react/docs/en/installation#adding-reason-to-an-existing-reactjs-project-create-react-app-nextjs-etc)

> Watch Ricky Vetter's Reason Conf talk, ["Why React is Just Better in Reason"](https://www.youtube.com/watch?v=i9Kr9wuz24g) to learn more about how Facebook & Messenger are using ReasonReact

> Watch Jordan Walke's Reason Conf talk, ["React to the Future"](https://www.youtube.com/watch?v=5fG_lyNuEAw) to learn more about the future of ReasonML and React

## Example

```reason

/* Greeting.re */

[@react.component]

let make = (~name) => 
 {React.string("Hello " ++ name)} 

```


See all of our examples [here](https://reasonml.github.io/reason-react/docs/en/simple). For a full application, check out [reason-react-hacker-news](https://github.com/reasonml-community/reason-react-hacker-news).

## Using Your Favorite Javascript Libraries

The same way that TypeScript has `type annotations`, we have `bindings`. Bindings are libraries that allow you to import a popular project (like lodash) or to import your own local file. ReasonReact is in fact an example of a binding!

## Documentation

See [https://reasonml.github.io/reason-react](https://reasonml.github.io/reason-react)

## Contribute

We welcome all contributors! Anything from docs to issues to pull requests. Please help us :smile:

[./CONTRIBUTING.md](./CONTRIBUTING.md)

## Editor Support

Looking for syntax highlighting for your favorite editor? Check out [ReasonML Editor Plugins](https://reasonml.github.io/docs/en/editor-plugins)