A beautiful, feature-rich meditation timer built with Nuxt.js and Vue 3. This application provides a peaceful environment for meditation practice with customizable timers, guided instructions, ambient sounds, and comprehensive statistics tracking.
- Multiple Preset Durations: Quick access to 10 minutes, 30 minutes, and 1 hour sessions
- Custom Duration: Add extra time to any preset with the "Add +" buttons
- Interval Bell: Optional bell chiming at the halfway point of your session
- Ending Bell with Timer: Configurable bell that rings when your meditation session ends, with customizable duration and sound selection
- Large, Clear Display: Easy-to-read timer with responsive design
- Start/End Bell Sounds: Choose from 4 different gong sounds to mark the beginning and end of your session
- Ending Bell Configuration:
- Set custom duration for how long the ending bell rings (e.g., 10 seconds, 30 seconds, 1 minute)
- Choose from multiple bell sound options (Gong 1-4, or S.N. Goenka bell)
- Independent volume control for ending bell
- Option to disable ending bell completely
- Guided Meditation:
- English (Goenka method)
- Hindi instructions
- Nepali instructions
- Custom audio file support
- Background Sounds:
- Forest with Birds
- Water in Stream
- River with Birds
- Birds only
- Comprehensive Analytics: Track total sessions, total time, and average duration
- Streak Counter: Monitor your daily meditation consistency
- Weekly Activity Chart: Visual representation of your meditation habits
- Time of Day Analysis: See when you meditate most often (Morning, Afternoon, Evening, Night)
- Recent Session History: Quick overview of your last 5 meditation sessions
- Data Export/Import: Backup and restore your meditation data
- Beautiful Gradient Themes: Dynamic color themes that change with inspirational quotes
- Responsive Design: Works perfectly on desktop, tablet, and mobile devices
- No Sleep Mode: Prevents device from sleeping during meditation sessions
- Battery Indicator: Shows device battery level
- Inspirational Quotes: Rotating collection of wisdom from Buddhist teachers and meditation masters
- Smooth Animations: Elegant transitions and hover effects
- PWA Ready: Can be installed as a progressive web app
- Offline Support: Works without internet connection
- Local Storage: All data stored locally on your device
- Custom Audio Upload: Support for personal guided meditation files
- Cache Management: Built-in cache reset functionality
- Node.js (version 16 or higher)
- npm or yarn package manager
-
Clone the repository
git clone https://github.com/samanshakya/hamro-meditation-timer.git cd hamro-meditation-timer -
Install dependencies
npm install
-
Start development server
npm run dev
The app will be available at
http://localhost:3000
# Build for production
npm run build
# Start production server
npm run start
# Generate static files (for static hosting)
npm run generate- Choose your preferred duration (10 min, 30 min, or 1 hour)
- Optionally enable interval bell for halfway reminder
- Select your preferred bell sound
- Press the play button to start your session
- Press the stop button to end early, or let it complete naturally
- Click the settings icon (⚙️) in the top right
- For Guided Meditation:
- Toggle "Guided Meditation" on
- Select your preferred language
- For custom audio: choose "Custom Audio" and upload your file
- For Background Sounds:
- Toggle "Background Sounds" on
- Select from nature sounds available
- Click the statistics icon (📊) in the top right
- View your meditation progress, streaks, and patterns
- Export your data for backup or import previous data
- Framework: Nuxt.js 4 - Vue.js meta-framework
- Frontend: Vue 3 with Composition API
- Styling: Tailwind CSS 4 - Utility-first CSS framework
- Fonts: Inter via Google Fonts
- Build Tool: Nuxt's built-in Vite-based build system
- Data Storage: Browser LocalStorage and IndexedDB (for audio files)
- PWA Features: NoSleep.js for preventing device sleep
meditationtimer/
├── assets/ # Uncompiled assets
│ ├── css/ # Stylesheets
│ ├── data/ # Application data (quotes)
│ └── fonts/ # SVG icon definitions
├── components/ # Vue components
│ ├── Battery.vue # Battery level indicator
│ ├── Settings.vue # Settings panel
│ ├── Statistics.vue # Statistics and analytics
│ └── SvgIcons.vue # SVG icon symbols
├── pages/ # Application pages
│ └── index.vue # Main meditation timer page
├── public/ # Static assets
│ ├── media/ # Audio files
│ │ ├── bell/ # Bell sounds
│ │ ├── instructions/ # Guided meditation audio
│ │ └── sounds/ # Background nature sounds
│ └── images/ # Image assets
└── nuxt.config.ts # Nuxt configuration
- Add your audio file to
public/media/bell/ - Update the bell sound list in the main component's
presetsList.bellSound.list
- Add your audio file to
public/media/sounds/nature/ - Update the background sound list in
presetsList.backgroundSound.sound
- Add your audio file to
public/media/instructions/anapana/ - Update the language list in
presetsList.guidedInstruction.language
- 10 Minutes: Perfect for beginners or quick sessions
- 30 Minutes: Standard meditation length
- 1 Hour: Extended practice sessions
- Custom Duration: Add extra time in increments (5, 15, or 30 minutes)
- High Quality: All audio files optimized for meditation
- Multiple Formats: Support for various audio formats
- Custom Upload: Upload your own guided meditations
- Loop Support: Background sounds automatically loop
- Local Only: All data stays on your device
- No Tracking: No analytics or user tracking
- Export Control: Full control over your meditation data
We welcome contributions from the meditation and developer communities! This project was created with love by Saman Shakya, and we'd love your help to make it even better.
- Fork the repository
- Create a feature branch:
git checkout -b feature/amazing-feature - Make your changes: Add features, fix bugs, or improve documentation
- Test thoroughly: Ensure your changes work across different devices
- Commit your changes:
git commit -m 'Add amazing feature' - Push to the branch:
git push origin feature/amazing-feature - Open a Pull Request: Describe your changes and their benefits
- 🐛 Bug fixes: Help us improve stability and user experience
- ✨ New features: Add meditation techniques, audio options, or analytics
- 🎨 UI/UX improvements: Make the interface more beautiful and intuitive
- 🌐 Translations: Help make meditation accessible in more languages
- 📚 Documentation: Improve guides, add tutorials, or clarify instructions
- 🎵 Audio content: Contribute guided meditations or nature sounds
- 🧪 Testing: Help test on different devices and browsers
- Keep the code clean and well-commented
- Follow Vue.js and Nuxt.js best practices
- Maintain the peaceful, mindful aesthetic
- Ensure accessibility for all users
- Test on mobile and desktop devices
- Respect the meditation theme and purpose
If contributing audio content:
- Use high-quality recordings (minimum 128kbps)
- Keep background noise minimal
- Follow meditation best practices
- Ensure you have rights to share the content
- Consider different meditation traditions and approaches
- Be respectful and mindful in all interactions
- Focus on creating a peaceful, inclusive environment
- Share constructive feedback and suggestions
- Help fellow contributors and users
- Embrace the spirit of mindfulness and compassion
- Issues: Report bugs or request features via GitHub Issues
- Discussions: Join conversations about meditation and development
- Facebook Group: Join our meditation community
- Contact: Reach out via Messenger
This project is licensed under the MIT License - see the LICENSE file for details. This means you can freely use, modify, and distribute this software while maintaining the original copyright notice.
- Meditation instructions and philosophy inspired by the Vipassana tradition
- Audio samples from various meditation teachers and nature recordings
- Icons and design elements crafted for mindful experiences
- Special thanks to the meditation community for inspiration and feedback
May all beings be happy! 🙏😊
"The present moment is the only time over which we have dominion." - Thich Nhat Hanh