LiveView LiveComponents article

I’m excited about the new LiveComponents feature in LiveView, but I haven’t seen much written on it, so I decided to write a couple of articles based on a talk I gave at our Portland, Oregon Elixir meetup. The first article is an introduction to LiveComponents and is available now. The second one will be out later next week and walk through a more elaborate example.

You can find the first article here:


Thank you, bookmarking this!


Could you please update the mount definitions in the LiveComponents to contain only the socket? ( . If we follow your article, and add internal state to the LiveComponents, it doesn’t work : Livecomponent: assign @value not available in eex template. Why such behaviour?

1 Like

Thanks for pointing that out. It is fixed now.

I have just updated the article and code to LiveView 0.6.0.

I have updated the article and code to LiveView 0.13.3.


In the third code example you have: ~L"\"" (note the backslash). That’s a typo is it not?

PS, really, really helpful article. I just got started with Phoenix a few weeks ago.

Glad you found the article helpful! Yeah, that was a formatting issue. Tehanks for letting me know. It is fixed now.