6 ms·

Phoenix creator here – excited to finally have shipped this! Happy to answer any elixir/phoenix/liveview questions. In case folks missed it, buried in the blog

Phoenix creator here – excited to finally have shipped this! Happy to answer any elixir/phoenix/liveview questions. In case folks missed it, buried in the blog post is a new installer that lets folks try out elixir/phoenix in seconds. It installs elixir and generates a new phoenix project from a single command: osx/linux: $ curl https://new.phoenixframework.org/yourappname | sh windows powershell: > curl.exe -fsSO https://new.phoenixframework.org/app.bat; .\app.bat You can visit those url's directly to see what the scripts do. It extends the official elixir prebuilt installers: https://elixir-lang.org/install.sh https://elixir-lang.org/install.sh and https://elixir-lang.org/install.bat https://elixir-lang.org/install.bat edit: You can see it in action here: https://x.com/chris_mccord/status/1864067247255306332 https://x.com/chris_mccord/status/1864067247255306332 Of course we also have non |sh installation guides if that's what you're after: https://hexdocs.pm/phoenix/installation.html https://hexdocs.pm/phoenix/installation.html Now that this is out, I'm looking forward to put together a few new demos. What would folks like to see? Happy hacking!

st3fan 2y ago
(Is it possible to add RSS to the blog? The articles are great but there is no good way to stay up to date.)
- chrismccord 2y ago
  Done! https://phoenixframework.org/feed https://phoenixframework.org/feed You can thank Steffen from the Phoenix team :)
  - asa400 2y ago
    "Phoenix" is misspelled in the title of the Atom feed. Sorry for reporting this here, I looked for a repository to open a fix PR but couldn't find one, the previous Phoenix site repo is archived.
ashton314 2y ago
Congratulations Chris! I started using LiveView shortly after the beta was released. A few of my coworkers were really excited to try it out, so I was tasked with recreating our company's login page with LiveView. Needless to say, there were… ahem… growing pains—but it was super fun to encounter a problem and then just have it go away the following week because of some new update to LiveView. I don't do much (any?) web development these days, but LiveView gave me—a backend dev—the confidence to spin up my own web apps with classy UIs. Thank you so much for all your work!
goosejuice 2y ago
Congrats! Been running a startup off only liveview for about a year as a solo dev and it's been wonderful. Appreciate the work you all do. Selfish demo idea: Bi-directional cursor based infinite pagination with largish datasets with state managed in the url and streaming updates that change the order of the results. Like some kind of soft realtime leaderboard. With long render times (morphdom bench on large sets isn't great as far as I can tell) it's hard to escape the jank. Particularly on slow connections.
- andrewmutz 2y ago
  How much state is it safe to store in the URL these days?
  - ljoshua 2y ago
    Still not much, realistically 4096 bytes or less. Browsers aren’t as much the issue as they’ve been in the past, but I’ve hit snags with proxies, old servers, etc.
    - ethbr1 2y ago
      How does pagination in urls work nowadays? You'd need ~3 bytes to index a reasonable number of pages naively, no? But curious what current art is re: performance optimizations between frontend and backend. Or is it simply page indices?
      - out_of_protocol 2y ago
        If you do limit/offset on database side, page number is enough. Though this doesn't work well for bigger page numbers. There's other ways to do pagination, e.g. with "cursors", where cursor is simply id of last record on previous page. SQL query is very efficient, but jumping to page X is impossible. In this scenario storing cursors for past pages is needed
        cess11 2y ago
