Tutorial: Full-Stack Web Dev in OCaml w/ Dream, Bonsai, and GraphQL

Learning
, , , ,
1

Hi everyone! I’ve written a tutorial blog series about full-stack web development in OCaml, and wanted to share it here.

Last semester, I took Penn State’s CMPSC 431W, where our final project was to build a database-driven web application. Since I’m fairly familiar with web programming through my work on Flarum and past internships/side projects, I decided to use this opportunity to explore the OCaml web development ecosystem. I used Dream for the backend, and Bonsai for the frontend.

While working on this project, I realized two things:

  • OCaml is very underrated for web development. In addition to all the language’s great features and safety guarantees, the ecosystem is pretty good! Dream near-perfectly coincides with my vision of backend webdev, and Bonsai has a great balance of flexibility/elegance and safety.
  • I couldn’t find realistic but accessible full-stack web projects in OCaml available for reference. I found tutorials for bits and pieces, but nothing that connected all the dots.

I really enjoyed writing an article series on hardware design with OCaml, so I decided to do so for web development as well. In total, I wrote 7 articles that walk through my project’s:

  1. Full-Stack WebDev in OCaml Intro. This includes some background on the project, and instructions for accessing the live demo (Chrome only for now).
  2. Backend WebDev w/ Dream and Caqti.
  3. Building GraphQL APIs with Dream
  4. Setting up Bonsai.
  5. Understanding Bonsai. I actually wrote the first draft of this before I decided to do a blog, while trying to, well, understand Bonsai. It goes over some underlying concepts (SPAs, Frontend State Management, Algebraic Effects, Monads), as well as Bonsai’s core design.
  6. Using GraphQL in Bonsai.
  7. Routing in Bonsai and Project Conclusion.

Additionally, the project’s README has a comprehensive overview of the tech stack, folder structure, and usage instructions. It also includes some reflections on design decisions and my experience working with these libraries.

I had a lot of fun writing these, and I hope they’re useful to anyone considering OCaml for web development. Would be happy to answer any questions or comments.

56 Likes