Crowdhailer

Crowdhailer

Creator of Raxx

Raxx.View - safe, fast HTML templates for web applications

Generate HTML views from .eex template files for Raxx web applications.

Example

Defining Views

Template to show a list of users.

lib/my_app/layout.html.eex

<header>
  <h1><% title %></h1>
  <%= __content__ %>
</header>

lib/my_app/list_users.html.eex

<%= for user <- users do %>
<section>
  <a href="/users/<%= user.id %>"><%= user.name %></a>
  <p>
    Joined on <%= Timex.format!(user.registered_at, "{YYYY}-0{M}-0{D}") %>
  </p>
</section>

lib/my_app/list_users.ex

defmodule MyApp.ListUsers do
  use Raxx.View,
    arguments: [:users, :title],
    template: "list_users.html.eex",
    layout: "layout.html.eex"
end
  • If :template is left unspecified the view will assume the template is in a file of the same name but with extension .html.eex in place of .ex or .exs.
  • An option for :layout can be omitted if all the content is in the view.
  • The :arguments can be set to [:assigns] if you prefer to use @var in you eex templates.
    This will not give you a compile time waring about unused arguments.

Helpers

Helpers can be used to limit the amount of code written in a template.
Functions defined in a view module, public or private, can be called in the template.

lib/my_app/list_users.ex

# ... rest of module

def display_date(datetime = %DateTime{}) do
  Timex.format!(datetime, "{YYYY}-0{M}-0{D}")
end

def user_page_link(user) do
  ~E"""
  <a href="/users/<%= user.id %>"><%= user.name %></a>
  """
end

Update the template to use the helpers.

lib/my_app/list_users.html.eex

<%= for user <- users do %>
<section>
  user_page_link(user)
  <p>
    Joined on <%= display_date(user.registered_at) %>
  </p>
</section>

Partials

A partial is like any another helper function, but one that uses an EEx template file.

lib/my_app/list_users.ex

# ... rest of module

partial(:profile_card, [:user], template: "profile_card.html.eex")
  • If :template is left unspecified the partial will assume the template is in a file with the same name as the partial with extension .html.eex.

Update the template to make use of the profile_card helper

lib/my_app/list_users.html.eex

<%= for user <- users do %>
profile_card(user)
<% end %>

Reusable Layouts and Helpers

Layouts can be used to define views that share layouts and possibly helpers.

lib/my_app/layout.ex

defmodule MyApp.Layout do
  use Raxx.View.Layout,
    layout: "layout.html.eex"

  def display_date(datetime = %DateTime{}) do
    Timex.format!(datetime, "{YYYY}-0{M}-0{D}")
  end

  def user_page_link(user) do
    ~E"""
    <a href="/users/<%= user.id %>"><%= user.name %></a>
    """
  end

  partial(:profile_card, [:user], template: "profile_card.html.eex")
end
  • If :layout is left unspecified the layout will assume the template is in a file of the same name but with extension .html.eex in place of .ex or .exs.
  • All functions defined in a layout will be available in the derived views.

The list users view can be derived from our layout and use the shared helpers.

lib/my_app/list_users.ex

defmodule MyApp.ListUsers do
  use MyApp.Layout,
    arguments: [:users, :title],
    template: "list_users.html.eex",
end

Most Liked

Crowdhailer

Crowdhailer

Creator of Raxx

0.1.5 Adds optional variables to templates.

For example, with the following template:

<h1>
  <%= title %>
</h1>
<p>
  Hello <%= user.name %>
</p>

home_page.html.eex

And corresponding view module.

defmodule MyApp.HomePage do
  use Raxx.View,
    arguments [:user], 
    optional: [title: "MyApp"]
end

This view can then be used to render responses, as follows

user = %{name: "Anne"}
response = Raxx.response(:ok)

# render with default title
MyApp.HomePage.render(response, user)
# render with specific title
MyApp.HomePage.render(response, user, title: "MySpecificPage")

Layouts

Optional variables can be set on both Views and reusable Layouts.
Any optional variable default in a layout can be overridden by a View derived from it.

1.0 Roadmap

There is now a 1.0 Roadmap for Raxx.View as part of the Effort to stabilise Raxx and the ecosystem.

https://github.com/CrowdHailer/raxx/issues/178

Where Next?

Popular in Announcing Top

ityonemo
Currently just starting out on a new mini-project - getting zig NIFs to run in elixir. https://github.com/ityonemo/zigler The idea here...
New
pkrawat1
Presenting Aviacommerce, open source e-commerce platform in Elixir Aviacommerce is an open source e-commerce platform in Elixir. We at...
New
msaraiva
Surface is an experimental library built on top of Phoenix LiveView and its new LiveComponent API that aims to provide a more declarative...
564 43622 214
New
mplatts
With HEEX released we decided to start a components library using Tailwind CSS - check it out here: Petal Components. We also have a boi...
New
mikehostetler
I’m excited to announce Jido, a framework providing foundational primitives for building autonomous agent systems in Elixir. While develo...
New
alisinabh
Hey everyone i’ve developed a library for Jalaali calendar for elixir which supports converting Gregorian dates to Jalaali and vice vers...
New
Crowdhailer
Raxx is an alternative to Plug and is inspired by projects such as Rack(Ruby) and Ring(Clojure). 1.0-rc.1 is now available. To use it re...
New
cjen07
parameterized pipe in elixir: |n&gt; edit: negative index in |n&gt; and mixed usage with |&gt; are supported example: use ParamPipe ...
New
zachdaniel
Ash Framework What is Ash? Ash Framework is a declarative, resource-oriented application development framework for Elixir. A resource can...
New
zoltanszogyenyi
Hey everyone :waving_hand: Excited to join this forum - I am one of the founders and current project maintainers of a popular and open-s...
New

Other popular topics Top

sen
Hi All, I set a environment variables in dev.exs , like below code. when i start server, how can i set the ${enable} value? thanks. d...
New
electic
Hi, I am new to Elixir. I am trying to use the DateTime component to insert a date into MySQL however the there seems to be no way to fo...
New
shahryarjb
Hello, I have map which I want to convert it to string like this: the map: %{last_name: "tavakkoli", name: "shahryar"} the string I ne...
New
chrismccord
This release brings a number of exciting features, including integration with the new Phoenix LiveDashboard and Phoenix LiveView. There h...
New
dokuzbir
I want to highlight html closing tags when i click a html tag. That works in .html files but doesnt work for html.eex templates. How can...
New
stefanluptak
Hello everybody, usually, I use a 29" ultra-wide monitor for VSCode which can easily accomodate explorer (files panel) + file with code ...
New
freewebwithme
Using vs code and installed ElixirLS: support and debugger. And I got an error popped up on start up says Failed to run ‘elixir’ comma...
New
fayddelight
I tried installing elixir 1.11.2 erlang 23.3.4 via asdf in my zsh shell. Enabled the versions locally and globally. When I list them ...
New
bsollish-terakeet
Credo is smart enough to check for (something like) this: assert length(the_list) == 0 with this response: Checking if an enum is empt...
New
jason.o
In the code below, if the create action is not set to accept “extra_key” as an input, it errors out with a message shown above. Is there ...
New

We're in Beta

About us Mission Statement