DuckDB in Astro

David Gasquez January 3, 2025
Source
Wanted to play with the new DuckDB Node Neo library and thought it would be interesting to see if I could make it work in Astro. Astro supports MDX, so I thought it would be a good fit. The query will be executed at build time and data rendered into a plain HTML file (no JS). Very useful to reference remote datasets (e.g: doing dashboards) while keeping things minimal. Let's see how it works! The first thing I did was to install the DuckDB Node Neo library. Then I created a new component called DuckDBQuery.astro that would take a query as a prop and execute it using the DuckDB Node Neo library. The component creates a DuckDB instance, connects to it, runs the query, and then displays the results in a poorly formatted table. Now, I can use the component in an MDX file. That's it! For example, let's run a query to get the total price for each customer for the orders.parquet file that DuckDB provides. import DuckDBQuery from "../../components/DuckDBQuery.astro"; Rudimentary, but it works and is quite minimal. A similar pattern can be done at the Astro Content Collection level to generate a page for each row of the dataset. E.g: get a list of countries, and build a page for each country with their stats from datasets like the World Development Indicators. Thoughs, ideas, feedback? Reach out!

Discussion in the ATmosphere

Loading comments...