Building Real-time Applications with Phoenix & Elixir/

...

/

Scaffold the Admin Dashboard

Scaffold the Admin Dashboard

Start building an admin dashboard for your application.

We'll cover the following...

The admin dashboard

There are many moving parts in setting up a brand new section of an application. We’ll tackle this together to see how we’d go about it in other projects. Our scaffolding will consist of these steps:

  1. Define our new Router entries.
  2. Set up an admin layout.
  3. Create the Admin.DashboardController.
  4. Create the Admin.Socket and Admin.DashboardChannel.
  5. Create admin JS and CSS.

We’ll move quickly through these steps. Once this is done, we’ll have the proper foundation to build our admin dashboard.

We’ll start with our route definition. Our admin dashboard will be behind an HTTP Basic Auth screen, and luckily there is a library to help with this. Let’s add the basic_auth library to our mix file.

Press + to interact
# sneakers_23_admin/mix.exs
      {:hound, "~> 1.0"},
      {:basic_auth, "~> 2.2.2"}

Let’s run mix deps.get after we add it. Next, we’ll configure our local login to be “admin/password.” Let’s add this snippet to the end of our dev config file:

Press + to interact
# sneakers_23_admin/config/dev.exs
config :sneakers_23, admin_auth: [
  username: "admin",
  password: "password"
]

We will enter these credentials when the HTTP Basic Auth screen ...