Building Book Bros Book Club: How a Christmas Gift Became a Full-Stack Reading Tracker

This past Christmas, I wanted to do something book-related for my brother-in-law and our friend, because we frequently talk about what we're reading. We've got an ongoing group chat where we swap recommendations, debate over literary choices, and occasionally roast each other's reading pace. So I thought: what if we had a place to actually track all of this?

That's how Book Bros Book Club was born.

The Idea: More Than Just a Gift

The initial spark was definitely Christmas-driven—I needed a thoughtful gift that wasn't just another book or gift card. But the more I thought about it, the more I realized we'd actually benefit from having a shared space to:

• Track our reading progress through 2026
• See what each other is reading in real-time
• Share our top ten favorite books
• Write actual book reports (yes, like high school, but voluntarily)
• Pick a rotating "Book of the Month"

We'd been talking about reading challenges and book recommendations casually, but there was no central place for it all. So I decided to build one.

The Tech Stack: Choosing What I Could Vibe Code With

I'm still learning to code—I'm comfortable with HTML and CSS, have some JavaScript experience, and I've dabbled in React and Angular. But I'm not a full-time developer. So I knew I needed tools that would let me vibe code my way through this project—describe what I want, have Claude (or other AI tools) generate the code, and iterate quickly.

Here's what I landed on:

• Next.js 16 with the App Router and Turbopack for fast development
• TypeScript because type safety saves headaches later
• Material UI for a component library that looks professional out of the box
• Supabase for PostgreSQL database, authentication, and file storage (book covers!)
• Open Library API for book search and metadata, with Google Books API as a fallback
• Vercel for hosting and deployment (because it Just Works™)

The beauty of this stack? It's modern, well-documented, and AI assistants know how to work with it. That meant I could focus on what I wanted to build instead of getting stuck on how to wire everything together.

The Build: A Month of Iterative Vibe Coding

I spent about a month working on this, mostly in the evenings after work. My process looked like this:

1. Sketch the feature in my head or on paper
2. Describe it to Claude in natural language
3. Review and test the generated code
4. Iterate based on what worked (or didn't)
5. Get feedback from my brother-in-law and friend in our group chat
6. Refine based on their suggestions

This is where my PM and UX design skills from my day job at CVS really came in handy. I knew how to break down features into small, testable pieces. I knew how to ask the right questions during feedback sessions. And I knew how to prioritize—what needed to be in the MVP versus what could come later.

The Hardest Part: The Reading Challenge Tracker

The reading challenge feature was probably the trickiest to get right. We wanted to track:

• Each member's progress toward our goal of 26 books in 2026
• Visual progress bars that updated dynamically
• The ability to mark books as "finished" and see them count toward the total
• A leaderboard vibe without making it too competitive

Getting the data model right in Supabase, syncing it with the UI, and making sure the progress calculations were accurate took a few iterations. But the vibe coding process was great here—I'd describe the logic I wanted, Claude would generate the implementation, and I'd test it. When something didn't work, I'd explain the issue and get a revised version.

It felt less like traditional coding and more like collaborative problem-solving.

The Features: What We Actually Built

Here's what made it into the live site at bookbrosbookclub.com:

📚 Reading Challenge

Track who's read the most books in 2026, with progress bars, book counts, and a friendly competitive edge.

🏆 Top Tens

Drag-and-drop ranked lists of our favorite books. This was surprisingly fun to implement—watching the rankings update in real-time as you reorder them is oddly satisfying.

📖 Libraries

Personal book collections where we can rate books, add comments, and tag them by genre. Each member has their own library that grows over time.

✍️ Book Reports

Because why should kids have all the fun? We write full reviews with rich text formatting, word counts, and estimated reading times.

📅 Book of the Month

A rotating system where we take turns picking the monthly read. The page shows the current pick with a summary and who chose it.

👤 Profiles

Member pages with reading stats, currently reading lists, and wishlists. It's like a Goodreads profile, but just for us three.

🔍 Smart Book Search

This was a fun technical challenge. The search detects author names, handles deduplication when the same book appears in multiple APIs, and falls back to Google Books if Open Library doesn't have a cover image.

Accessibility Wasn't an Afterthought

One thing I'm particularly proud of: the site is built with accessibility in mind from the start. As a UX professional, I know how often accessibility gets tacked on at the end (or forgotten entirely). I didn't want that here.

The site includes:

• Skip links to jump straight to main content
• ARIA labels for screen readers
• Full keyboard navigation for every interactive element
• Proper heading hierarchy for assistive technology
• High contrast ratios that meet WCAG 2.1 AA standards

I ran accessibility audits throughout the build and made sure the site worked with keyboard-only navigation and screen readers. It wasn't hard—it just required thinking about it during development instead of after.

Working With Friends: The Feedback Loop

One of the best parts of this project was the collaborative process. My brother-in-law and friend weren't just passive recipients of a Christmas gift—they were active participants in shaping what it became.

I'd push updates to the live site on Vercel, drop a link in our group chat, and they'd respond with:

• "The drag-and-drop on Top Tens feels great"
• "Can we add a 'Currently Reading' section to profiles?"
• "The book search is finding weird editions—can we filter by year?"

Their feedback was honest, specific, and genuinely helpful. It turned the project from something I was building for them into something we were building together. And because I was wearing my PM hat, I knew how to triage their suggestions—what could go into the current sprint, what needed more discovery, and what would be a great V2 feature.

What I Learned

Building Book Bros taught me a few things:

1. Vibe Coding is Real (and Powerful)

I built a full-stack app with auth, database operations, file storage, and API integrations—all while still learning. AI-assisted development made that possible. I wasn't just copying Stack Overflow snippets; I was having conversations about what I wanted and getting implementations I could understand and modify.

2. Constraints Are Clarifying

We could have added comments, social sharing, reading streaks, badges, and a dozen other features. But we didn't—at least not yet. Focusing on the MVP meant we got to a working site faster and could actually start using it instead of endlessly tweaking it.

3. Building for Friends Is Different

There's less pressure in some ways (they won't roast me for bugs... much), but more in others (I actually care that they like it). The feedback loop was faster and more honest than any user testing session I've run at work.

4. Accessibility Is Easier Than You Think

It doesn't take much extra effort to build accessible sites if you think about it from the start. Add semantic HTML, use proper labels, test with a keyboard. That's 80% of it.

What's Next?

The site is live, we're using it, and it's genuinely become part of how we engage with reading. We've already logged dozens of books, written a few reports, and had our first Book of the Month rotation.

But there are features I'm already thinking about for V2:

• Activity Feed: A timeline showing recent books finished, reports published, and Top Ten updates
• Reading Streaks: Gamification lite—badges for consecutive weeks with a finished book
• Book Recommendations Engine: We have a recommendations table in the database but haven't surfaced it yet
• Discussion Threads: Lightweight comments per book for async conversation
• Year-in-Review: An end-of-year stats dashboard with total pages read, favorite genres, and reading pace

Try It Yourself

The code is open source on GitHub, and the site is live at bookbrosbookclub.com. If you're in a book club—or just a group of friends who read—feel free to fork it, modify it, or use it as inspiration for your own version.

And if you're new to coding or feel like you're "not technical enough" to build something like this? I'd argue you probably are. You just need the right tools, a clear goal, and maybe an AI assistant to help you along the way.

---

Built with ❤️ (and a lot of vibe coding)