• Stars
    star
    106
  • Rank 325,871 (Top 7 %)
  • Language
    OCaml
  • Created almost 8 years ago
  • Updated over 6 years ago

Reviews

There are no reviews yet. Be the first to send feedback to the community and the maintainers!

Repository Details

The crappy js-to-reason converter anyone can contribute to!

Jeason

Jeason stands for "JavaScript Reason" or "Janky Reason". It takes your JavaScript and converts it into really bad Reason code.

This isn't meant to be a transpiler. It's a codemod that gets 80% of the way there. The converted Reason file will throw you type errors and what not. You learn Reason while converting real JS files over and fixing the type errors. Two birds one stone!

Because if this relaxation of constraints, everyone can contribute their favorite translation of JS idioms to Reason! For example, we support converting React.js components over to the working Reason bindings. The actual bindings will be released soon. Join us on Discord!

How to Use It

Warning: might not be working right now. Please see the contributing section to use this

yarn add global https://github.com/chenglou/jeason.git
jeason myFileName.js

This will read myFileName.js and spit out the converted Reason code in the terminal =).

What Is This Black Magic?

If you're not familiar with the Reason toolchain, here's how this repo works under the hood: it forked Flow in order to use its JavaScript parser, takes the parsed abstract syntax tree and uses Reason's pretty-printer to print out the code.

Contributing

  • Clone this repo
  • Make sure you're on OPAM switch 4.02.3 (might work with other switches; haven't tried)
    • You need reason (refmt) and ocamllex installed through OPAM (latter comes by default)
  • yarn && yarn build
  • yarn test

This repo is actually a fork of Flow's src/parser/ directory, pulled out. The only files that we added are:

  • main.re (core logic)
  • jeason.sh (convenience script)
  • test.re
  • getReasonAst.re (for development iteration)
  • bsconfig.json (for the build)

We tweaked:

  • package.json
  • .gitignore

We also removed:

  • flow_parser_dot_js.ml
  • flow_parser_js.ml
  • merlin (autogenerated now)

Just because.

main.re is a big file (don't be misled by its size! It's mostly pattern matching on all the possible JS AST nodes).

Say you want to convert a variable declaration, e.g. var a = 1, to a Reason let binding, e.g. let a = 1.

Note that the first snippet is JS code and the second one is Reason. I wish I could find more distinct examples between the two languages, but unfortunately Reason's syntax is just too good and familiar. Heck, when your boss comes over and asks "Woah there what's this new language you're writing in?" you can just go "oh that's ES2030 syntax with proper pattern matching and function currying, we're using a Babel transform".

Back on topic, you'd first enter the a JS code example var a = 1 into ASTExplorer, switch to the flow parser and check the JS AST on the right. These are the tokens present in main.re. Find that case and use OCaml/Reason's built-in Reason nodes construction mechanisms to output the right Reason AST node.

How to find the "right Reason AST node"? You can paste let a = 1; into ./getReasonAst.re and run yarn getReasonAst to print the AST.

Try your transform by pasting the the JS code snippet into ./test.js, then run yarn test.

Send some PRs! It's a crappy converter; as long as your heuristics output nice Reason code, we can accept it =).

More Repositories

1

react-motion

A spring that solves your animation problems.
JavaScript
21,680
star
2

react-tween-state

React animation.
JavaScript
1,742
star
3

react-treeview

Easy, light, flexible tree view made with React.
JavaScript
1,086
star
4

react-radio-group

Better radio buttons.
JavaScript
442
star
5

node-huxley

Codeless front-end testing.
JavaScript
365
star
6

react-state-stream

React animation on steroid.
JavaScript
361
star
7

chenglou.github.io

HTML
338
star
8

RCSS

Turn your JavaScript objects into CSS classes.
JavaScript
286
star
9

intro-to-reason-compilation

Ready up!
Shell
269
star
10

react-spinner

Zero configuration loading spinner.
JavaScript
186
star
11

tween-functions

Robert Penner's easing functions, slightly modified
JavaScript
182
star
12

data-structures

Fast, light and hassle-free JavaScript data structures, written in CoffeeScript.
JavaScript
147
star
13

pure-css-shaders-art

At the intersection of art and bad performance
HTML
121
star
14

cards

Prototyping the UI of 2030
OCaml
109
star
15

react-chosen

React wrapper for Chosen jQuery.
HTML
96
star
16

react-dash

React documentation source for [Dash](http://kapeli.com/dash)
JavaScript
90
star
17

require-polyfill

Make `require` work in browsers, at runtime. No code bundling needed!
JavaScript
42
star
18

reason-project-ideas

40
star
19

png-diff

Small PNG diff utility, written in pure JS for Node.
JavaScript
40
star
20

react-lights-out

Simple demo of the React framework's power and flexibility.
JavaScript
27
star
21

upgrade-reason-react

OCaml
27
star
22

png-crop

Small PNG cropping utility, written in pure JS for Node.
JavaScript
23
star
23

grunt-huxley

Grunt task for node-huxley.
JavaScript
21
star
24

jon-blow-video-outlines

Outlines for Jon Blow's YouTube videos on games, programming and more.
20
star
25

multitouch-line-art

JavaScript
17
star
26

code-snippets

Code Snippets, algorithms, etc.
CoffeeScript
13
star
27

flexbox-see

Flexbox visualizer.
JavaScript
10
star
28

react-placeholder-shim

Form placeholder for input and textarea in ie8 and 9.
JavaScript
9
star
29

huxley-example

Demo from node-huxley's README
7
star
30

shaderjoy

TypeScript
6
star
31

phone-parser

Parse the phone input into an output format of your choice. Good for formatting a user input.
JavaScript
6
star
32

flappy-2048-side-by-side

An experiment in time wasting.
CSS
5
star
33

sublime-config

My configurations for Sublime Text.
JavaScript
4
star
34

the-game

yada yada
JavaScript
3
star
35

valid-css-props

Check for the validity of a CSS property name.
JavaScript
3
star
36

flip-it.safariextension

Flipboard Safari extension for adding a stuff on the web to your personal magazine.
CoffeeScript
3
star
37

l-system

Fun experiment in pattern generation, with a visualizer.
JavaScript
3
star
38

ocaml-bench

OCaml
3
star
39

bootstrap-everywhere.safariextension

Safari extension for turning websites more Californian
JavaScript
2
star
40

elastic

Something something OCaml
OCaml
2
star
41

mememe

OCaml
1
star
42

super-spy

JavaScript
1
star
43

reasonable

JavaScript
1
star
44

chalk-time

JavaScript
1
star