Displaying User's Local Time in Phoenix LiveView Applications

10
clicks
Displaying User's Local Time in Phoenix LiveView Applications

Source: dockyard.com

Type: Post

The article explains how to implement a clock in a Phoenix LiveView application that shows the current time in the user's local time zone. It begins by outlining the hurdles of server-side Elixir code running in UTC and how to overcome this with a time zone library. The author details the installation process for the 'tz' dependency to handle time zones, and how to use JavaScript to detect the user's time zone through the 'Intl.DateTimeFormat().resolvedOptions().timeZone' function. By fetching the user's time zone during the LiveView mount and adjusting the displayed time accordingly, the clock can reflect the correct local time for the user. The implementation is simple and effective for this application, with hints for more dynamic settings in future content.

© HashMerge 2025