andrea

andrea

Can Phoenix LiveView be used in multi-page applications or does it have to be a SPA?

Can Phoenix LiveView be used in multi-page applications, unlike React/Vue/Blazor which seems to be targeted for SPA?

Most Liked

davearonson

davearonson

I don’t see any reason why not. After all, you can always set a link to go to a fresh page, whether that one has LiveView on it or not.

malloryerik

malloryerik

Yeah, LiveView webapps are kind of like anti-SPAs. You can find dozens of descriptions like this but here goes: Phoenix apps with LiveView pages are multi-page apps where some pages are regular http pages and some are LiveView pages, and the router, back buttons, urls and so on all work just like normal. If you want to only use LiveView pages in a Phoenix app that’s possible, though I think that typically at least login pages will be http.

The difference between traditional http pages and LiveView pages is that instead of an http connection which connects, sends html and data transfers and immediately disconnects, LiveView pages use a websocket connection which remains open, more like a telephone connection as an example, and push html and data changes on that page without reconnecting. (Normal Phoenix http pages are also great at establishing websocket connections, but aren’t designed to automatically send html changes over the wire.)

When you navigate from one LiveView page to another in the same app you’ll do it using the router and a new connection will be established, quite normal and delightfully boring. You can also have LiveView components inside of your LiveView pages, so basically LiveViews nested inside of other LiveViews, kind of SPA-ish but simpler.

Last, nothing stops you from using Vue, React, Svelte and so on inside of an app that has LiveViews, and even inside of LiveViews themselves (not saying it’s a necessarily a good idea). Here’s a library to help with using React components directly inside of LiveViews:

Where Next?

Popular Backend topics Top

pillaiindu
Cross posting from HashNode. A friend of mine is creating Uber-like app for a small company with 200 to 1000 cars. The app will operate ...
New
ohm
Does anybody have good learning resources with regards to going into Event Driven Design, Architecture or Sourcing? I got recommended Er...
New
sampu
I have a use case where a client is invoking a Rest endpoint via a load balancer, which in turn invokes a third party endpoint which is r...
New
Fl4m3Ph03n1x
Background I am trying out polymorphic typing with dialyzer. As an example I am using the famous Option type (aka, Maybe Monad) that is n...
New
JimmyCarterSon
Hello, I am. very new to Elixir lang I have only been doing it for about 2 weeks. I recently started following this tutorial todo list, ...
New
JimmyCarterSon
I am confused about the Schema setup, I am setting up a new application and I want to seed files in it as well. I tried to mix to create...
New
sona11
I’m having a difficulty. I want to modify an attribute’s data type from String to Array. { “id”: “trn:tarb:tradingpartner:uuid:00000...
New
Fl4m3Ph03n1x
Background I have a module that uses TypedStruct to create structs. This is the code: defmodule Shared.Data.Authorization do @moduledo...
New
Fl4m3Ph03n1x
Background When trying to execute mix release on a Windows 11 machine for a Phoenix project I get the following error: * assembling mark...
New
Fl4m3Ph03n1x
Background I have an umbrella project, where I run mix test from the root. In one of the apps, I am mocking the File module using the Mo...
New

Other popular topics Top

PragmaticBookshelf
Ruby, Io, Prolog, Scala, Erlang, Clojure, Haskell. With Seven Languages in Seven Weeks, by Bruce A. Tate, you’ll go beyond the syntax—and...
New
brentjanderson
Bought the Moonlander mechanical keyboard. Cherry Brown MX switches. Arms and wrists have been hurting enough that it’s time I did someth...
New
DevotionGeo
I know that -t flag is used along with -i flag for getting an interactive shell. But I cannot digest what the man page for docker run com...
New
New
AstonJ
Do the test and post your score :nerd_face: :keyboard: If possible, please add info such as the keyboard you’re using, the layout (Qw...
New
Exadra37
Oh just spent so much time on this to discover now that RancherOS is in end of life but Rancher is refusing to mark the Github repo as su...
New
Margaret
Hello everyone! This thread is to tell you about what authors from The Pragmatic Bookshelf are writing on Medium.
1147 29994 760
New
PragmaticBookshelf
Create efficient, elegant software tests in pytest, Python's most powerful testing framework. Brian Okken @brianokken Edited by Kat...
New
AstonJ
This is a very quick guide, you just need to: Download LM Studio: https://lmstudio.ai/ Click on search Type DeepSeek, then select the o...
New
PragmaticBookshelf
As digital systems increasingly run the world, mastery of the recurring patterns of software development risk is the key to fast and effe...
New