In this post, we'll build out a LiveView chatroom app with the help of LiveView's new streams feature. You can follow along in the open source codebase or skip ahead to play around with the finished product. We'll see how streams seamlessly integr...
In previous posts, Nolan showed us some ways to improve accessibility in existing web applications using the Phoenix real-time social music app LiveBeats as an example. But what if we could integrate accessibility practices into our app developm...
I've had my fair share of bug reports over the ~10 year life of maintaining Phoenix. Most are mundane Elixir tweaks, or wrangling some JavaScript issues. The core of Phoenix has been baked for years now, so color me surprised when I found myself s...
When building web applications we accept user uploaded images and later want to use them as in our applications. This leads to many questions: What format will their device upload? Which format do we accept? Which format do we use? How many byt...
Elixir has powerful built in scripting functionality, allowing us to write Elixir to a file—say my_script.exs— and execute it directly by elixir my_script.exs. The vast majority of production Elixir projects will be directly compiled via mix with ...
This is the first installment of the Phoenix development blog where we'll talk about in progress features or day-to-day development updates in between major releases and milestones. What's the Problem?For at least a few years, the Phoenix team ha...
In our last post we saw an example of how we could use the built-in Full Text Search capability, FTS5, of SQLite3 to create a search index and query it with Ecto. We also know it's fast to query and especially so since it is in memory. Let's see h...
Here's a quick recipe. Say your LiveView needs to show something based on the device your user is on such as Mac or Windows. You can parse that from your User Agent header, in fact LiveView already gives you a simple method for that: get_connect_i...
UPDATED: This was updated to support clearing a list of tags. The underlying tag functions were updated and a hidden input ensures a value is passed. See the updated gist as well. Phoenix 1.7.0 brings a lot of new things when we run mix phx.gen my...
Custom Styling With LiveView Function Component Attributes
ProblemYou're writing a new function component that has default styling. You've defined default CSS classes in the component's template, but you want it to have the flexibility to add a few others when calling the function. How can we give a comp...
One of the benefits of SQLite is that you can query lightning quick because your database is colocated next to your server. And a bonus it also comes with built-in Full Text search capabilities! But how does this work with Ecto? In this Series we ...
UPDATED: This was updated to support clearing a list of tags from a UI input component. Whether you link labels to a Github issue, track the different muscle groups strengthened by an exercise, or describe a book by the set of genres that apply to...