Screencast

18. Fuzzy Find with Ecto & Phoenix LiveView

ecto liveview pgtrm search typeahead

In the previous video, we made a typeahead where a user could search the database for a list of breweries using a simple 'I-LIKE' search. However, that only matches exactly what you type. You might have noticed that searching for 'Alpine' works, but 'ale' or 'brewery' doesn't return any results. In this video, we'll improve the search functionality so it can find parts of the full brewery name and even handle misspellings.

We'll start by adding a migration to enable a PostgreSQL extension for fuzzy matching. This extension allows for similarity-based text searches using trigram matching, providing functions like similarity() and operators like % to determine how similar two strings are. We'll modify our Ecto queries to utilize these functions, splitting the brewery names into arrays and performing similarity searches on each word. We'll also discuss setting similarity thresholds and ordering results based on their similarity scores.

Finally, we'll test the improved search functionality, demonstrating how typing letters like 'b', 'r', and 'w' now effectively finds titles that include those letters and displays them in the dropdown list. We'll also implement a live filter on top of a table using Phoenix LiveView, allowing for real-time search as the user types. By the end of this tutorial, you'll have a more flexible and robust search feature that provides a smoother user experience in your Elixir applications.