[Elixir+Phoenix]ユーザを画面に表示する

目的

ユーザを表示する。

実行環境

OS： Windows8.1
Erlang： Eshell V6.4, OTP-Version 17.5
Elixir： v1.0.4
Phoenix Framework： v0.13.1
PostgreSQL： postgres (PostgreSQL) 9.4.4

始める前に

ユーザを表示する部分を作成していきます。

目次

1. ルーティングの追加(RESTful)
2. showアクションを追加
3. showテンプレートを作成
4. iexからユーザを追加

1. ルーティングの追加(RESTful)

ファイル名： web/router.ex
以下のように編集して下さい。

scope "/", SampleApp do
  pipe_through :browser # Use the default browser stack

  get "/", PageController, :index
  get "/home", StaticPagesController, :home
  get "/help", StaticPagesController, :help
  get "/about", StaticPagesController, :about
  get "/contact", StaticPagesController, :contact
  get "/signup", UserController, :new
  resources "/user", UserController, except: [:new]
end

説明1
“resources”でRESTfulなパスを追加してます。

説明2
“except: [:new]”でnewだけ除外するようにしています。
newアクションだけ除外しているのは既にsignupで作成しているからです。

ルーティングを確認してみます。

>mix phoenix.routes
        page_path  GET     /               SampleApp.PageController.index/2
        user_path  GET     /signup         SampleApp.UserController.new/2
static_pages_path  GET     /home           SampleApp.StaticPagesController.home/2
static_pages_path  GET     /help           SampleApp.StaticPagesController.help/2
static_pages_path  GET     /about          SampleApp.StaticPagesController.about/2
static_pages_path  GET     /contact        SampleApp.StaticPagesController.contact/2
        user_path  GET     /user           SampleApp.UserController.index/2
        user_path  GET     /user/:id/edit  SampleApp.UserController.edit/2
        user_path  GET     /user/:id       SampleApp.UserController.show/2
        user_path  POST    /user           SampleApp.UserController.create/2
        user_path  PATCH   /user/:id       SampleApp.UserController.update/2
                   PUT     /user/:id       SampleApp.UserController.update/2
        user_path  DELETE  /user/:id       SampleApp.UserController.delete/2

追加&除外されています。
問題ないですね。

2. showアクションを追加

アクションを追加しないと実行時エラーが出てしまいますね。

名称： web/controllers/user_controller.ex
以下のアクションを追加して下さい。

def show(conn, %{"id" => id}) do
  user = Repo.get(SampleApp.User, id)
  render(conn, "show.html", user: user)
end

idでユーザを取得しテンプレートへ渡しているだけですね。
次、ユーザを表示させるためのテンプレートを作成しましょう。

3. showテンプレートを作成

ユーザ名とEmailを表示するだけの簡素なテンプレートを作成します。
後に変更を行いますが、今はこれだけで十分です。

名称： web/templates/user/show.html.eex
以下のような内容を記述して下さい。

<div class="jumbotron">
  <p><strong>Name:</strong><%= @user.name %></p>
  <p><strong>Email:</strong><%= @user.email %></p>
  <p>web/templates/user/show.html.eex</p>
</div>

4. iexからユーザを追加

このままでは何も表示されないので、
暫定的なユーザをiexから追加する。

iex起動。

>iex -S mix

Userモジュールのエイリアスを定義。

iex(1)> alias SampleApp.User
nil

挿入するデータを作成。

iex(2)> params = %{name: "hoge", email: "hoge@test.com", password: "hogehoge"}
%{email: "hoge@test.com", name: "hoge", password: "hogehoge"}

changeset関数を通して挿入できるようにしている。

iex(3)> changeset = User.changeset(%User{}, params)
Validationの処理

Validationの確認(trueなら問題なし)

iex(4)> changeset.valid?
true

DBへ挿入。

iex(5)> SampleApp.Repo.insert(changeset)
DBの処理

5. 画面からユーザを確認

画面から確認してみます。

Phoenixを起動して以下へアクセスする。
URL： http://localhost:4000/user/1

管理人の独り言～

申し訳ないのだが、第六章のSampleApp.User(changeset)で間違いを犯していた。
validate_unique/2で第二引数に”EctoModelSample.Repo”と記述していた。
正式な記述は、SampleApp.Repoである。(コピペの弊害・・・)

そのまま実行するとエラーが発生するので修正して下さい。
記事の方は修正してある。

いや～、顕在化するまで分からないのは怖いですね～

風邪を引きました。
体調が完全じゃないので少し更新速度落とします。

参考文献

なし

​