BrightMind — Premium E-book Marketplace & Digital Learning Platform

A complete, production-ready static front-end for the BrightMind e-book marketplace: 22 fully-linked pages, a shared design system, and working client-side cart / wishlist / search / checkout flows — ready to upload as-is, and ready to wire into a real backend.

---

⚠️ Important — read this first

This package is a complete static front-end (HTML5, CSS3, vanilla JavaScript). It faithfully implements every page and UI feature from the project brief — shop, filtering, book detail, authors, blog, dashboards, checkout, etc. — with realistic sample data and fully working client-side interactivity (cart, wishlist, search, filters, forms, FAQ accordion, chatbot widget UI).

It does not include a live PHP/MySQL backend, real JWT/OAuth authentication, or live payment processing — those require a running server, a database, and real, secret API keys, none of which can be generated safely or run inside this environment. Login, checkout and the dashboards work as fully-clickable demos backed by localStorage, so you can present and test the entire user flow today.

To go fully live, you'll want to build a backend (PHP 8 + MySQL is a good match for this front-end, but Node.js/Express or any REST API works too) that exposes endpoints like /api/books, /api/auth/login, /api/orders, /api/checkout, and swap the demo logic in js/script.js (the STORE object and the init*() functions) for real fetch() calls. The front-end is deliberately structured — one data layer (js/data.js), one logic layer (js/script.js) — to make that swap straightforward.

---

What's included

brightmind/
├── index.html                 Home
├── shop.html                  Shop with filters, sort, search
├── categories.html            All 25 categories
├── book-detail.html           Single book page
├── authors.html                Author directory
├── author-profile.html        Individual author page
├── blog.html                  Blog listing
├── blog-post.html             Sample article
├── about.html                 About BrightMind
├── contact.html                Contact form + map
├── faq.html                    Help Center / FAQs
├── privacy-policy.html
├── terms.html
├── refund-policy.html
├── cookie-policy.html
├── login.html
├── register.html
├── cart.html
├── wishlist.html
├── checkout.html
├── dashboard.html              Customer dashboard
├── admin-dashboard.html        Admin dashboard (analytics, orders, users)
├── css/style.css               Full design system (tokens, components, layout)
├── js/data.js                  Sample books / authors / categories / blog data
├── js/script.js                Cart, wishlist, search, filters, forms, UI logic
├── images/                     Logo, favicons, app icons (from your uploaded logo)
├── robots.txt
├── sitemap.xml
├── site.webmanifest
├── .htaccess                   Apache config for Hostinger
├── vercel.json                 Vercel headers/config
├── render.yaml                 Render static site blueprint
└── README.md

Design system

• Palette: Deep Navy #0A1226, Royal Blue #2A5CE6, Warm Gold #F0A93A, Emerald CTA #0FA968, Paper #F6F7FB.
• Type: Sora (headings), Inter (body), JetBrains Mono (data/labels), loaded from Google Fonts.
• Signature element: an open-book-and-rising-light mark (echoing your logo) used as a section divider throughout the site.
• Fully responsive (desktop → mobile), keyboard-focus visible, prefers-reduced-motion respected.

Working features (client-side, no backend required)

• Shopping cart & wishlist (persisted in localStorage, badge counters update live)
• Shop filtering by category, price range, rating, and free-text search
• Sorting (popular, newest, price, rating)
• Book detail page driven by URL parameter (book-detail.html?id=b1)
• Author profile pages (author-profile.html?id=a1)
• FAQ accordion, newsletter/contact form submission (demo), coupon field (demo)
• Login/Register (demo — stores a display name locally, no real auth)
• Checkout flow with payment-method selector UI and order confirmation screen
• Admin dashboard with a live Chart.js revenue chart and sample tables
• Floating support chatbot widget (UI + canned responses)

Connecting a real backend

1. Build REST endpoints for books, authors, categories, orders, auth, etc. (PHP 8 + MySQL, or any stack you prefer).
2. Replace the arrays in js/data.js with fetch() calls to your API.
3. Replace STORE.user / the demo login-register handlers in js/script.js with real calls to your /api/auth/* endpoints (JWT recommended), and add a small auth-guard script to dashboard.html / admin-dashboard.html.
4. Wire the payment buttons in checkout.html to your gateway SDKs:
   • Paystack: initialize via Paystack Inline JS, verify server-side.
   • Flutterwave: use the Flutterwave Standard/Inline checkout, verify server-side.
   • Stripe: use Stripe Checkout or Payment Element, confirm server-side.
   • PayPal: use the PayPal JS SDK buttons. Never put secret/private API keys in front-end code — only publishable/public keys belong in the browser.
5. Add server-side validation, rate limiting, CSRF protection and HTTPS on your API — the front-end already sends structured form data ready for this.

Deployment

Hostinger Business Hosting — Upload the whole folder to public_html via File Manager or FTP. .htaccess is already configured (HTTPS redirect, caching, security headers). No build step needed.

Vercel — Import the folder as a project (Framework Preset: Other). vercel.json is included for headers/caching. No build command required for the static front-end.

Render — Create a new Static Site, connect this folder/repo; render.yaml is included as a blueprint (publish path .).

Neon — Neon is a serverless Postgres database. It isn't used by this static front-end; provision a Neon database once you build the backend API described above, and point your backend's connection string at it (or use MySQL if you keep the PHP/MySQL stack from the original brief).

Sample data

js/data.js includes 16 sample books, 6 authors, 25 categories and 6 blog posts, all clearly commented so you can extend or replace them (or wire them to a live API) without touching any HTML.

Credits

Design and build: generated with Claude, based on the BrightMind Books project brief and supplied logo. Contact: olatundeajayi87@yahoo.com · +234 913 587 8155 · Lagos, Nigeria.