Coding Challenge #109 - Ebook Reader
This challenge is to build your own ebook reader.
Hi this is John with this week’s Coding Challenge.
🙏 Thank you for being a subscriber, I’m honoured to have you as a reader. 🎉
If there is a Coding Challenge you’d like to see, please let me know by replying to this email📧
Coding Challenge #19 - Ebook Reader
This challenge is to build your own ebook reader application.
EPUB is the most widely used open standard for digital books. Unlike proprietary formats, EPUB is built on web technologies you probably already know; XHTML for content, CSS for styling, and a ZIP container to package it all together. Almost every ebook outside the Amazon Kindle ecosystem uses it. By building an EPUB reader, you’ll work with file format parsing, content rendering, text processing, and UI design all in one project.
But first, many thanks to this week’s sponsor, Unblocked.
Give your agents the understanding they need to generate reliable code, reviews, and answers. Unblocked builds context from your team’s code, PR history, conversations, documentation, planning tools, and runtime signals. It surfaces the insights that matter so AI outputs reflect how your system actually works.
“Unblocked has reversed my AI fatigue completely. The level of precision is wild.” - Senior developer, Clio
The Challenge - Building Your Own EBook Reader
In this coding challenge you’ll build an ebook reader that can open and display EPUB files, manage a library of books, and provide a comfortable reading experience with features like annotations, dictionary lookups, and customisable themes. By the end, you’ll have a fully functional reader that works with any standard EPUB file.
This is an advanced challenge that covers file format parsing, content rendering, persistent storage, and building a polished user interface. Choose a platform and tech stack that gives you good tools for displaying rich text content.
Step Zero
Set up your development environment and get some EPUB files to work with.
Pick a platform for your reader. It could be desktop, web, or mobile. Then a tech stack you’re comfortable building user interfaces with. You’ll need to handle ZIP archives, parse documents, render styled text, and build interactive UI elements, so make sure your chosen stack has good support for these.
For test content, grab a few free EPUB files from Project Gutenberg or Standard Ebooks. Standard Ebooks is particularly good because their files are well-formatted EPUB 3 files with proper styling. Get at least three or four books of different lengths so you can test properly throughout the challenge.
Step 1
In this step your goal is to open an EPUB file and display its content for reading. The EPUB file format is documented on the W3 website.
An EPUB file is a ZIP archive containing XHTML content files, a CSS stylesheet, metadata, and a manifest that describes how everything fits together. Your reader needs to unpack this structure, understand the reading order from the manifest, and render each chapter as readable, styled text that you can scroll or page through.
You should be able to open an EPUB, see the book’s title and author, navigate between chapters using a table of contents, and read the content with the book’s own styling applied. The text should reflow cleanly when you resize the window.
Testing guidance: Open one of your Project Gutenberg or Standard Ebooks files and verify you can read the full book from start to finish. Check that the table of contents works and that you can jump to any chapter. Try resizing the window and confirm the text reflows without breaking. Open a second, different book to make sure you’re not accidentally hardcoding anything specific to one file.
Step 2
In this step your goal is to manage a collection of ebooks and search across them.
Rather than opening one file at a time, your reader should maintain a library. Users should be able to import books, see them organised with their cover images and metadata (title, author, language), and sort or filter the collection. Creating a full-text search is where this gets interesting, index the actual content of every book in the library so users can search for a quote or topic and find it across all their books.
Testing guidance: Import your collection of test EPUBs into the library. Verify that metadata displays correctly for each book. Search for a word or phrase you know appears in one of the books and confirm the search returns the right results with the book title and location in the text. Search for something that appears in multiple books and check that all matches are found. Try sorting and filtering the library by different criteria.
Step 3
In this step your goal is to give readers control over how their books look.
A good ebook reader lets you adjust fonts, font sizes, colours, margins, line spacing, and background colour. You’ll need a theming system that overrides the book’s built-in stylesheets without breaking them, applying user preferences on top of the author’s intended styling. Support at least light and dark themes, and let users adjust the core typography settings.
Testing guidance: Open a book and switch between your light and dark themes. Verify the text remains readable in each. Change the font, font size, and line spacing and confirm the content reflows properly. Close the book and reopen it, your settings should persist. Open a different book with its own stylesheet and check that your theme still applies cleanly without breaking the book’s formatting (bold text, italics, headings should all still look right).
Step 4
In this step your goal is to build a layer on top of the rendered text that supports highlights, bookmarks, and notes.
Users should be able to select text and highlight it in different colours, attach written notes to any highlighted passage, and set bookmarks to return to later. All annotations need to persist — when you close the book and reopen it, everything should still be there in the right place. The tricky part is that EPUB text is reflowable, so your annotations need to be anchored to the text itself, not to a position on the screen.
Testing guidance: Open a book, highlight several passages in different colours, and add notes to a couple of them. Set a few bookmarks. Close the book completely and reopen it — all your annotations should be exactly where you left them. Change the font size or window width to reflow the text and verify annotations stay attached to the correct passages. Check that you can view a list of all your bookmarks and annotations for the book.
Step 5
In this step your goal is to let readers look up any word instantly without leaving the book.
When a user selects a word, they should see a definition. For dictionary lookups, you’ll want this to work offline so it doesn’t break the reading flow. For additional context, provide a way to look up the selected word or phrase on Wikipedia using their public API. The lookup should appear as a clean overlay or popup that doesn’t lose the reader’s place.
Testing guidance: Open a book and select a word — verify you get a dictionary definition quickly. Try selecting an uncommon word and check that it’s handled (either a definition or a clear “not found” message). Select a proper noun or topic and try the Wikipedia lookup, verify you get a relevant summary. Check that the lookup popup doesn’t disrupt your reading position, when you dismiss it, you should be right where you were.
Step 6
In this step your goal is to make your reader fully usable through keyboard navigation and screen readers.
Every feature in your reader should be reachable and operable without a mouse. The reading view, table of contents, library, annotations, and all controls should be keyboard-navigable with a logical tab order. For screen readers, all interactive elements need proper labels and roles so assistive technology can describe what’s on screen and what actions are available. This is one of those features that seems straightforward but requires careful attention to how your UI communicates with the accessibility layer of your platform.
Testing guidance: Put your mouse away and try to use every feature of your reader using only the keyboard. Navigate the library, open a book, move between chapters, create a bookmark, and switch themes, all without clicking. Then test with a screen reader (VoiceOver on macOS, NVDA on Windows, Orca on Linux). Verify that the screen reader announces book titles, chapter names, and button labels correctly. Check that the reading content is announced in the proper order.
Going Further
Once you’ve built the core ebook reader, here are some ways to extend it:
Text-to-Speech with Sentence Highlighting: Add narration that highlights the current sentence as it reads aloud. The interesting part is synchronising the audio timing with text positions so the highlight tracks smoothly. Handle pausing, resuming, and adjusting playback speed.
OPDS and Calibre Integration: OPDS is an open catalog protocol for discovering and downloading ebooks. Build a catalog browser that connects to OPDS feeds and local Calibre libraries on your network. It’s a good exercise in protocol parsing and network discovery without needing cloud infrastructure.
PDF Support: Extend your rendering engine to handle PDF files alongside EPUB. PDF is a fixed-layout format, so the rendering approach is quite different from reflowable EPUB — a worthwhile challenge in its own right.
Reading Position Sync: If you’ve built a web-based reader, add the ability to sync reading positions across devices. This involves persisting state to a server and handling conflicts when the same book is read on multiple devices.
P.S. If You Enjoy Coding Challenges Here Are Four Ways You Can Help Support It
Refer a friend or colleague to the newsletter. 🙏
Sign up for a paid subscription - think of it as buying me a coffee ☕️ twice a month, with the bonus that you also get 20% off any of my courses.
Buy one of my courses that walk you through a Coding Challenge.
Subscribe to the Coding Challenges YouTube channel!
Share Your Solutions!
If you think your solution is an example other developers can learn from please share it, put it on GitHub, GitLab or elsewhere. Then let me know via Bluesky or LinkedIn or just post about it there and tag me. Alternately please add a link to it in the Coding Challenges Shared Solutions Github repo
Request for Feedback
I’m writing these challenges to help you develop your skills as a software engineer based on how I’ve approached my own personal learning and development. What works for me, might not be the best way for you - so if you have suggestions for how I can make these challenges more useful to you and others, please get in touch and let me know. All feedback greatly appreciated.
You can reach me on Bluesky, LinkedIn or through SubStack
Thanks and happy coding!
John