スポンサーリンク

2015年5月30日

ElixirにmixでPhoenixを混ぜ混ぜしてやる!!

タイトル:ElixirにmixでPhoenixを混ぜ混ぜしてやる!!

目的:ElixirのWebFrameworkであるPhoenixをmixを使ってインストールする

実施環境:
OS: Windows8.1
Erlang: Eshell V6.4
Elixir: v1.0.4
Phoenix Framework: v0.13.1

目次:

  1. Phoenixのインストール
  2. 実行確認

Elixirの環境を構築しておくこと。

Railsのコミッターが作ったElixirのWebFrameworkとのこと。
Railsライクにできるらしい。
(私自身がRails触ったことないので分からないが・・・)

1.Phoenixのインストール

1.1
コマンドプロンプトを起動し、以下のコマンドを実行する。
コマンド: mix local.hex

以下のような文言が流れると思う。

Are you sure you want to install archive https://s3.amazonaws.com/s3.hex.pm/installs/1.0.0/hex.ez? [Yn] y

yを選択し以下の文言が表示されればインストール完了。
* creating .mix/archives/hex.ez

このhexと言うものなのだが調べてみたところ、
パッケージ管理ツールとのこと。
mixもそのようなものであることを考えると、
RubyGemsのbundlerのようなものだろうか?

いずれにせよ、Hexインストール済みの方はこの作業は不要だと思う。
毎回入れるわけないだろうし・・・

すいません、何分英語が不慣れなため曖昧な形になってしまいます。
続き行きます。

追記(2015/06/04-15:03)
"mix new プロジェクト名"にて作成後、
必要なライブラリを取り込むとき、初回はhexが入ってないようです。
参考までに・・・

ただ、mix local.hexを再度実行すると既に存在していると出力されます。
この違いについてはまだ分かってません。

何れにせよ、初回ならばあまり意識しなくても大丈夫かと思います。

追記2(2015/06/04-15:03)
>>ただ、mix local.hexを再度実行すると既に存在していると出力されます。
>>この違いについてはまだ分かってません。
ローカルと各プロジェクトで混在できることが書かれていました。

1.2
以下のコマンドを実行する。
コマンド:
mix archive.install https://github.com/phoenixframework/phoenix/releases/download/v0.13.1/phoenix_new-0.13.1.ez

以下のような文言が流れると思う。
Are you sure you want to install archive https://github.com/phoenixframework/phoenix/releases/download/v0.13.1/phoenix_new-0.13.1.ez? [Yn] y

yを選択し以下の文言が表示されればインストール完了。
* creating .mix/archives/phoenix_new-0.13.1.ez

これでインストールは完了。

2.実行確認

2.1
テストアプリを実行するための作業ディレクトリを作成する。
私のディレクトリ: C:\MyWorkSpaces\elixir_space\test_app

test_appと言う作業用ディレクトリを作成した。

2.2
以下のコマンドを実行し、作業ディレクトリへ移動する。
コマンド: cd C:\MyWorkSpaces\elixir_space\test_app(各自で作業ディレクトリは変更する)

2.3
以下のコマンドを実行する。
コマンド: mix phoenix.new hello_phoenix

コマンド: mix phoenix.new --no-brunch hello_phoenix

hello_phoenixの部分に絶対パスで指定することもできる。
今回は相対パスで指定した。(作業ディレクトリにいるからね)

yes or noを聞かれたらyesを選択する。

※ --no-brunchを付ける理由

Phoenixのデフォルトでは,
JavaScriptやCSSなどのコンパイルにbrunch.ioを使用するとのこと。
Brunch.ioは、依存関係をインストールするためにnpm(node package manager)を使用する。
また、npmはNode.jsを必要とするとのこと。

私が、この記事を書いている時点では、node.jsはインストールしていない。
なので、JavaScriptやCSSを適応させるために、--no-brunchオプションを付けている。

実際、--no-brunchオプションなしで実行してWeb画面の表示まで行ったが、
見事にjavascript、cssが適応されていなかった。

私は、Node.jsを使ったことも入れたこともないのでよく分からない。
インストール(?)するだけで、phoenix側が認識してくれるのか、設定が必要なのか今後調査する。

2.4
作業ディレクトリ内にhello_phoenixと言うディレクトリができている。
コマンドプロンプトの画面証跡取ろうと思ったんですけど、
ログ消えてしまいました・・・|ω・`) ショボーーン

以下のコマンドで移動する。
コマンド: cd hello_phoenix

2.5
lsコマンドで内容を確認すると幾つかのファイルができている。
以下のコマンドを実行してサーバを起動する。

コマンド: mix phoenix.server

また、こちらでも起動できる。
コマンド:iex -S mix phoenix.server

対話モードも立ち上がると言うことは・・・どういうことだってばよ?
すいません、ここら辺はまだ分かりません。

コンパイルが長々と流れるが、起動するまで放置する。

2.6
以下のアドレスへアクセスする。

URL: http://localhost:4000/

デフォルトではポート番号4000を使っているようです。

以下のような画面が出てくるはず・・・

私の環境で--no-brunchを付けずに作成し実行した画面。
本家ドキュメントと表示が違う・・・CSSとJavaScriptが動いてない感じがします。














私の環境で--no-brunchを付けて作成し実行した画面。


















2.7
終了するには、どちらのコマンドを使用していても「Ctrl+c」で終了できる。
バッチを終了するか聞かれるので、yで終了。

おまけ
こっちで「iex -S mix phoenix.server」実行した時、対話モード見ていたら以下のような文言が流れていた。

iex(1)> [info] GET /
iex(1)> [info] Processing by HelloPhoenix.PageController.index/2
  Parameters: %{"format" => "html"}
  Pipelines: [:browser]
iex(1)> [info] Sent 200 in 64ms
iex(1)> [info] GET /css/app.css
iex(1)> [info] GET /js/app.js
iex(1)>

と言うことは、逐一Webの情報を出力しているということですね。
デバッグする時とか使えそうですね。

追記(2015/05/31-24:28)
Node.jsを入れて、検証した記事を上げました!!
Phoenixが欲しいって言うからNode.jsをインスコするよ!!

Chocolateyを使ってインストールしたい方は、
Qiitaに記事を上げて下さっている方がいらっしゃいます。
Qiita - Windows 8.1にElixirを導入するメモ

以上!!

以下、参考にさせて頂いたサイト様

管理人の独り言~
本家ドキュメントとにらめっこしながらようやっと起動させられた。
基本的な使い方もやらないと、それにElixirで誰かが作っているMongoDBドライバも使いたい。
いずれにせよ、しばらくPhoenixのドキュメント通りにやろうかな。
しかし、node.js入れないと・・・また調べること増えたwww

人気の投稿