Inkwell is a comics reading platform I built for a client as a full-stack site, then rebuilt as a public demo that runs entirely in the browser: no server, no database, nothing to sleep.
The client build is three services behind one gateway. A React and Vite front end talks to an Express and Mongoose API on MongoDB for accounts and reading data, and to a Strapi 5.34 CMS for the catalogue, on SQLite by default and Postgres by configuration. A plain Node gateway on port 3000 starts both as child processes and routes between them, so the gateway, the API, the CMS and the built front end ship as one Docker image, and Docker Compose runs MongoDB beside it. Readers get filters, Cmd+K search, a reader with long strip and single page modes, email verification, progress, history, bookmarks, four shelves, streaks, 20 achievements, reviews and comments; admins get a chunked zip importer.
Inkwell keeps that front end, rebranded, and moves the backend into the page. A router answers the old /api, /cms/api and /admin paths with the same JSON and status codes, so the app cannot tell its servers are gone. The catalogue is 11 public domain, CC0 and Creative Commons series, 42 chapters and 343 pages, each one credited; one click signs in a demo reader with three weeks of history; and the importer reads a zip without it leaving the browser. It is static files on Vercel at inkwell.alexsmiths.com, and it makes no requests to any other host.
The client build needs a gateway, an API, a CMS and a database running before anyone sees a page. I wanted it to be one link anyone could open, so I moved the backend into the browser.
installBackend() patches fetch before React mounts, and an Express-style router answers 66 routes under /api, /cms/api and /admin: the old services' paths, JSON shapes and status codes, plus a demo sign-in and a credits feed. The front end did not have to change how it talks to its backend. What a visitor changes is saved in their own browser, and every reply waits 60 to 180 ms so loading states stay honest. There is nothing to sleep, nothing to spin up and no secret to hold.
Long strip scrolls a chapter as one column and single page turns it a page at a time, with keyboard navigation and settings saved in the browser, so a reader sets the mode and image width once. The canvas drops from the site's near-black to pure black so the page is the only light, and the chrome stays thin: a top bar, and a pill with the reading timer and page count. Every chapter ends with its work's credit and licence.
Real sign-in is turned off, and the refusal points at the demo button. That button builds a demo reader, Mira Ellison, fresh every time, replaying 21 simulated days of reading session by session through the same stats and achievement engine the live routes use. Nothing is a hard-coded date, so the history moves with the calendar: she arrives with a 15-day streak, 29 chapters, 6 hours and 10 of the 20 achievements, and signing out and back in resets everything. The other readers, and every review, rating and view count, are simulated too, as the app's footer says.
Seven handler modules answer 39 routes under /api, 14 under /cms/api, 12 under the authenticated CMS proxy and 1 under /admin. Another user's id in the URL still gets 403, the ownership rule from the client build's security pass. The refusals the demo adds, like the login in this frame, are 403 with a code and never 401, because the front end signs out on any 401. An image tag never calls fetch, so every catalogue cover, page and avatar is a static file, and imported pages are Blob URLs from IndexedDB.
The client build's batch importer kept its page, its endpoints and its chunk limits, up to 100,000 chunks of 50 MB, and now runs in the browser. It reads the zip's directory with zip.js through Blob.slice and inflates one page at a time, so a large file is never held in memory whole. A path that climbs out of the zip rejects the whole file, every page is checked by its magic bytes, and a Web Lock keeps one import running across every tab. Imported chapters appear in lists, search, the series page and the reader at once.
11 series, 42 chapters and 343 pages: seven in the public domain, Hokusai Manga from the Met's CC0 photographs, and three under Creative Commons. A build script fetches each source once, then crops, scales down and re-encodes it to WebP with sharp, never enlarging, so each page stays its creator's own work. Every creator, licence and source is written into the catalogue with the pages and listed chapter by chapter on the credits page, and the reader closes every chapter on its work's credit and licence.
A client build first, then a rebuild that kept what was worth keeping: the front end, its API contract and its rules. The backend changed; the design did not.
A React, Vite and Tailwind single-page app: the front end both builds still share.
The chapter reader arrives: the screen every series page leads to.
An Express API joins, wired into the remaining pages.
Sign-up confirms the address with a code sent by email, through Resend.
A plain Node gateway on one port starts the API and the CMS as child processes and routes between them. The gateway, the API, the CMS and the built front end build into one Docker image, and Docker Compose adds MongoDB.
TypeScript strict mode, error boundaries and an auth context, then the reader serving real chapters from the CMS.
One zip of folders becomes series, volumes, chapters and pages: chunked uploads, a live log streamed as server-sent events, three CMS uploads at a time with retry, cancel, an import lock, and drafts until an admin publishes them.
Ownership checks on every user route, the CMS closed to public writes, tokens moved to an httpOnly cookie behind a proxy, DOMPurify on rich text, rate limits, single-use verification codes and a password reset flow.
The same front end, rebranded as Inkwell, on an in-browser backend that answers its 66 routes, with a public domain and Creative Commons catalogue and a one-click demo account.
zip.js, IndexedDB and a Web Lock in place of the upload server, behind the same endpoints and chunk limits.
410 unit tests, 22 end-to-end tests on desktop Chrome and a Pixel 7 profile, GitHub Actions on every push to main and every pull request, and Vercel serving main at inkwell.alexsmiths.com.
One app across both builds: the demo kept its layout, components and motion. TypeScript is strict in both, and in the demo it checks the app, the tests and the tool configs as three projects.
Accessible components themed from one config, and that file is byte for byte the client build's, so the demo shows the product's real palette rather than a lookalike.
Pages load as their own chunks. In the demo, the importer's code loads only when an import starts, and motion follows the system's reduced-motion setting.
Auth, progress, history, bookmarks, notifications and the importer, on MongoDB. Every user-data route checks that the id in the URL is the signed-in user and answers 403 if not.
An admin for series, chapters and pages, on SQLite by default and Postgres by configuration. Public create, update and delete are closed on all 11 content types.
A plain http-proxy gateway on port 3000 starts the API and the CMS as child processes and routes between them, so the app ships as one image, with MongoDB as a second container beside it.
installBackend() patches fetch before React mounts, because the first requests fire from mount effects. Each old route answers on its old path with its old shape, and state lives in localStorage under one versioned prefix.
The zip is read through Blob.slice and inflated a page at a time, never unpacked. Pages are stored as Blobs, and a Web Lock allows one import across every tab.
Crops, scales down and re-encodes each page to WebP with enlargement turned off, so nothing is upscaled, recoloured or otherwise altered. A check validates the catalogue offline.
343 in Node on the routes, the reading and achievement engines, streaks across midnight and daylight-saving changes, and the importer; 67 in jsdom on the reader, the account pages and sign-in.
On desktop Chrome and a Pixel 7 profile. Every test fails if a page requests another host or throws, and one runs a full import of the sample zip.
The icon subset, types, lint, unit tests, build and e2e on every push to main and every pull request. Vercel serves the static build from main, with nothing to keep running.
AlexanderSmith
Inkwell
