I also brought READ OR DIE to life. This project was the shopping list project that I made. It was no regular shopping list, and it was making another dream come true. I hope I will not faint while trying to write this....
Anyway, here is my README.md:
📚 British Library Special Operations: Acquisition Spree (Fan Project)
TOP SECRET // DIV. A
Codename: "The Paper"
An elite, classified web application built to track and catalog rare volume targets and reading sprees. Inspired by the classic anime and manga series Read or Die (R.O.D.), this project is a fan-made tribute built with vanilla JavaScript and persistent local archiving.
I made this project, because I realised that I had missing a repository from back when I did the lists, and I wanted to incorporate a project of my own. While I pondered long and hard, what kind of shopping list I could make, one of the things that came to my mind was a book shopping list, which led to associating it with things like anime where characters compulsively buy books, which led to READ OR DIE- one of my favourite anime ever!! How envy them! It has always been my dream to have all the books that they have! I wish I could have a place, and have it all covered by books ust like the protagonist does!
Please, for all purposes, treat this project as for what it is: a form of fanart, as a project.
The author of READ OR DIE is Hideyuki Kurata.
🎯 Operational Features
Classified Dossier UI: Imposing typewriter typography (Special Elite and Courier Prime), custom parchment textures, and bureaucratic security stamp aesthetics inspired by Read or Die.
Dynamic Acquisition Input: Type any target manuscript or rare book title into the field and immediately log it into the Division's target inventory.
Persistent Local Storage: Utilizes the Web Storage API (localStorage) so your acquisition targets remain securely cataloged even after closing the browser or refreshing the page.
Interactive Status Control: Click any volume to toggle its acquisition/reading status (complete with archival strikethrough styling), or purge the archive entirely when the mission is complete.
🛠️ Technologies Used
HTML5: Semantic document structure representing the classified target dossier.
CSS3: Custom styling, flexbox layouts, variable color tokens, and Google Fonts integration (Special Elite & Courier Prime) for the authentic typewriter aesthetic.
JavaScript (ES6+): DOM manipulation, event listeners, array state management, and localStorage integration.
🚀 Quick Start / Local Deployment
To run this operational tool locally on your machine:
Clone or download this repository to your local machine.
Ensure the following three files are in the same directory:
index.html
style.css
script.js
Double-click index.html or open it directly in any modern web browser to begin your acquisition spree.
⚖️ Disclaimer
Read or Die (R.O.D.) and its characters (including Yomiko Readman) are the intellectual property of Hideyuki Kurata, Shueisha, Aniplex, and other respective copyright holders. This project is a non-commercial, fan-made web application created purely for learning, portfolio display, and as a tribute to the series. No copyright infringement intended.
Authorized for Division A personnel only. Unauthorized distribution will result in immediate intervention by Yomiko Readman. Just kidding~
Check it out here: https://labrava0x.github.io/read-or-die-shopping-list/
Top comments (0)