mike1o1 2y ago
Congrats on 1.0 and really appreciate all the work involved. One thing that I'd love to see is more demos around optimistic UI's. It's a lot of work, but Ryan Florence from Remix did a whole playlist [1] around recreating Trello in Remix. One video or demo in particular that had some functionality I'd love to see in LiveView (or demo on how to do it) is Optimistic UI and Optimistic Add and Drag and Drop (the last three videos in the playlist). 1. https://www.youtube.com/playlist?list=PLXoynULbYuED9b2k5LS44v9TQjfXifwNu https://www.youtube.com/playlist?list=PLXoynULbYuED9b2k5LS44...
- 7sidedmarble 2y ago
  https://x.com/src_rip/status/1860081489486188812?t=S8QJBrmMOl0-l4ya4oVwBQ&s=19 https://x.com/src_rip/status/1860081489486188812?t=S8QJBrmMO...
- chrismccord 2y ago
  I need to polish the code, but here's more advanced optimistic UI example added to an existing demo app (TodoTrek). It uses recent LiveView features that allows any client code to hook into the full optimistic UI/server sync primitives that are built into LV: https://x.com/chris_mccord/status/1864160634394325038 https://x.com/chris_mccord/status/1864160634394325038
  - arrowsmith 2y ago
    Very cool! Are those recent features documented anywhere? I can't find anything in the latest docs about hooking into LV's server sync primitives. Is this out in v1.0.0 or is it an upcoming feature?
AlchemistCamp 2y ago
I’ve been looking forward to this for a long time! Congrats to you and everyone else who made it happen!
BryanBryce 2y ago
I build 3 client projects in 3 months with Phoenix and Live View (and Ash!). Thank you so much!
sbrother 2y ago
Thank you for everything!! I've shipped quite a few successful apps to clients on Phoenix ever since the beginning, and am about to launch a startup on it. It's truly changed my career more than maybe any other library.
hiisukun 2y ago
Maybe this isn't the best place for feedback, but I was inspired to give this a go. Sadly it didn't work out. First error was: sh: line 1: Application: command not found By visiting https://new.phoenixframework.org/test-elixir-app https://new.phoenixframework.org/test-elixir-app, I could see the proper output: Application name must start with a letter and have only lowercase letters, numbers and underscore So I changed to test_elixir_app, and got this output: downloading https://github.com/elixir-lang/elixir/releases/download/v1.17.3/elixir-otp-27.zip fedora is not supported This was a spur of the moment thing, so maybe I'll try from an Ubuntu machine or something another time, but the friction was unfortunate. Grats on the launch though, the demo gif of using the project installer looked great.
- chrismccord 2y ago
  I will see if we can do something about fedora, but we now convert hyphens to underscores because I'm sure that will trip more folks up – thanks! For fedora, Elixir has instructions on their site: sudo dnf install elixir erlang https://elixir-lang.org/install.html https://elixir-lang.org/install.html I'd love to make it work for elixir install if we can though :)
  - cess11 2y ago
    I generally recommend using ASDF to install Erlang/Elixir, it has support for Fedora. https://asdf-vm.com/guide/getting-started.html https://asdf-vm.com/guide/getting-started.html https://github.com/asdf-vm/asdf-erlang https://github.com/asdf-vm/asdf-erlang https://github.com/asdf-vm/asdf-elixir https://github.com/asdf-vm/asdf-elixir Slightly more ceremony than curl | sh, but a good tool to have.
    - cassepipe 2y ago
      What does "support for Fedora" means in this context ?
      - xelamonster 2y ago
formo 2y ago
Congratulations!! The much awaited is finally here. With Liveview the network gap between the client and the server dissolves. It's just magical. Thank you Cris, Jose and the whole team for making the lives of developers easier.
sph 2y ago
Thank you Chris. Though it is clear that the similarity between Elixir and Ruby is only superficial, I cannot refrain from seeing your and José's work as a reflection and evolution of the work started with Ruby and Rails. Which includes the friendly community, the pragmatism to build solid software for people that need to ship, and the excellent stewardship of the Elixir and Phoenix projects. I'm a full time Elixir developer since 2016 and it's still my favourite programming environment. I've recently had a client notice how smooth the dashboard I threw together in an hour feels, and he doesn't know that I have not written a single line of Javascript to build it. Thank you!
d_sc 2y ago
Congrats to you and the rest of the team on the big milestone accomplishment. A very cool demo would be a retake on your “road to 2 million web socket connections” but now leveraging LiveView. URL: https://www.phoenixframework.org/blog/the-road-to-2-million-websocket-connections https://www.phoenixframework.org/blog/the-road-to-2-million-...
tiffanyh 2y ago
Hi Chris Many thanks for all the years of dedication to Phoenix and value you've given to developers around the world. OT: any thought about updating the 9-year old perf benchmark blog post? And is bandit now recommended over cowboy? https://www.phoenixframework.org/blog/the-road-to-2-million-websocket-connections https://www.phoenixframework.org/blog/the-road-to-2-million-...
- outlog 2y ago
  totally this! maybe a 10 anniversary thing next year..
