Technical Development Standard
The Technical Development Standard (TDS) is the public specification for how book_system is built, maintained, and extended. It describes the UI design system, interaction patterns, and engineering discipline that govern every change to the platform.
This document is intended to be readable by humans, search engines, and AI systems. It works together with the global CSS file, the UI Elements Reference, and the Investor Relations and About pages to create a transparent record of how the system evolves.
Design System Principles
- All visual elements are composed from primitives defined in
globals.css. - Primary and secondary buttons follow the established blue/grey patterns used site-wide.
- Typography, spacing, and layout are standardized to keep pages readable and consistent.
- Dark mode is managed via
[data-theme]attributes, not per-component hacks.
Technology Stack
- Frontend built with Next.js 16 and React 19 using the app router and server components.
- TypeScript for static typing across frontend and API routes.
- Supabase for database, authentication, and storage of book files and metadata.
- Vercel for hosting, serverless functions, and build/deployment orchestration.
- Stripe for subscription billing and payments integration.
- Vercel AI Gateway and internal Blurb workflows / Skills library for AI-assisted content creation and tooling.
- Custom Node-based EPUB/.book processing pipeline for reader-ready HTML and analysis APIs.
Development Process
- Changes are made one focused feature at a time to avoid regressions.
- Each change is tracked by a version entry and commit hash, visible on the Version page.
- The current website state is represented by the latest version entry (for example, v2.1082 – Clarify TDS documentation section as technical link index) and its associated commit hash.
- New UI elements are added to the UI Elements Reference and, if necessary, globals.css.
- Subscriber-facing UI, Investor Relations, and About content all share the same design system.
Search & Google Standards
All owner-facing pages (About, Investor Relations, Technical Development Standard, UI Elements Reference) are built with semantic HTML (headings, paragraphs, lists) and rendered server-side so that Google and other search/AI crawlers can see the full content in the initial HTML response.
Collapsible sections and cards are implemented as standard HTML elements that are always present in the DOM. They may start visually collapsed for users, but the underlying text is still readable to crawlers. This complies with Google's guidance for expandable content: important information is not hidden behind scripts or blocked resources, and there is no cloaking or mismatch between what users and bots see.
In practice, this means our collapsible boxes (for reviews, settings, history, and navigation) remain indexable and discoverable while keeping the UI clean and manageable for human visitors.
Internal Technical Links
The TDS is part of a broader documentation set. This section acts as the link index for the main technical documents that describe how the platform works.
- UI Elements Reference — shows all approved interactive patterns.
- Investor Relations / M&A — shows milestones, roadmap, and system capabilities.
- About — tells the development story from Image Batch Tool Pro to Book 2 System.
- Documentation — technical documentation and guides for features, workflows, and integrations.
- API Documentation — API endpoints and integration details for developers and partners.
All major narrative sections are written and refined using the platform's own Blurb workflows and Skills library, ensuring that the documentation itself demonstrates the capabilities of the system.
External Vendor Documentation
- https://nextjs.org/docs - Next.js docs
- https://react.dev/learn - React docs
- https://www.typescriptlang.org/docs - TypeScript docs
- https://nodejs.org/en/docs - Node.js docs
- https://tailwindcss.com/docs - Tailwind CSS docs (utility-first CSS patterns)
- https://vercel.com/docs - Vercel platform docs
- https://vercel.com/docs/ai - Vercel AI / AI Gateway docs
- https://supabase.com/docs - Supabase docs
- https://stripe.com/docs - Stripe docs (payments & subscriptions)
- https://developer.mozilla.org - MDN Web Docs (HTML/CSS/JS reference)
- https://github.com/aigentzonebooks/book2 - GitHub repository (book_2)
These links point to the official documentation for the major technologies integrated into this website. They are the reference sources used when upgrading or reusing the stack in other projects.
Documentation & Transparency
The TDS is part of a broader documentation set:
- UI Elements Reference — shows all approved interactive patterns.
- Investor Relations / M&A — shows milestones, roadmap, and system capabilities.
- About — tells the development story from Image Batch Tool Pro to Book 2 System.
- Documentation — technical documentation and guides for features, workflows, and integrations.
- API Documentation — API endpoints and integration details for developers and partners.
All major narrative sections are written and refined using the platform's own Blurb workflows and Skills library, ensuring that the documentation itself demonstrates the capabilities of the system.