Brad

Brad

Programming Phoenix LiveView:

Two things:

1.
The book is written to,. or alludes to the following…

Open up an operating system shell and navigate to the parent directory for your project. Then, type:
mix phx.new pento --live

[pp_liveview] ➔ mix phx.new pento --live * creating pento/config/config.exs

  • creating pento/config/dev.exs
  • creating pento/config/prod.exs

    Fetch and install dependencies? [Yn] Y
  • running mix deps.get

    The mix phx.new command runs the Phoenix installer for a standard Phoenix project, and the --live switch adds the library dependencies, configuration, and assets we’ll need to build live views.

As we work through this book, we’ll point out the bits that this --live switch adds to our project, and we’ll examine the directory structure in detail over time. For now, know that backend code goes in the lib/pento directory, the web- based assets like .css and .js files go in assets, and the web-based code all goes in the lib/pento_web directory.
Create The Database and Run The Server
At the bottom of the installation output, you’ll find a few extra instructions that look something like this:

We are almost there! The following steps are missing:
$ cd pento
$ mix deps.get
$ cd assets && npm install && node node_modules/webpack/bin/webpack.js
–mode development
Then configure your database in config/dev.exs and run:
$ mix ecto.create

I think too many assumptions are made at this step, especially if you are rusty. mix ecto.create errors out. You need to be specific about what those configs need to be set at in config/dev.exs. Also which version of PostgreSQL? A suggestion GUI-driven version probably would be a good idea to help standardize this.

