With this set up, there's definitely enough to play around with. The phx-target attribute is setting where we're listening for the event (in this case, the entire window).
The phx-keydown attribute we set on the div listens for "keydown" events and passes them to handle_event. Inside of this embedded template, we're accessing with It's exactly the same as if we'd written assigns.msg. Just like the ~E sigil we can use in standard view render functions to embed eex templates, we can use ~L to embed live templates within a live view's render function. In this case we're just returning a tuple with :ok and a the socket with set to "none". In the mount function, we have access to a session variable we aren't using as well as the socket. The state for our view is held in the socket.assigns, just like we could do with a normal Phoenix channel. Now let's go over a few things going on in the template. , socket) doĪt this point, you should be able to run the server and visit localhost:4000/foo and see a greeting along with whatever key you've most recently pressed. Here are all the deps used at the time of this recording: defp deps do I strongly recommend you use the same library versions I did while doing this series. Next, check your mix.exs file and add phoenix_live_view to your deps. Just like any other Phoenix app, we'll create it with mix:
It won't have the DB-side complexity of the CMS project, but it will include accounts, LiveView forms with validations, show notes, comments and interfacing with an external API.Ĭreate a new Phoenix app and add LiveView ( 3:15) The plan for this series is to make a new site for a podcast. If you still need to get them setup, then follow this ASDF tutorial. If you've already got Erlang, Elixir, Node and Phoenix installed, skip to the next section.
PHOENIX LIVEVIEW TUTORIAL HOW TO
We'll start a LiveView app from scratch in this video. In this tutorial, Kelsey Leftwich, Senior Developer at Headway will teach you how to make client-side events communicated to the server-side modules using. It's been gaining popularity since mid 2019 and is one of the best rapid prototyping tools I've ever worked with.
In this episode, we start building a new app using Phoenix LiveView-a library that makes it possible to write a full web app in Elixir, including the front-end.
0 kommentar(er)
