Elixir, Phoenix, and Javascript

Using alpine.js' x-data attribute in HEEx templates

September 21, 2021

Phoenix LiveView 0.16 introduces a new HTML engine called HEEx with many improvements over the existing LiveView EEx engine. However, HEEx uses a new interpolation syntax for HTML attributes that complicates the use of Alpine.js

Asset handling in Phoenix 1.6

August 30, 2021

Phoenix 1.6 replaces Webpack with Esbuild. This changes the way that static assets other than js and css are handled in the build pipeline

Testing Logger in Phoenix

June 10, 2021

ExUnit has a capture_log function that can be used in tests to create assertions on Logger output. This article shows you how to use it, and how you can remove unwanted log output from the test console.

Static Assets with Phoenix LiveView

June 6, 2021

Phoenix LiveView can improve user experience by providing a dynamic, bandwidth-efficient user interface. However, it can be difficult to ensure that all users apply application updates at the same time since connections can persist for a long time.

Beware Cloudflare

May 10, 2021

A few weeks after we launched a new website, Google began dropping our pages from its index. Turned out the problem had to do with a recycled IP address and someone else's Cloudflare setup.

Opting out from FLoC in Phoenix

April 22, 2021

FLoC is a user tracking technology that is being rolled out in Chrome. Website owners can request that visits to their site not be tracked by setting a response header. In this article we show how this can be done in Phoenix.

Favicons in Phoenix

March 30, 2021 (Updated May 20, 2021)

Custom favicons are a nice finishing touch on your website or web app. This article takes you through the process of generating favicons from an image file with realfavicongenerator and using them in Phoenix.

Dynamic Sitemaps in Phoenix

March 24, 2021

Sitemaps, while not required, can be useful for helping search engines crawl your website. This is especially true for new websites and for websites with few internal links. We take a look at how you can create a dynamic XML sitemap in Phoenix.

Working with Time Zones

January 23, 2020 (Updated March 19, 2021)

A look at the differences between Elixir's NaiveDateTime and DateTime types. Which one should you be using, and what are the pitfalls?