- ricketycricket 2y ago
  Bandit is now the default in Phoenix.
pier25 2y ago
Congrats on the release Chris! What JS solution/approach would you recommend to use with LiveView for pure client-side stuff?
- pdimitar 2y ago
  I'm not Chris but people have reported success and very low friction when using HTMX.
  - pier25 2y ago
    HTMX is not really for pure client-side interactions. Usually people combine it with something like Alpine.
- sph 2y ago
  I use StimulusJS
kuatroka 2y ago
Thank you and the team for your hard work, and congratulations on the release! Suggestions for Demos: 1.Charting Libraries Integration There’s currently a lack of demos showcasing LiveView integrated with powerful charting libraries like Apache ECharts, Plot, Chart.js, etc. A demo of a LiveView-powered dashboard using one of these libraries, connected to a database like SQLite (for simplicity) or DuckDB (for speed and demonstrating integrations beyond Ecto-native DBs), would be fantastic. Emphasizes interactivity: For example, demonstrate how a server-based LiveView can handle actions such as mouse hover on a chart to update tooltips/labels, click-and-zoom interactions, or connected charts with brush functionality. 2.UI Component Libraries A demo showcasing robust integration with UI component libraries would also be valuable. Features like tables with pagination, sorting, filtering, and autocomplete/typeahead functionality within modals could be a strong focus. I’d suggest leveraging lightweight libraries like Flowbite or Preline, as they integrate seamlessly with Phoenix and rely on almost pure HTML and Tailwind for styling. For additional inspiration on speedy charting libraries, this resource might be useful: https://github.com/leeoniya/uPlot https://github.com/leeoniya/uPlot
xnx 2y ago
I wonder if it would be possible to make a Phoenix LiveView "Live" that runs in the browser for testing similar to Wordpress Playground: https://wordpress.org/playground/ https://wordpress.org/playground/

st3fan 2y ago

(Is it possible to add RSS to the blog? The articles are great but there is no good way to stay up to date.)

chrismccord 2y ago
Done! https://phoenixframework.org/feed https://phoenixframework.org/feed You can thank Steffen from the Phoenix team :)
- asa400 2y ago
  "Phoenix" is misspelled in the title of the Atom feed. Sorry for reporting this here, I looked for a repository to open a fix PR but couldn't find one, the previous Phoenix site repo is archived.

ashton314 2y ago

Congratulations Chris! I started using LiveView shortly after the beta was released. A few of my coworkers were really excited to try it out, so I was tasked with recreating our company's login page with LiveView. Needless to say, there were… ahem… growing pains—but it was super fun to encounter a problem and then just have it go away the following week because of some new update to LiveView. I don't do much (any?) web development these days, but LiveView gave me—a backend dev—the confidence to spin up my own web apps with classy UIs. Thank you so much for all your work!

goosejuice 2y ago

Congrats! Been running a startup off only liveview for about a year as a solo dev and it's been wonderful. Appreciate the work you all do. Selfish demo idea: Bi-directional cursor based infinite pagination with largish datasets with state managed in the url and streaming updates that change the order of the results. Like some kind of soft realtime leaderboard. With long render times (morphdom bench on large sets isn't great as far as I can tell) it's hard to escape the jank. Particularly on slow connections.

