Ed Millington

Front-end developer

Virtual Bookshelf (Vue)

The Virtual Bookshelf comes in two flavours: Vue & React

What is this?

This is a list of all the books that I've read since 2021, with filters for format, genre and year.

Why is it here?

It's fun to keep track of the books I've read, and I'm not a member of Goodreads,* so... here's where they live!

* other social reading platforms are available

How did you build it?

I'm glad you asked! This version of my virtual bookshelf is a Vue 3 + TypeScript app, built using the Composition API (I also built a React version, which you can find here).

The data is managed on a private Wordpress instance ("books" are a custom post type, and I'm using WP taxonomies for the filters).

I grab the books, and the options for my filters, via GraphQL. These are saved and managed in stores defined using Pinia.

The app also makes use of a simple, custom-built cache, which saves the results of each GraphQL call to local storage.

I built the app with accessibility, extendability and code simplicity in mind. If you're interested, you can click here to view the source code.