elm-ssr-demo

Architecture:

• GraphQL API in Elixir
• Frontend in Elm
• Frontend server in Deno

Does it work?

Yes.

Setup

Nothing too crazy, assuming archlinux:

1. Setup Nix
2. Setup direnv
3. Setup docker and docker-compose:

pacman -Syu docker docker-compose 
sudo usermod -aG docker $(whoami)
sudo systemctl start docker
sudo systemctl enable docker

4. Run postgres with docker-compose up -d;
5. Run backend
   • Install dependencies with mix deps.get
   • Run backend with mix phx.server
6. Run frontend with deno task dev.
   • To update schemas run pnpm install and deno task api.

Notes

This doesn't do any hydration, so it diffs the whole view after loading. But this is not that bad as it does reuse the model, avoiding useless reloads.

Rendering on the server is done thanks to elm-html-string so this doesn't support elm-ui and components available in elm packages.

This could be fixed abusing a hack from elm-test, but I didn't want to redo this hack here.

I didn't do any routing here, but it can be done easily in the same way elm-spa-example does.

For a solution more compatible with available packages see elm-pages.