Bibliotheca

About This Project

Bibliotheca: A Personal Digital Library Manager The Story Behind It I love reading books. Like, really love them. My shelves are packed with novels, non-fiction, Kurdish literature, English classics—you name it. But here's the problem: I kept losing track of what I owned. I'd be at a bookstore, see a book I liked, and have no idea if I already had it at home. I'd start reading something only to realize I'd abandoned it months ago. I tried using Goodreads, but it felt cluttered and ad-heavy. Notion was too generic. I needed something simple, beautiful, and built specifically for managing my personal library. So I built Bibliotheca—a web app that helps me catalog my books, track what I'm reading, and organize everything in one elegant place. And because I wanted to access it everywhere (even on flights with no internet), I made it work completely offline as a Progressive Web App. The project is still in active development. The core features work great and I use it daily, but I'm continuously adding improvements and new capabilities as I discover what I need. --- What It Does Managing My Book Collection At its heart, Bibliotheca is a digital catalog of every book I own. Each book has: - Title and author (obviously) - Cover photo that I upload and crop to look perfect - Descriptions (short and long) so I remember what it's about - Genre and language for organizing - Publication date - Reading status - and this is the key part The status system has four states: - 📖 Reading - Books I'm currently working through - ✅ Completed - Books I've finished - 📚 To Read - My wishlist of books I want to read - ❌ Abandoned - Books I started but decided not to finish (hey, it happens) Each status gets its own color-coded badge, so when I'm browsing my library, I can instantly see what's what. The interface shows books in a responsive grid—2 columns on my phone, up to 6 columns on my desktop. It adapts beautifully to whatever device I'm using. Author Profiles Every author in my collection gets their own profile page. I can add their photo, write a biography, include birth/death dates, and the system automatically counts how many of their books I own. When I'm adding a new book, I can quickly select from my existing authors or create a new author profile on the fly. This is especially useful for authors I collect heavily—I can see at a glance that I own 12 Murakami books or 8 books by Bachtyar Ali (a Kurdish novelist I love). The Dashboard - My Reading at a Glance When I open the app, the dashboard shows me: - Total books in my library - Total authors I've cataloged - My completion rate (what percentage of books I've actually finished) - How many books I'm currently reading - My 6 most recent additions - The 6 authors I've added most recently - Reading progress for everything I'm currently working through It's like a snapshot of my reading life. I can see immediately if I'm accumulating books faster than I'm reading them (guilty), or if I need to add more to my to-read list. Kurdish Language Support Here's something personal that makes this project special to me: I read books in both English and Kurdish (specifically Kurdish-Sorani). These languages are completely different—English reads left-to-right, Kurdish reads right-to-left, and they need different fonts to display properly.I can have Kurdish and English books side by side, each rendering correctly. Works Completely Offline This was non-negotiable for me. I wanted to browse my library on airplanes, in areas with bad internet, anywhere. So I built it as a Progressive Web App with aggressive offline caching. When I open the app, it downloads and caches everything: book covers, author photos, all my data. The next time I open it (even with zero internet), everything loads instantly from the cache. I can browse my entire library, view book details, see author pages—all without connectivity. If I'm online, it updates the cache in the background so I always have fresh data. If I'm offline, I work with what's cached (which is usually everything I need). The app also installs on my phone's home screen like a native app, with quick shortcuts to add books, browse my library, or check authors. Image Handling When I add a book, I upload a photo of the cover (usually a quick snap from my phone or a downloaded image). The app lets me crop it to the standard book cover ratio (2:3) so everything looks consistent in my library. Behind the scenes, it's also shrinking the image down and compressing it. My phone takes 5MB photos, but the app reduces them to about 300KB without losing visible quality. This makes uploads fast, saves storage space, and keeps the app snappy. Same goes for author photos and my profile picture—upload, crop, done. The Technology Choices I built this with modern web technologies that let me move fast while keeping everything maintainable: Frontend: I used Nuxt 3 (a framework built on Vue.js) with TypeScript. Nuxt handles routing automatically based on my file structure, which saves tons of boilerplate. TypeScript catches bugs before they happen by checking types at compile time. Backend: Instead of building a separate backend server, I used Appwrite—a "backend-as-a-service" that provides user authentication, a database, and file storage without me managing servers. It's like Firebase but open-source and privacy-focused. I just call their API from my Nuxt server routes. Styling: Tailwind CSS for all the styling. It's utility-first, meaning I compose styles directly in my HTML using classes like bg-black and text-gold. I extended it with custom colors and animations for the luxury theme. PWA Magic: The @vite-pwa/nuxt plugin handles all the service worker stuff for offline functionality. I configured different caching strategies for different content—images cache for 120 days, API data for 2 hours, etc. State Management: Pinia for managing global state (like the list of authors). It's the modern replacement for Vuex and works beautifully with TypeScript. Testing: I wrote tests with Vitest (unit tests) and Playwright (end-to-end tests) to make sure features don't break as I add new stuff. Everything is type-safe from front to back. The database returns documents, I define TypeScript interfaces for them, and then I get autocomplete and error checking everywhere. Why This Project Matters to Me Bibliotheca isn't just a portfolio piece—it's a tool I genuinely use and need. Every time I finish a book, I open it and mark the book as completed. When I buy a new book, I photograph the cover and add it to my library. The dashboard shows me I'm currently reading 4 books and have completed 67% of the books I own (which honestly motivates me to read faster). It's also deeply personal in ways that other projects aren't. The Kurdish language support exists because I read in Kurdish. The offline functionality exists because I travel and want my library with me. The luxury design exists because I think books deserve to be treated with reverence. From a technical perspective, it demonstrates everything I care about in software development: - User-focused design - solving a real problem for real people (starting with myself) - Modern architecture - leveraging the latest frameworks and tools - Type safety - using TypeScript to catch bugs early - Performance - optimizing images, caching aggressively, splitting bundles - Security - implementing proper authentication and authorization - Accessibility - responsive design, proper touch targets, semantic HTML - Testing - writing tests to ensure quality - Progressive enhancement - works offline, installs as an app, but also works in any browser It's a project that will grow with me as my library grows, and that's exactly what makes it special. --- Built with: Nuxt 3, Vue 3, TypeScript, Tailwind CSS, Appwrite, PWA Status: Active development • Core features complete • Continuous improvements --- A passion project for book lovers, by a book lover.