Search code examples
springspring-bootkotlinproxyelm

Proxy front-end HTTP calls in development

I' building a small website. The back-end is written in Kotlin and uses Spring boot, and the front-end is built in Elm.

The generated javascript app will be served statically by my back-end on deployment.

For development, I currently work as such :

  • Serve my spring boot application on localhost:8080
  • Serve my Elm app on b using create-elm-app

The main reason is that create-elm-app allows for hot-compilation and hot-reload of the Elm app, which makes it very convenient.

The problem with this is that I have to set up all my elm http calls against another port locally, which means I have to alter the code for production.

Ideally, I'd like to:

  • Either have live-recompilation of elm code that changes ( I used chokidar in node, but didn't find a direct java alternative) coupled to a spring boot hot reload
  • Have create-elm-app redirect my API calls
  • Or auto-proxy all my calls to another location via a third party

Does anyone have experience with this? What setup would you recommend?

Cheers,

Solution

  • Alright, using the word proxy did help!

    It seems that the create-elm-app documentation already expects this use case. You can read more about it here.

    Basically what needs to be done is:

    • Create a elmapp.config.js file at the root of the elm project, with the following content (in my case, you can adapt):
    module.exports = {
    proxy: "http://localhost:8080",
}

    Then, in your elm code, use absolute URLs. For example : 

    makeCreateGameUrl : Model -> String
makeCreateGameUrl model =
    absolute
        [ "game" ]
        [ string "players" (joinListOfStrings model.newPlayerNames) ]

    After this, your API calls will be directly redirected to your backend.