Deploy a Phoenix Chat App


This is a Phoenix/Elixir real time chat example based on chrismccord/phoenix_chat_example. It has been lightly modified to run on Render.

A sample app based on this code is running at https://phoenixchat.onrender.com.

  1. Fork render-examples/phoenix_chat_example and create a new Web Service, giving Render’s GitHub app permission to access your forked repo.

    Render supplies the PORT and RENDER_APP_HOSTNAME environment variables for config/prod.exs.

    config :chat, ChatWeb.Endpoint,
     http: [:inet6, port: System.get_env("PORT") || 4000],
     url: [host: System.get_env("RENDER_APP_HOSTNAME"), port: 80], cache_static_manifest: "priv/static/cache_manifest.json", secret_key_base: Map.fetch!(System.get_env(), "SECRET_KEY_BASE")

    If you add a custom domain to your Render app, don’t forget to change the host in url to your new domain.

    Render automatically manages and terminates SSL for your apps, so you don’t need to configure SSL in Phoenix.

  2. Use the following values during creation:

    Build Command: ./build.sh

    Here are the contents of build.sh:

    #!/usr/bin/env bash
    export MIX_ENV=prod
    mix deps.get --only prod
    mix compile
    cd assets && npm install && npm run deploy && cd ..
    mix phx.digest

    Start Command: mix phx.server

    Under the Advanced section, add a new environment variable:

    KeyValue
    SECRET_KEY_BASEA sufficiently strong secret. You can generate a secret locally by running mix phx.gen.secret

    This is used for your secret key base in config/prod.exs.

    config :chat, ChatWeb.Endpoint,
     http: [:inet6, port: System.get_env("PORT") || 4000],
     url: [host: System.get_env("RENDER_APP_HOSTNAME"), port: 80],
     cache_static_manifest: "priv/static/cache_manifest.json",
     secret_key_base: Map.fetch!(System.get_env(), "SECRET_KEY_BASE")

Save your service and you’re done! Your chat service will be live on your Render URL as soon as the build finishes.