acrolink

acrolink

How to simulate Phoenix LiveView in a Flutter mobile application?

I thought of rendering the HTML containg the LiveView components using webview, but I prefer a more native way. How to achieve that ? Is there any helper libraries to use with Flutter (providing a similar experience to LiveView in the mobile applicatiin while communicating with a Phoenix back-end application) ?

Most Liked

arcanemachine

arcanemachine

There’s a Dart package for interacting with Phoenix Channels:

I haven’t used it but it looks to be under active development.

There’s also a tutorial on GitHub showing how to put the pieces together:

https://github.com/dwyl/flutter-phoenix-channels-demo

Again, I haven’t done this tutorial, but I found the dwyl tutorials on GitHub to be very good when I was learning Phoenix.

Also, when I did go down this road, I did embed webviews into a Flutter app. The webview content can communicate with the “native” Flutter widgets via JS message passing. So your web stuff can be plain LiveView, and you can still interact with “native” Flutter widgets. Best of both worlds IMO since your web stuff can be reused on your mobile app. I encourage you to take a look at that before you make up your mind. (If you do, I found that this Dart webview package is way better than the official one, which was barely useable when I tried it ~2 years ago.)

jack456jokky

jack456jokky

That sounds like a fascinating challenge! If you’re aiming for a seamless experience like LiveView in Flutter, have you considered using Flutter’s stream and StreamBuilder? They can handle real-time data efficiently. Plus, integrating Phoenix Channels with Flutter can give you that native feel while keeping everything in sync. Excited to see where this project takes you!

Nicodemus

Nicodemus

Another option might be LiveView Native… I think it would be theoretically possible to embed both LVN and Flutter in a single app for different parts of it, wherever it makes sense. Of course, LVN is not yet ready, but something to keep an eye on.

Last Post!

acrolink

acrolink

This is interesting, using Absinthe and GraphQL-Flutter ?! Here is a link to my comment on that post ..

Where Next?

Popular in Questions Top

rms.mrcs
Hi, I need to transform a list of numbers into a map where the keys are the indexes and the values are the original values of the list. ...
New
jononomo
I am trying to figure out how Mix knows whether the environment is test, dev, or prod – where is this set? Thanks.
New
Brian
What is the proper way to load a module from a file in to IEX? In the python world, doing something like this pretty standard: from ....
New
jononomo
For some reason my phoenix channels are working for me in my local dev environment, but as soon as I deploy via Docker, I get a 403 error...
New
mcarvalho
What is the difference between System.get_env and Application.get_env? For example, what are best practices to use one versus another.
New
nsuchy
Hi. I’ve noticed that Windows Powershell has it’s own IEX command and you cannot access Elixir’s IEX due to the conflict. This isn’t a cr...
New
freewebwithme
Using vs code and installed ElixirLS: support and debugger. And I got an error popped up on start up says Failed to run ‘elixir’ comma...
New

Other popular topics Top

vonH
In asking this question I am more interested about the expressiveness of the language itself and less concerned about the availability of...
New
stefanchrobot
What’s the safe way to decode a JSON string into a struct? I want to avoid calling String.to_atom. Jason.decode can give me a map with st...
New
nsuchy
Hi. I’ve noticed that Windows Powershell has it’s own IEX command and you cannot access Elixir’s IEX due to the conflict. This isn’t a cr...
New
dogweather
I wrote this comment on r/haskell, and it’s not popular there. :wink: But I think I’m on to something… Haskell reminds me of Java, and e...
New
gausby
I asked this very same question on twitter and got some interesting feedback, but I thought it would be a good question to ask here as we...
1207 40042 209
New
senggen
Erlang/OTP 25 [erts-13.2.2] [source] [64-bit] [smp:8:8] [ds:8:8:10] [async-threads:1] 15:22:35.803 [error] gen_event {lager_file_backend...
New

We're in Beta

About us Mission Statement