Jonolist

displaying tables with datasets from Google Sheets

// updated 2025-10-17 11:36

I thought about stepping aside from all the React and Next.js stuff to have a look at another, simpler JavaScript framework called Alpine.js! Instead of building a throw-away "to-do list app", I thought about creating a "keep-on-doing list app"!

This app would have the following features:

  • pull data from Google sheets
    • this will make a tab-separated values (.TSV) file
    • the code will then parse the TSV file
    • dynamic features written with Alpine.js will then...
  • allow the user to view the data from a webpage
    • allow sorting and searching of data (especially long lists)
  • allow the user to look through many different datasets
  • put the different datasets into a library of datasets (i.e. a "list of lists")

So, the end result is now open-source on GitHub (project notes) and deployed on GitHub pages!

Much credit for this app goes to Zulfikar Ditya's blog post which got me started with Alpine.js!

⬅️ older (in projects)
📰 Jononews
⬅️ older (in code)
🏔️ Using x-ref in Alpine.js
⬅️ older (posts)
💻 Rewriting internet URLs (a pipe dream)