Articles by Tag #liveview
Browse our collection of articles on various topics related to IT technologies. Dive in and explore something new!
AI powered app (with open-source LLMs like Llama) with Elixir, Phoenix, LiveView, and TogetherAI
Ever wanted to raise millions of $ by adding "AI" to your company name; and you happen to want to...
WYSIWYG editor in LiveView with embedded images that are uploaded to S3 bucket
In this tutorial, you will learn how to create WYSIWYG editor with image insertion (+ auto upload to...
Phoenix LiveView Optimization Guide
Intro Phoenix LiveView is very attractive for real-time & rich interactive web app. I...
Bridging the Gap: Simplifying Live Component Invocation in Phoenix LiveView
Inspired by a conversation on Bsky (Thanks Netto) about the release of Phoenix LiveView 1.0. The...
Optimize LiveView Performance with Temporary Assigns
When working with Phoenix LiveView, you often juggle a lot of data while building interactive,...
Automatically clearing flash messages in Phoenix LiveView
Phoenix LiveView is an awesome and elegant way to create web apps with a simple stack. Its generators...
Phoenix LiveView is slot empty?
Here's a simple function to check if the slot is empty, where empty can mean. No slot provided Slot...
Tooltips in Phoenix LiveView
There are a few options to integrate tooltip functionality into Phoenix LiveView. This article covers...
Phoenix LiveView, hooks and push_event: json_view
Phoenix LiveView is a powerful framework built on Elixir, and offers an innovative approach to...
Offline first LiveView as PWA
About this demo app An example of a real-time, collaborative multi-page web app built with...
Build a small chat service using Elixir and deploy it on Amazon ec2 using AWS (Last part)
Introduction In Part 2, we covered the implementation of chat functionality with LiveView,...
Efficient Rendering in Phoenix LiveView with Streams and Dynamic Data
One of the biggest shifts developers face when building real-world apps with Phoenix LiveView is how...
Better LiveView Hooks with Typescript
Ok so sometimes you need typescript for your hooks. And then basically you need to type every single...
Weather API: A GenServer and LiveView Implementation Part I
The code for this project can be found here: https://github.com/shwncndn/garden Inspired by and...
🚀 Auto-Clearing Flash Messages in Phoenix LiveView (with a Visual Countdown!)
LiveView gives us beautiful declarative ways to build interactive UIs without writing much JS. But...
Debug and visualise TailwindCSS document structure
Thanks to this repo: https://github.com/jeroengerits/tailwind-debug-mode, you can visualise the...
LiveView Hack for the usual issue of slow network being a amjor bottleneck in LiveView arhitecture.
Network optimization (4x WS message size reduction) for sending...
Cleaner LiveView Pipes
I like my pipes and i like em clean! @impl LiveView def mount(%{"edition" => id}, _session,...
Build a small chat service using Elixir and deploy it on Amazon ec2 using AWS (Part 2)
Introduction At Part 1, we explored how to implement the database for our chat service. In...
Building an Interactive Tag Input Component with Phoenix LiveView
I've been exploring ways to create reusable UI components with Elixir and Phoenix LiveView. Here's my...
Phoenix LiveView, nested .inputs_for
TIL: You can nest .inputs_for in Phoenix LiveView forms to make inputs visually coherent. Note: This...
Build a small chat service using Elixir and deploy it on Amazon ec2 using AWS (Part 1)
Introduction Let's build a distributed chat service application using Elixir. It will be a...