victor23k
LiveViewPortal - embed LiveViews in other websites
LiveViewPortal is a small library that allows third-party sites to embed LiveView apps.
The library is distributed as an NPM package. Only a small part of the LiveView JS code is modified.
What problem does this solve?
From the LiveView repo:
Phoenix LiveView enables rich, real-time user experiences with server-rendered HTML.
This matches Doofinder’s use case for our ecommerce products except for one point: rendering LiveViews from third party pages. We needed to embed LiveView for everybody that wanted to give their users rich and real-time experiences.
We have been using a modified version of LiveView with this purpose for a long time. We wanted to extend this to other projects and decided to make it open source. Our goal is to make this feature a part of LiveView, and we are working on merging this to LiveView. In the mean time, you can use this library to try it out.
If you want to know more about the technical details, you can check out the repo and our blog post. Also, if you have any questions, I’ll be more than happy to answer here!
Most Liked
shankardevy
Great job! I wanted to do this for sometime but never managed to do it myself! I had a similar one done for a comment server alternative for Disqus that I did for an organisation using LiveView but with a lot of hacks. However something like what you have with LVPortal would make it easier to implement without the ugly hacks. Congrats on making this available for everyone!
jaimeiniesta
Woah, thanks for releasing this, it looks awesome. ![]()
I will try it soon. I can think of many uses for embedding live counters and reports from Rocket Validator into our users’ sites. ![]()
rhcarvalho
Very nice! Several potential upstream contributions!
Thanks for sharing ![]()
Is it viable to use LiveViewPortal and regular LiveView (for other pages in the same app) simultaneously?
Popular in Announcing
Other popular topics
Categories:
Sub Categories:
Forums
Popular Tags
- #ecto
- #liveview
- #troubleshooting
- #learning-elixir
- #deployment
- #library
- #erlang
- #testing
- #genserver
- #mix
- #absinthe
- #remote-other
- #otp
- #plug
- #how-to-question
- #macros
- #postgres
- #channels
- #elixirconf
- #exunit
- #discussion
- #code-sync
- #javascript
- #podcasts
- #onsite
- #dialyzer
- #docker
- #authentication
- #umbrella
- #full-time-contract
- #podcasts-by-brainlid
- #ecto-query
- #elixir-ls
- #phoenix_html
- #iex
- #blog-post
- #graphql
- #genstage
- #ai
- #websockets
- #supervisor
- #advent-of-code
- #elixirconf-us
- #distillery
- #processes
- #forms
- #api
- #metaprogramming
- #security
- #performance