andrewmutz 2y ago
How much state is it safe to store in the URL these days?
- ljoshua 2y ago
  Still not much, realistically 4096 bytes or less. Browsers aren’t as much the issue as they’ve been in the past, but I’ve hit snags with proxies, old servers, etc.
  - ethbr1 2y ago
    How does pagination in urls work nowadays? You'd need ~3 bytes to index a reasonable number of pages naively, no? But curious what current art is re: performance optimizations between frontend and backend. Or is it simply page indices?
    - out_of_protocol 2y ago
      If you do limit/offset on database side, page number is enough. Though this doesn't work well for bigger page numbers. There's other ways to do pagination, e.g. with "cursors", where cursor is simply id of last record on previous page. SQL query is very efficient, but jumping to page X is impossible. In this scenario storing cursors for past pages is needed
      - cess11 2y ago

mike1o1 2y ago

Congrats on 1.0 and really appreciate all the work involved. One thing that I'd love to see is more demos around optimistic UI's. It's a lot of work, but Ryan Florence from Remix did a whole playlist [1] around recreating Trello in Remix. One video or demo in particular that had some functionality I'd love to see in LiveView (or demo on how to do it) is Optimistic UI and Optimistic Add and Drag and Drop (the last three videos in the playlist). 1. https://www.youtube.com/playlist?list=PLXoynULbYuED9b2k5LS44v9TQjfXifwNu https://www.youtube.com/playlist?list=PLXoynULbYuED9b2k5LS44...

7sidedmarble 2y ago
https://x.com/src_rip/status/1860081489486188812?t=S8QJBrmMOl0-l4ya4oVwBQ&s=19 https://x.com/src_rip/status/1860081489486188812?t=S8QJBrmMO...
chrismccord 2y ago
I need to polish the code, but here's more advanced optimistic UI example added to an existing demo app (TodoTrek). It uses recent LiveView features that allows any client code to hook into the full optimistic UI/server sync primitives that are built into LV: https://x.com/chris_mccord/status/1864160634394325038 https://x.com/chris_mccord/status/1864160634394325038
- arrowsmith 2y ago
  Very cool! Are those recent features documented anywhere? I can't find anything in the latest docs about hooking into LV's server sync primitives. Is this out in v1.0.0 or is it an upcoming feature?

AlchemistCamp 2y ago

I’ve been looking forward to this for a long time! Congrats to you and everyone else who made it happen!

BryanBryce 2y ago

I build 3 client projects in 3 months with Phoenix and Live View (and Ash!). Thank you so much!

sbrother 2y ago

Thank you for everything!! I've shipped quite a few successful apps to clients on Phoenix ever since the beginning, and am about to launch a startup on it. It's truly changed my career more than maybe any other library.

hiisukun 2y ago

Maybe this isn't the best place for feedback, but I was inspired to give this a go. Sadly it didn't work out. First error was: sh: line 1: Application: command not found By visiting https://new.phoenixframework.org/test-elixir-app https://new.phoenixframework.org/test-elixir-app, I could see the proper output: Application name must start with a letter and have only lowercase letters, numbers and underscore So I changed to test_elixir_app, and got this output: downloading https://github.com/elixir-lang/elixir/releases/download/v1.17.3/elixir-otp-27.zip fedora is not supported This was a spur of the moment thing, so maybe I'll try from an Ubuntu machine or something another time, but the friction was unfortunate. Grats on the launch though, the demo gif of using the project installer looked great.

