Skip to content
Please note that GitHub no longer supports Internet Explorer.

We recommend upgrading to the latest Microsoft Edge, Google Chrome, or Firefox.

Learn more
A demo project that shows a fullstack ReasonML/OCaml app–native binary + webapp
Reason JavaScript HTML C++
Branch: master
Clone or download
Cannot retrieve the latest commit at this time.
Cannot retrieve the latest commit at this time.
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
backend Use es6 modules Jan 11, 2020
esy.lock Upgrade deps to latest Jan 25, 2020
frontend Implement caching and cache busting with Webpack Jan 11, 2020
shared Implement caching and cache busting with Webpack Jan 11, 2020
.gitignore Implement caching and cache busting with Webpack Jan 11, 2020
MIT-LICENSE Initial commit Jan 8, 2020
README.md
bsconfig.json
dune-project Initial commit Jan 8, 2020
esy.json Upgrade deps to latest Jan 25, 2020
fullstack-reason.opam Initial commit Jan 8, 2020
package.json
pnpm-lock.yaml Initial commit Jan 8, 2020
webpack.config.js Use es6 modules Jan 11, 2020

README.md

Fullstack Reason Demo

This project shows a minimal fullstack ReasonML application. It has a

  • Backend web server that compiles to a native binary using the Esy/dune compilation toolchain
  • Frontend ReasonReact component that compiles to JavaScript using the BuckleScript toolchain
  • Shared business logic used by both of the above

This is a proof-of-concept; you can customize it to your needs.

Try it out

At the moment unfortunately the backend may not work on Windows due to an issue with a dependency. I am trying to resolve it.

Follow these steps:

  1. Install NodeJS (one-time setup)
  2. Install Esy (one-time setup): npm install --global esy@latest
  3. Set up the backend project: esy install (one-time setup but will take a while to compile dependencies like SSL so grab your favourite beverage)
  4. Run the backend app: esy b dune exec backend/App.exe
  5. In another terminal, build frontend: a. npm install (or use pnpm to save some disk space) b. npx bsb -clean-world c. npx bsb -make-world
  6. Run the frontend (this is in development mode): npm run server
  7. Browse the frontend: http://localhost:8000/

'Production' mode

You can also try out the app without the Webpack dev server:

  1. Assuming the above builds have already been done
  2. Put production assets in the build directory: npm run webpack:production
  3. Run the backend app: esy b dune exec backend/App.exe
  4. Browse the frontend (note, different port than above, this is being served directly from the backend app): http://localhost:8080/

Correctly caches the JS bundle–with cache busting!

How it works

This project pulls together:

Project layout

These are the significant parts of the project:

  • backend/: contains the sources for the backend executable
  • esy.lock/: a lock directory used by Esy to capture precise dependency information
  • frontend/: contains the sources for the frontend ReasonReact app
  • shared/: contains sources shared between the backend and frontend
  • bsconfig.json: BuckleScript project configuration
  • dune-project: Dune project configuration (for the native build)
  • esy.json: Esy project configuration (native package management)
  • fullstack-reason.opam: OPAM project configuration (empty but needed for backward-compatibility with OPAM)
  • package.json: Npm project configuration
  • webpack.config.js: Webpack bundler configuration for the frontend

Honourable mention: build outputs are in the .gitignore.

You can’t perform that action at this time.