📚 MagicNook - Book Buddy
A free, child-friendly web application built with React and Firebase to encourage reading and allow children to record and track summaries of the books they've read.
- Book Search: Find books quickly by Title or ISBN using the Open Library API.
- Voice Summaries: Record summaries using the MediaRecorder API and store them in Firebase Storage.
- Read Aloud: Hear book descriptions and summaries using the Web Speech API (TTS).
- Personal Library: A colourful dashboard showing progress and book cards.
- Gamification: Confetti/Badge animations upon adding a new book!
Follow these steps to set up and run the Book Buddy MVP locally.
- Node.js (LTS version recommended)
- npm (Node Package Manager) or yarn
This project uses Doppler for secure environment variable management. See DOPPLER.md for complete setup instructions.
Quick Start:
doppler login
doppler setup
doppler run -- npm run devBook Buddy uses Firebase for authentication, database, and file storage (free tier).
-
Create a Firebase Project: Go to the Firebase Console and create a new project.
-
Add a Web App: In your project, click the
</>icon to add a web app. -
Get Configuration: Firebase will provide a configuration object (
apiKey,projectId, etc.). -
Add to Doppler: Use Doppler to securely store your Firebase configuration:
doppler secrets set VITE_FIREBASE_API_KEY="YOUR_API_KEY" doppler secrets set VITE_FIREBASE_AUTH_DOMAIN="YOUR_PROJECT_ID.firebaseapp.com" doppler secrets set VITE_FIREBASE_PROJECT_ID="YOUR_PROJECT_ID"
Alternatively, update
firebaseConfig.jsmanually (not recommended for production):// src/services/firebaseConfig.js const firebaseConfig = { apiKey: "YOUR_API_KEY", // <--- UPDATE THIS authDomain: "YOUR_PROJECT_ID.firebaseapp.com", // <--- UPDATE THIS projectId: "YOUR_PROJECT_ID", // <--- UPDATE THIS // ... rest of config };
-
Enable Firebase Services:
- Authentication: Go to Build -> Authentication, click Get started, and enable the Anonymous sign-in provider.
- Firestore Database: Go to Build -> Firestore Database, click Create database, and start in test mode (for quick setup).
- Cloud Storage: Go to Build -> Storage, click Get started, and set up the default bucket.
Clone the repository and install dependencies.
# Clone the project (assuming this is a Git repository)
git clone
cd book-buddy-mvp
# Install dependencies (React, Firebase, etc.)
npm install
# OR
# yarn installnpm install firebase
npm install -g firebase-tools
For more detailed information about the project, see the following documents:
- Next Steps: A list of proposed future improvements and feature ideas.
- Deployment Guide: Step-by-step instructions for deploying the application.
- Original Prompt: The original project prompt and requirements.
- Development Steps: The initial development steps chosen for the project.
- Component Tree: An overview of the component structure.