piyopiyo.ex #1 Phoenix install 〜Hello,world! (Windows)

piyopiyo.ex #1 Phoenix環境構築〜Hello,world!のスライドです。

Transcript

1. Elixir インストール Windows
2. Elixir をダウンロードします https://elixir-lang.org/install.html
4. インストーラーを実行 「Next」をクリック
5. 「Next」をクリック
6. 「Next」をクリック
7. ダウンロードが完了するまでしばらくお待ちください
8. 「Next」をクリック
9. 「Next」をクリック
10. 「Install」をクリック
12. チェックをし「Install」をクリック　
13. 「Close」をクリック
16. 「Close」をクリック
17. 「Next」をクリック
18. 「Next」をクリック
19. 「Next」をクリック
20. 「Install」をクリック
21. 「Finish」をクリック
22. VSCodeをダウンロード https://code.visualstudio.com/Download
24. 「同意する」、「次へ」をクリック
25. 「次へ」をクリック
26. 「次へ」をクリック
27. 「次へ」をクリック
29. 「完了」をクリック
30. VSCode起動後　「インストールして再起動」をクリック
31. 再起動後日本語表記になります
32. 「拡張機能」をクリック
33. 「elixir」と入力
34. 「ElixirLS　Elixir…」→「インストール」をクリック
35. 以上で、ElixirとVSCodeのインストールは完了です
36. Phoenixインストール コンソールを開いてください。 mix archive.install hex phx_new 1.6.0
37. Phoenixのプロジェクトを作ってみよう！ mix phx.new sample --no-ecto etch and install dependencies? [Yn]と聞かれるのでY
38. Phoenixを起動しよう！ cd sample mix phx.server 起動後ブラウザで http://localhost:4000/　にアクセス
39. 改造してみよう！ sample/lib/sample_web/templates/page/index.html.heex 改造例 <h1><%= gettext "Welcome to %{name}!", name: "Phoenix" %></h1> ↓ <h1><%= gettext "Welcome to %{name}!", name: "PiyoPiyo" %></h1>