Skip to main content

The Landing Page

We need to cleanup some of the generated code. We can replace the default Phoenix home page, templates, and clean up the filenames.

Renaming the Generated Files

A PageController controller module, and its associated view have been generated. These can be renamed to function as our landing controller. From the project root:

cd apps/elixir_mud_web/lib/elixir_mud_web/controllers/
mv page_controller.ex landing_controller.ex
mv page_html landing_html
mv landing_html/home.html.heex landing_html/landing.html.heex
mv page_html.ex landing_html.ex

The Landing Controller

Now, open landing_controller.ex, change the module name, and the routing function:

defmodule ElixirMudWeb.LandingController do
  use ElixirMudWeb, :controller

  def landing(conn, _params) do
    render(conn, :landing, layout: false)
  end
end

apps/elixir_mud_web/lib/elixir_mud_web/controllers/landing_controller.ex

The Landing HTML View

To create our view, edit the new newly renamed landing.html.heex. Remove all content except the first line and replace it with a simple placeholder as a temporary measure.:

<.flash_group flash={@flash} />
<h1 class="text-5xl text-center font-black mt-12">Elixir MUD</h1>
<div class="text-lg text-center text-zinc-500 mt-2">Coming soon...</div>

apps/elixir_mud_web/lib/elixir_mud_web/controllers/landing_html/landing.html.heex

Updating the Routing

To update the route to the new module modify router.ex and locate the line, close to the top, that handles routing the root path to the old PageController:

get "/", PageController, :home

apps/elixir_mud_web/lib/elixir_mud_web/router.ex

Change it to route to the new LandingController:

get "/", LandingController, :landing

apps/elixir_mud_web/lib/elixir_mud_web/router.ex

Updating the Template Module

The last change is to landing_html.ex. Update the module name and change the embed_templates path:

defmodule ElixirMudWeb.LandingHTML do
  @moduledoc """
  This module contains pages rendered by PageController.

  See the `page_html` directory for all templates available.
  """
  use ElixirMudWeb, :html

  embed_templates "landing_html/*"
end

Take a Look

Finally! Now we can run the server, if it's not already running, and view the page at http://localhost:4000/. We can expect to see a brand new landing page.

Tests

If we run mix test from the project root, we will see one failing test. This failure is related to text on the landing page. First lets rename that test file:

cd apps/elixir_mud_web/test/elixir_mud_web/controllers
mv page_controll_test.exs landing_controller_test.exs

We don't have much on the landing page to test right now, so we will just change the text match to "Coming Soon". Don't forget to change the module name as well:

defmodule ElixirMudWeb.LandingControllerTest do
  use ElixirMudWeb.ConnCase

  test "GET /", %{conn: conn} do
    conn = get(conn, ~p"/")
    assert html_response(conn, 200) =~ "Coming soon"
  end
end

apps/elixir_mud_web/test/elixir_mud_web/controllersapps/elixir_mud_web/test/elixir_mud_web/controllers/anding_controller_test.exs

If we run mix test now all tests should pass.

Updated on Jun 5, 2025