2.
The book above (#1) says one thing but the printout I get from running mix phx.new pento --live produced s slightly different set of instructions at the end of the project generation.

(base) bradhutchins@MacBook-Pro Programming-Phoenix-LiveView % mix phx.new pento --live

  • creating pento/config/config.exs
  • creating pento/config/dev.exs
  • creating pento/config/prod.exs
  • creating pento/config/prod.secret.exs
  • creating pento/config/test.exs
  • creating pento/lib/pento/application.ex
  • creating pento/lib/pento.ex
  • creating pento/lib/pento_web/channels/user_socket.ex
  • creating pento/lib/pento_web/views/error_helpers.ex
  • creating pento/lib/pento_web/views/error_view.ex
  • creating pento/lib/pento_web/endpoint.ex
  • creating pento/lib/pento_web/router.ex
  • creating pento/lib/pento_web/telemetry.ex
  • creating pento/lib/pento_web.ex
  • creating pento/mix.exs
  • creating pento/README.md
  • creating pento/.formatter.exs
  • creating pento/.gitignore
  • creating pento/test/support/channel_case.ex
  • creating pento/test/support/conn_case.ex
  • creating pento/test/test_helper.exs
  • creating pento/test/pento_web/views/error_view_test.exs
  • creating pento/lib/pento/repo.ex
  • creating pento/priv/repo/migrations/.formatter.exs
  • creating pento/priv/repo/seeds.exs
  • creating pento/test/support/data_case.ex
  • creating pento/lib/pento_web/templates/layout/root.html.leex
  • creating pento/lib/pento_web/templates/layout/app.html.eex
  • creating pento/lib/pento_web/templates/layout/live.html.leex
  • creating pento/lib/pento_web/views/layout_view.ex
  • creating pento/lib/pento_web/live/page_live.ex
  • creating pento/lib/pento_web/live/page_live.html.leex
  • creating pento/test/pento_web/views/layout_view_test.exs
  • creating pento/test/pento_web/live/page_live_test.exs
  • creating pento/lib/pento_web/gettext.ex
  • creating pento/priv/gettext/en/LC_MESSAGES/errors.po
  • creating pento/priv/gettext/errors.pot
  • creating pento/assets/webpack.config.js
  • creating pento/assets/.babelrc
  • creating pento/assets/js/app.js
  • creating pento/assets/css/app.scss
  • creating pento/assets/package.json
  • creating pento/assets/static/favicon.ico
  • creating pento/assets/css/phoenix.css
  • creating pento/assets/static/images/phoenix.png
  • creating pento/assets/static/robots.txt

Fetch and install dependencies? [Yn] Y

  • running mix deps.get
  • running mix deps.compile
  • running cd assets && npm install && node node_modules/webpack/bin/webpack.js --mode development

We are almost there! The following steps are missing:

$ cd pento

Then configure your database in config/dev.exs and run:

$ mix ecto.create

Start your Phoenix app with:

$ mix phx.server

You can also run your app inside IEx (Interactive Elixir) as:

$ iex -S mix phx.server

Marked As Solved

SophieDeBenedetto

SophieDeBenedetto

Author of Programming Phoenix LiveView

Thanks for pointing this out @Brad, your feedback is super helpful :slight_smile:

You can look for some updated info on installing and configuring Postgres in the next Beta release. As for seeing slightly different output from the mix phx new pento --live command–that would likely be due to your using a different Phoenix version than the one with which the Pento app is generated. Some added text to clarify that this might be the case for readers will probably help here. Look for that in the upcoming release as well!

Where Next?

Popular Pragmatic Bookshelf topics Top

jimmykiang
This test is broken right out of the box… — FAIL: TestAgent (7.82s) agent_test.go:77: Error Trace: agent_test.go:77 agent_test.go:...
New
GilWright
Working through the steps (checking that the Info,plist matches exactly), run the demo game and what appears is grey but does not fill th...
New
mikecargal
Title: Hands-on Rust: question about get_component (page 295) (feel free to respond. “You dug you’re own hole… good luck”) I have somet...
New
alanq
This isn’t directly about the book contents so maybe not the right forum…but in some of the code apps (e.g. turbo/06) it sends a TURBO_ST...
New
curtosis
Running mix deps.get in the sensor_hub directory fails with the following error: ** (Mix) No SSH public keys found in ~/.ssh. An ssh aut...
New
nicoatridge
Hi, I have just acquired Michael Fazio’s “Kotlin and Android Development” to learn about game programming for Android. I have a game in p...
New
brunogirin
When installing Cards as an editable package, I get the following error: ERROR: File “setup.py” not found. Directory cannot be installe...
New
jwandekoken
Book: Programming Phoenix LiveView, page 142 (157/378), file lib/pento_web/live/product_live/form_component.ex, in the function below: d...
New
mcpierce
@mfazio23 I’ve applied the changes from Chapter 5 of the book and everything builds correctly and runs. But, when I try to start a game,...
New
dachristenson
I just bought this book to learn about Android development, and I’m already running into a major issue in Ch. 1, p. 20: “Update activity...
New

Other popular topics Top

AstonJ
poll poll Be sure to check out @Dusty’s article posted here: An Introduction to Alternative Keyboard Layouts It’s one of the best write-...
New
New
AstonJ
This looks like a stunning keycap set :orange_heart: A LEGENDARY KEYBOARD LIVES ON When you bought an Apple Macintosh computer in the e...
New
Exadra37
I am asking for any distro that only has the bare-bones to be able to get a shell in the server and then just install the packages as we ...
New
Margaret
Hello everyone! This thread is to tell you about what authors from The Pragmatic Bookshelf are writing on Medium.
1147 29994 760
New
PragmaticBookshelf
Author Spotlight Rebecca Skinner @RebeccaSkinner Welcome to our latest author spotlight, where we sit down with Rebecca Skinner, auth...
New
PragmaticBookshelf
Develop, deploy, and debug BEAM applications using BEAMOps: a new paradigm that focuses on scalability, fault tolerance, and owning each ...
New
PragmaticBookshelf
Get the comprehensive, insider information you need for Rails 8 with the new edition of this award-winning classic. Sam Ruby @rubys ...
New
RobertRichards
Hair Salon Games for Girls Fun Girls Hair Saloon game is mainly developed for kids. This game allows users to select virtual avatars to ...
New
PragmaticBookshelf
Use advanced functional programming principles, practical Domain-Driven Design techniques, and production-ready Elixir code to build scal...
New

Sub Categories: