All projects

Local web app · in progress

Estante virtual

A shelf of books and manga that runs on your computer. Each volume is a spine drawn in CSS, in the colours of its own cover; clicking it opens a panel with the cover, details, reading status, progress, rating and notes.

No account, no cloud, no database: everything lives in local files. The Shelf on this site uses the same book format.

JavaScript · Node.js · Express · sharp · MangaDex API

github.com/wtuxen/estante_virtual

What it does

Spines
Background and accent colours are taken from the cover. Height follows the format (pocket, tankōbon, trade, hardcover, artbook) and width the page count. Manga show the volume number at the foot.
Series
One volume per spine, like a real shelf, with volumes of a series sharing a colour. In series mode each one becomes a box, with overall progress and a grid of covers.
Reading
Status (unread, reading, read, dropped), pages read, a rating from 1 to 5 and notes that save themselves. Search, status filter and sorting keep series together.
Import
Books come from Markdown files with Google Books fields; manga from the MyAnimeList export, with covers and titles fetched from MangaDex.

How the data is kept

Two files, joined by id. The catalogue (titles, authors, covers, colours) is generated by the import and can be rebuilt at any time. The state (status, pages, ratings, dates and notes) is written only by the app, and is the one that cannot be lost: it is saved atomically, through a temporary file and a rename, and if it is ever corrupted the server refuses to overwrite it. Re-importing the catalogue never erases a note.

Decisions

  • No build step: the interface is plain HTML, CSS and JavaScript, served by a small Express server that only listens on 127.0.0.1.
  • Changes go to the server one at a time, in order, with a debounce on notes and a retry on failure. A retry never sends an old value over a newer one.
  • Seeding the reading history from MyAnimeList only fills empty fields, so it can run again without undoing what was edited on the shelf. Progress kept only in chapters becomes volumes through MangaDex's chapter map.
  • The import respects MangaDex's rate limit, sends its own User-Agent and downloads covers locally instead of hotlinking them.