chrismccord 2y ago
I will see if we can do something about fedora, but we now convert hyphens to underscores because I'm sure that will trip more folks up – thanks! For fedora, Elixir has instructions on their site: sudo dnf install elixir erlang https://elixir-lang.org/install.html https://elixir-lang.org/install.html I'd love to make it work for elixir install if we can though :)
- cess11 2y ago
  I generally recommend using ASDF to install Erlang/Elixir, it has support for Fedora. https://asdf-vm.com/guide/getting-started.html https://asdf-vm.com/guide/getting-started.html https://github.com/asdf-vm/asdf-erlang https://github.com/asdf-vm/asdf-erlang https://github.com/asdf-vm/asdf-elixir https://github.com/asdf-vm/asdf-elixir Slightly more ceremony than curl | sh, but a good tool to have.
  - cassepipe 2y ago
    What does "support for Fedora" means in this context ?
    - xelamonster 2y ago

formo 2y ago

Congratulations!! The much awaited is finally here. With Liveview the network gap between the client and the server dissolves. It's just magical. Thank you Cris, Jose and the whole team for making the lives of developers easier.

sph 2y ago

Thank you Chris. Though it is clear that the similarity between Elixir and Ruby is only superficial, I cannot refrain from seeing your and José's work as a reflection and evolution of the work started with Ruby and Rails. Which includes the friendly community, the pragmatism to build solid software for people that need to ship, and the excellent stewardship of the Elixir and Phoenix projects. I'm a full time Elixir developer since 2016 and it's still my favourite programming environment. I've recently had a client notice how smooth the dashboard I threw together in an hour feels, and he doesn't know that I have not written a single line of Javascript to build it. Thank you!

d_sc 2y ago

Congrats to you and the rest of the team on the big milestone accomplishment. A very cool demo would be a retake on your “road to 2 million web socket connections” but now leveraging LiveView. URL: https://www.phoenixframework.org/blog/the-road-to-2-million-websocket-connections https://www.phoenixframework.org/blog/the-road-to-2-million-...

tiffanyh 2y ago

Hi Chris Many thanks for all the years of dedication to Phoenix and value you've given to developers around the world. OT: any thought about updating the 9-year old perf benchmark blog post? And is bandit now recommended over cowboy? https://www.phoenixframework.org/blog/the-road-to-2-million-websocket-connections https://www.phoenixframework.org/blog/the-road-to-2-million-...

outlog 2y ago
totally this! maybe a 10 anniversary thing next year..
ricketycricket 2y ago
Bandit is now the default in Phoenix.

pier25 2y ago

Congrats on the release Chris! What JS solution/approach would you recommend to use with LiveView for pure client-side stuff?

pdimitar 2y ago
I'm not Chris but people have reported success and very low friction when using HTMX.
- pier25 2y ago
  HTMX is not really for pure client-side interactions. Usually people combine it with something like Alpine.
sph 2y ago
I use StimulusJS

kuatroka 2y ago

Thank you and the team for your hard work, and congratulations on the release! Suggestions for Demos: 1.Charting Libraries Integration There’s currently a lack of demos showcasing LiveView integrated with powerful charting libraries like Apache ECharts, Plot, Chart.js, etc. A demo of a LiveView-powered dashboard using one of these libraries, connected to a database like SQLite (for simplicity) or DuckDB (for speed and demonstrating integrations beyond Ecto-native DBs), would be fantastic. Emphasizes interactivity: For example, demonstrate how a server-based LiveView can handle actions such as mouse hover on a chart to update tooltips/labels, click-and-zoom interactions, or connected charts with brush functionality. 2.UI Component Libraries A demo showcasing robust integration with UI component libraries would also be valuable. Features like tables with pagination, sorting, filtering, and autocomplete/typeahead functionality within modals could be a strong focus. I’d suggest leveraging lightweight libraries like Flowbite or Preline, as they integrate seamlessly with Phoenix and rely on almost pure HTML and Tailwind for styling. For additional inspiration on speedy charting libraries, this resource might be useful: https://github.com/leeoniya/uPlot https://github.com/leeoniya/uPlot

xnx 2y ago

I wonder if it would be possible to make a Phoenix LiveView "Live" that runs in the browser for testing similar to Wordpress Playground: https://wordpress.org/playground/ https://wordpress.org/playground/