Screencast

13. CSV Export with Phoenix and LiveView

csv liveview dropdown

In this tutorial, I explore how to add CSV export functionality to an Elixir Phoenix application using LiveView. CSV, or Comma Separated Values, is a simple file format that's widely used for data import and export across various tools and applications.

I'll show you how to add an export button to your table of breweries. When you click the button, a dropdown opens, allowing you to pick the attributes to export in the CSV. Once confirmed, the request is posted, and your browser receives the downloaded CSV file.

The goal is to make a fully functional, reusable CSV export feature that's easy to implement in your own Phoenix application. We'll go through adding the CSV library dependency, fetching dependencies, creating the Export Controller, adding the export route, and updating the LiveView template with a dropdown form.

By the end of this tutorial, you'll see how straightforward it is to create a CSV export feature that allows users to customize their data downloads. Feel free to tweak the implementation to fit your specific needs or extend it with additional features like filters or pagination.

In a future video, I'll go through how you can do CSV import with Phoenix LiveView file upload so you can preview and import data into your system.