🌟 mVara Suite (Beta)

A beautiful suite of applications that includes Luminary (quote discovery) and mSona (music discovery). Built with modern web technologies and designed for an exceptional user experience.

Live Demo: https://msona.netlify.app

🚀 Features

🎵 mSona: Music Discovery

• Smart Search: Find artists, songs, and albums with intelligent results
• Audio Preview: Listen to track previews with visualization
• Track Analysis: View detailed audio features and characteristics
• Direct Spotify Integration: Quick access to tracks on Spotify
• Visual Analytics: Track mood and energy visualization
• Audio Controls: Volume control and playback management
• Favorites System: Save and manage your favorite tracks

🌟 Luminary: Quote Discovery

• AI Transformations: Transform quotes using Grok
• Text-to-Speech: Listen to quotes with ElevenLabs voices
• Smart Categories: Intelligently organized quotes
• Favorites System: Save and manage your favorite quotes
• PDF Export: Generate beautiful quote collections
• Mobile Optimized: Vertical action buttons and responsive layout

🛠️ Tech Stack

• Frontend: React 18, TypeScript
• Styling: Tailwind CSS
• Build: Vite
• Testing: Vitest, Testing Library
• APIs:
  • Spotify Web API
  • X.AI (Grok)
  • ElevenLabs
  • Quotable API

📦 Installation

1. Clone the repository:

   git clone https://github.com/yourusername/mvara-suite.git

2. Install dependencies:

   cd mvara-suite
   npm install

3. Set up environment variables:

   cp .env.example .env

4. Configure API keys:

   a) Spotify API

   • Go to Spotify Developer Dashboard
   • Create a new application
   • Get Client ID and Secret
   • Add redirect URI (e.g., http://localhost:8888/callback)
   • Select Web API scope

   b) ElevenLabs

   • Sign up at ElevenLabs
   • Get API key from your profile

   c) Grok (X.AI)

   • Get API key from X.AI
   • Ensure you have access to Grok beta

5. Start development server:

   npm run dev

🚀 Deployment

Netlify (Recommended)

1. Push to GitHub:

   git init
   git add .
   git commit -m "Initial commit"
   git push

2. Connect to Netlify:

   • Sign up/login to Netlify
   • Click "New site from Git"
   • Select your repository
   • Configure build settings:
     • Build command: npm run build
     • Publish directory: dist
     • Node version: 18.x

3. Set environment variables:

   • Go to Site settings > Environment variables
   • Add all variables from .env
   • Deploy triggers automatically

Security Notes

• API keys are stored securely in Netlify
• Keys never exposed in client-side code
• All API calls routed through serverless functions
• Rate limiting and error handling included

📝 License

This project is licensed under the MIT License - see the LICENSE file for details.

🙏 Acknowledgments

• Music data from Spotify Web API
• Quote data from Quotable API
• Text-to-speech by ElevenLabs
• Icons by Lucide
• Development environment by bolt.new

---

Made with ❤️ by the mVara team