Skip to content

Latest commit

 

History

History
206 lines (146 loc) · 6.81 KB

README.md

File metadata and controls

206 lines (146 loc) · 6.81 KB

🌌 BiblioDrift — Drift Through Stories, Not Screens

Live App NSoC 2026 GSSoC 2026 MIT License

🌙 A calm, immersive, AI-powered book discovery experience

"Find yourself in the pages."

BiblioDrift transforms book discovery into an emotional journey — where stories are explored through mood, atmosphere, and feeling instead of endless scrolling.

🌧️ Mood-first discovery • 📚 Immersive reading • 🤖 AI-powered storytelling

Deploys by Netlify

🌌 Table of Contents

📚 Section 🔗 Description
💭 The Idea Vision and inspiration behind BiblioDrift
🧘 Core Philosophy Principles that shape the experience
✨ Experience Highlights Main features and immersive interactions
🛠️ Tech Stack Technologies powering the platform
🧠 System Architecture Flow between frontend, backend, and AI
📸 Screenshots Visual preview of the application
📄 License Project licensing information

🌿 The Idea

Most platforms make reading feel like:

  • ❌ Endless scrolling
  • ❌ Algorithm overload
  • ❌ No emotional connection

BiblioDrift is different.

It feels like:

📚 Walking into a quiet bookstore
☕ Picking a book based on mood
🌧️ Letting the atmosphere guide you


🌟 Core Philosophy

  • 🧘 Zero UI Noise → No clutter, no distractions
  • 🎭 Vibe-First Discovery → Search by feeling, not metadata
  • 📖 Tactile Interaction → Books behave like real objects
  • 🤖 AI as a Bookseller → Not recommendations, but conversations

✨ Experience Highlights

📚 Interactive Library

  • 3D books you can pull, flip, and explore
  • Shelf-based organization (Want / Reading / Favorites)

🧠 AI-Powered Discovery

  • Mood-based recommendations (e.g., “rainy mystery”)
  • Dynamic AI-generated blurbs
  • Conversational assistant → Elara, the Bookseller

🌌 Immersive UX

  • Glassmorphism interface
  • Ambient sounds (rain, fireplace,Calm Ocean Waves,Stormy Rain)
  • Emotion-based tagging system

⚡ Performance & UX

  • Skeleton loaders (smooth loading)
  • LocalStorage persistence
  • Seamless interactions

🛠️ Tech Stack

Layer Technology
Frontend HTML5, CSS3 (3D), Vanilla JS
API Google Books API
Backend Flask, SQLAlchemy, JWT cookies
AI LLM-powered notes, chat, and mood analysis
Storage LocalStorage

🚀 Backend Deployment & BACKEND_URL Setup

⚠️ The frontend is deployed on Netlify, but the Flask backend is not yet deployed. Google Sign-In and all AI features require the backend to be running.

Why is this needed?

When a user clicks "Sign in with Google", the browser sends a request to /api/v1/auth/google. Netlify needs to know where to forward that request, that's what BACKEND_URL is for. Without it, Netlify has no rule for /api/v1/* and shows a 404 error.

Step 1 — Deploy the Flask backend

You can deploy the backend (located in the /backend folder) to either:

Platform Free Tier Docs
Render ✅ Yes Render Python Docs
Railway ✅ Yes Railway Docs

After deploying, you'll get a public URL like: https://your-app.onrender.com

Step 2 — Set BACKEND_URL in Netlify

  1. Go to Netlify Dashboard
  2. Open your site → Site Configuration → Environment Variables
  3. Click Add a variable
  4. Set:
    • Key: BACKEND_URL
    • Value: https://your-app.onrender.com (no trailing slash)
  5. Click Save

Step 3 — Redeploy the Netlify site

After setting the variable:

  1. Go to Deploys tab in your Netlify dashboard
  2. Click Trigger deploy → Deploy site
  3. This reruns build_netlify.py, which picks up BACKEND_URL and adds the proxy rule to _redirects

After this, "Sign in with Google" will correctly reach the Flask backend. ✅


🧠 System Architecture

graph TD
	A[Frontend UI] -->|Mood Query| B[Flask Backend]
	B -->|Prompt Engineering| C[LLM / AI Service]
	C -->|Generated Insight| B
	B -->|JSON Response| A
	A -->|Book Data| D[Google Books API]
	A -->|Persistence| E[LocalStorage]
Loading

📸 Screenshots

Discovery & Virtual Library

Home Page

Virtual Library Sign In Page

Capturing the tactile, vibe-first essence of BiblioDrift.


📚 Documentation Hub

📄 Document ✨ Description
🧠 Architecture Guide Detailed system design, data flow, and backend structure
📡 API Documentation API endpoints, request/response examples, and integration flow
🚀 Roadmap Upcoming features and future development plans
🗂️ Project Structure Complete folder hierarchy and project organization
📖 Tutorial Guide Step-by-step setup and usage walkthrough
🤝 Contributing Guide Contribution workflow, rules, and PR process
🧩 Mood Analysis Module AI mood engine architecture and logic
🛒 Purchase Links Module Purchase link generation system documentation

Built with ☕ and code by Devanshi Malhotra and contributors.

⭐ If you like this project, consider starring the repository.


📄 License

This project is licensed under the MIT License.