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

abtin
page 20: … protoc command… I had to additionally run the following go get commands in order to be able to compile protobuf code using go...
New
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
johnp
Running the examples in chapter 5 c under pytest 5.4.1 causes an AttributeError: ‘module’ object has no attribute ‘config’. In particula...
New
belgoros
Following the steps described in Chapter 6 of the book, I’m stuck with running the migration as described on page 84: bundle exec sequel...
New
simonpeter
When I try the command to create a pair of migration files I get an error. user=> (create-migration "guestbook") Execution error (Ill...
New
HarryDeveloper
Hi @venkats, It has been mentioned in the description of ‘Supervisory Job’ title that 2 things as mentioned below result in the same eff...
New
New
Charles
In general, the book isn’t yet updated for Phoenix version 1.6. On page 18 of the book, the authors indicate that an auto generated of ro...
New
hazardco
On page 78 the following code appears: <%= link_to ‘Destroy’, product, class: ‘hover:underline’, method: :delete, data: { confirm...
New
rainforest
Hi, I’ve got a question about the implementation of PubSub when using a Phoenix.Socket.Transport behaviour rather than channels. Before ...
New

Other popular topics Top

dimitarvp
Small essay with thoughts on macOS vs. Linux: I know @Exadra37 is just waiting around the corner to scream at me “I TOLD YOU SO!!!” but I...
New
Exadra37
Oh just spent so much time on this to discover now that RancherOS is in end of life but Rancher is refusing to mark the Github repo as su...
New
PragmaticBookshelf
Build highly interactive applications without ever leaving Elixir, the way the experts do. Let LiveView take care of performance, scalabi...
New
PragmaticBookshelf
Programming Ruby is the most complete book on Ruby, covering both the language itself and the standard library as well as commonly used t...
New
PragmaticBookshelf
Leverage Elixir and the Nx ecosystem to build intelligent applications that solve real-world problems in computer vision, natural languag...
New
New
AstonJ
If you’re getting errors like this: psql: error: connection to server on socket “/tmp/.s.PGSQL.5432” failed: No such file or directory ...
New
PragmaticBookshelf
Lint your docs like code: turn any style guide into enforceable rules with Vale and publish clear, consistent content every time. ...
New
PragmaticBookshelf
Quickly turn complex problems into simple, working solutions using functional programming, safe concurrency, and the expressive tools of ...
New
pragdave
Build robust LLM-powered apps, chatbots, and agents while mastering AI engineering principles that will help you outlast the tools and th...
New

Sub Categories: