# LiveView learning application

**URL:** <https://forum.elixirforum.com/t/liveview-learning-application/28860>\
**Category:** Guides/Tuts/Tips/Info\
**Tags:** phoenix, liveview\
**Created:** [February 4, 2020, 7:00pm UTC](https://forum.elixirforum.com/t/liveview-learning-application/28860 "2020-02-04T19:00:36Z")\
**Posts on this page:** 1\
**Showing post:** 7

<div class="post-metadata">

**Author:** ![slouchpie](https://forum.elixirforum.com/user_avatar/forum.elixirforum.com/slouchpie/32/34819_2.png) [@slouchpie](https://forum.elixirforum.com/u/slouchpie)\
**Post date:** [August 14, 2020, 12:06am UTC](https://forum.elixirforum.com/t/liveview-learning-application/28860/7 "2020-08-14T00:06:31Z")

</div>

HI there.

I recently added “beep” to a live view page and I also used the `mounted` callback.  
However, I did not do it by calling `beep()` directly in the `mounted` callback. Instead, I used `handleEvent` like this:

In app.js:

```elixir
Hooks.MyElement = {
  mounted() {
    this.handleEvent("play_beep", (payload) => {
      beep();
    });
  },
};

```

Then whenever my LiveView component handles an event with this kind of return:

In my\_live.index.ex:

```elixir
  def handle_info({SomeModule, [:something | [:happened]], _}, socket) do
    {:noreply, push_event(fetch(socket), "play_beep", %{})}
  end

```

So you could have the interval done in elixir instead. There are probably other ways to approach this, and my use case is not the same as yours (I don’t need an interval). Still, hopefully it helps.

Docs here: [JavaScript interoperability — Phoenix LiveView v1.2.5](https://hexdocs.pm/phoenix_live_view/js-interop.html#client-hooks)

P.S. the client can push events too. Look at `pushEvent` in the docs.

P.P.S. You might have to upgrade your `phoenix_live_view` version.

---

_[View the full topic](https://forum.elixirforum.com/t/liveview-learning-application/28860)._