Skip to content

Commit

Permalink
Improve docs
Browse files Browse the repository at this point in the history
  • Loading branch information
josevalim committed Oct 25, 2023
1 parent 160240f commit a912a2b
Showing 1 changed file with 14 additions and 7 deletions.
21 changes: 14 additions & 7 deletions guides/introduction/welcome.md
Original file line number Diff line number Diff line change
Expand Up @@ -59,7 +59,7 @@ defmodule MyAppWeb.ThermostatLive do
end

def handle_event("inc_temperature", _params, socket) do
{:ok, update(socket, :temperature, &(&1 + 1))}
{:noreply, update(socket, :temperature, &(&1 + 1))}

This comment has been minimized.

Copy link
@DavidOliver

DavidOliver Oct 26, 2023

Thanks for fixing this. I was getting back to some LiveView work tonight after a long break, reading the welcome page, and I was beginning to question my sanity! :D

end
end
```
Expand All @@ -79,16 +79,23 @@ The data used on rendering comes from the `mount` callback. The
can access the request parameters, read information stored in the
session (typically information which identifies who is the current
user), and a socket. The socket is where we keep all state, including
assigns. `mount` proceeds to read the thermostat temperature for the
user and store its value in the assigns. After `mount`, LiveView will
render the page with the values from `assigns`.
assigns. `mount` proceeds to assign a default temperature to the socket.
Because Elixir data structures are immutable, LiveView APIs often
receive the socket and return an updated socket. Then we return
`{:ok, socket}` to signal that we were able to mount the LiveView
successfully. After `mount`, LiveView will render the page with the
values from `assigns` and sent it to the client.

If you look at the HTML rendered, you will notice there is a button
with a `phx-click` attribute. When the button is clicked, a
"inc_temperature" event is sent to the server, which is matched and
handled by the `handle_event` callback. The callback updates the state
which causes the page to be updated. LiveView then computes diffs and
sends them to client.
handled by the `handle_event` callback. This callback updates the socket
and returns `{:noreply, socket}` with the updated socket.
`handle_*` callbacks in LiveView (and in Elixir in general) are
invoked based on some action, in this case, the user clicking a button.
The `{:noreply, socket}` return means there is no additional replies
sent to the browser, only that a new version of the page is rendered.
LiveView then computes diffs and sends them to client.

Now we are ready to render our LiveView. You can serve the LiveView
directly from your router:
Expand Down

0 comments on commit a912a2b

Please sign in to comment.