thojanssens1

thojanssens1

I’m building my first Phoenix app and need a little guidance.

Say I build a quiz maker.

  • Admin users may create questions and answers;
  • Visitors of the website can answer the questions.

I ran the following command to create my first context:
mix phx.gen.html Quiz Question questions text:string

But what confuses me, is that I will have two clearly distinct sections of my website, with two different layouts: a layout and templates for admins, and a layout and templates for the visitors.

Most of these generated files such as the templates to list the questions, create/edit/delete a question, and so on should only be accessible by an admin user.

Also, the template to view a question show.html.eex will be different for an admin and a visitor: the visitor will have a nicely displayed question (with different html), while the admin will have a rather raw template, using the same layout as the layout used for listing questions and editing questions.

All of the admin templates will have a basic layout, while the templates for the visitors will have a layout with a nicer design.

The command above generates for exemple:
lib/quiz_maker_web/templates/question/show.html.eex
lib/quiz_maker_web/templates/question/form.html.eex
...

While I need something like:
lib/quiz_maker_web/templates/admin/question/show.html.eex
lib/quiz_maker_web/templates/admin/question/form.html.eex
lib/quiz_maker_web/templates/guest/question/show.html.eex
...

I think my requirement is a pretty basic one, but I don’t know the best way to achieve it. Any help is very much appreciated!

First 5 of 5 Posts Switch mode

idi527

idi527

:waving_hand:

You can have “scoped” controllers like

defmodule YourAppWeb.Admin.QuestionController do
end

this would make phoenix use lib/quiz_maker_web/view/admin/question_view.ex and look in lib/quiz_maker_web/templates/admin/ for the templates.

jeremyjh

jeremyjh

Hi, you can make a separate pipeline in which you specify a different template for the layout, and then use that pipeline in the scope that contains the admin routes.

For example, define a separate layout in admin.html.eex, then configure your router something like:


  pipeline :admin_pages do
    plug(:accepts, ["html"])
    plug :put_layout, {MyAppWeb.LayoutView, "admin.html"}
  end

  scope "/admin", MyAppWeb, as: :admin do
    pipe_through(:admin_pages)
    get("/", AdminController, :index)
  end

Any pages served under /admin will get the admin layout.

thojanssens1

thojanssens1 OP

I have a login page for the admin users, managed by Admin.SessionController and displayed by new action and /templates/admin/session/new.html.eex template. I’d like this page to have the admin layout like other admin pages, and be located under /admin url.

However, the problem I have is that the /admin scope (which sets the admin layout and provides the /admin/ url part) requires authentication, so I can’t display the admin’s login page for an unauthenticated admin. How would you solve that?

scope "/admin", MyAppWebWeb, as: :admin do
  pipe_through [:browser, :authenticate_user, :admin_pages]
  resources "/questions", Admin.QuestionController
  resources "/users", Admin.UserController, except: [:edit, :update]
  resources "/sessions", Admin.SessionController, only: [:new, :create, :delete]
end

Note that I will have a SessionController for the website visitors as well, with different redirects on successful authentication, and different templates.

thojanssens1

thojanssens1 OP

I just remembered about nested scope and it solved my problem about th admin login page it seems:

scope "/admin", MyAppWeb, as: :admin do
  pipe_through [:browser, :admin_pages]
  resources "/sessions", Admin.SessionController, only: [:new, :create]

  scope "/" do
    pipe_through [:authenticate_user]
    resources "/users", Admin.UserController, except: [:edit, :update]
    resources "/sessions", Admin.SessionController, only: [:delete]
  end
end

:slight_smile:

— All posts loaded —

Where Next? Top

Trending in Questions Top

stjefim
Hello! Suppose you are building workflow (order / task / payment) processing system with the following requirements: Each workflow con...
New
jonnycharles
I’m in search of an Elixir library that offers PDF generation capabilities similar to Ruby’s Prawn. While there have been discussions abo...
New
spammy
I’m looking to build a personal workflow to quickly deploy web applications written in elixir/phoenix, for local consumption (ie not on t...
New
dli
Before I dive in myself, did anyone successfully sprinkle Hologram into their existing LiveView app? Looking for hints regarding: Addi...
New
roeland
Kia ora, We have been using elixir-google-api to connect to Google Drive. However, with the updates to Tesla due to CVEs this is now bro...
New
bottlenecked
Hi all, I wanted to ask how the community is dealing with post-release steps. Today we have Ecto migrations, which make sure that the db...
New
rahultumpala
Hello, I have an Elixir backend that implements a custom protocol over TCP. I want to load test the backend and assess the performance o...
New

Other Trending Topics Top

JesseHerrick
Hey, I’m Jesse and I’m the main contributor behind Dexter, a full-featured, lightning-fast Elixir LSP optimized for large codebases. It s...
New
jimsynz
Beam Bots (or just BB for short) is a framework for building fault-tolerant robotics applications in Elixir using familiar OTP patterns. ...
New
Damirados
Hello everyone. After busy few months I am happy to announce v0.1.0 of Emerge & Solve. They are GUI (Emerge) and State management (S...
New
netoum
Corex is an accessible, unstyled UI component library for Phoenix that integrates Zag.js state machines using Vanilla JavaScript and Live...
New
ausimian
Emily is an Elixir library that runs Nx computations on Apple’s MLX. Install it as the default Nx backend and Nx, defn, Axon, Nx.Serving,...
New
juhalehtonen
There has been a thread to discuss the Stack Overflow Developer Survey on this forum every year since 2018, so here’s yet another one for...
New

We're in Beta

About us Mission Statement