スポンサーリンク

『Elixir/Phoenix 初級①』を写経する(1)

前回、Windows8.1に、Vagrant+CentOS7.2で、Phoenix1.2.1の環境を構築した。

http://twosquirrel.mints.ne.jp/?p=7381

今回は、引き続き、以下の本を写経していく。

(環境)
Windows 8.1
VirtualBox 5.1.14
Vagrant 1.9.1
CentOS7.3
Erlang/OTP 19
Elixir 1.3.4
Phoenix 1.2.1

(1)環境を確認

TeraTermでログイン
127.0.0.1
2222
vagrant
vagrant

cd /vagrant
mix hex.info
mix phoenix.new -v

image

(2)第5章を写経の準備

mix phoenix.new modest_greeter --no-ecto

image

cd modest_greeter

npm install && node node_modules/brunch/bin/brunch build

image

エラーでうまくいかず。

公式ページ( http://www.phoenixframework.org/docs/installation )を見てみると、

image

と書いてあるので、 –no-brunch をつけてやり直す。

cd /vagrant

rm -rf modest_greeter

mix phoenix.new modest_greeter –no-brunch –no-ecto

image

image

なぜか、–no-brunch をすると、エラーが出ない。全く分からない。
nodeとnpmは入れているつもりなのだが、なぜかエラー。

image

–no-ecto は、postgresql を使わないというオプションらしい。
(データベースアクセス用のパッケージがEcto)

cd modest_greeter

mix phoenix.server

image

image

ホストOS(Windows 8.1)で、http://localhost:4000/

image

Ctrl+C を2回入力することで、serverが停止する。

image

(3)web/router.ex の変更

(変更前)
image

(変更後)
image

●レイアウトテンプレートの整理

web/templates/layout/app.html.eex

(変更前)
image

(変更後)
image

●アクションの作成

web/controllers/hello_controller.ex (新規作成)

image

ここで、Atomの動きが鈍くなってしまったので、VisualStudioCodeに戻した。

●ビューの作成

web/views/hello_view.ex (新規作成)

image

●テンプレートの作成

web/templates/hello フォルダを作成し、その下にshow.html.eex を新規作成

image

image

image
そっけないので、ちょっと戻してみた。

web/layout/app.html.eex

image

image

こっちの方がカッコイイ!

(3)第10章を写経する

やっぱり、npm install –save-dev sass-brunch でエラー。困った。。。

image

【20170320追記】

windowsでvagrantでLinux仮想環境下でnpm installするときは

--no-bin-links

を加える必要がある。

npm install --save-dev --no-bin-links sass-brunch

image

私はこれでうまくいった。

 

 

(参考)

http://www.phoenixframework.org/docs/installation
Phoenix Framework (公式)
Installation

http://qiita.com/uasi/items/80682e2a166241f7d396
rm -rf Brunch 有り/無しで Phoenix プロジェクトを生成してファイルの差分を見てみた
uasi
2015年08月27日に更新

http://qiita.com/h_network21/items/ba6eadb758a667345b27
npm トラブルシューティング
h_network21
2017年01月10日に更新

http://k-shogo.github.io/article/2015/01/05/lets_start_elixir/
君もelixirを始めてみないか

スポンサーリンク

Elixir,Phoenix

Posted by twosquirrel