A simple, privacy-focused daily mood tracking application built with Next.js. Track your emotional well-being with just one click and visualize your mood trends over time.
- One-Click Mood Recording: Quickly log your daily mood with three simple options: Good 😊, Neutral 😐, or Bad 😞
- Visual Analytics: View your mood trends with interactive charts and graphs
- Monthly Reports: Detailed monthly breakdowns with calendar views and progress tracking
- Streak Tracking: Monitor your mood recording consistency
- Privacy-First: All data is stored locally on your device - no cloud storage, no tracking
- PWA Support: Install as a Progressive Web App for easy access
- Shareable Snapshots: Generate and share beautiful mood snapshots
- Responsive Design: Works seamlessly on desktop and mobile devices
Visit moodsnap.me to try the application live.
- Framework: Next.js 15 with App Router
- Language: TypeScript
- Styling: Tailwind CSS
- State Management: Jotai
- Charts: Chart.js with React Chart.js 2
- Icons: Heroicons
- Image Capture: html2canvas
- Package Manager: Bun
-
Clone the repository
git clone https://github.com/your-username/mood-snap.git cd mood-snap -
Install dependencies
bun install # or npm install -
Run the development server
bun dev # or npm run dev -
Open your browser Navigate to http://localhost:3001 to see the application.
mood-snap/
├── app/ # Next.js App Router
│ ├── _sections/ # Reusable UI components
│ ├── about/ # About page
│ ├── contact/ # Contact page
│ ├── history/ # Mood history and charts
│ ├── report/ # Monthly reports
│ └── settings/ # App settings
├── public/ # Static assets
│ ├── images/ # Mood icons and social images
│ └── manifest.json # PWA manifest
├── utils/ # Utility functions and atoms
└── package.json
- Visit the homepage
- Click on one of the three mood options: Good, Neutral, or Bad
- Your mood is instantly saved locally
- Navigate to the History page to see your mood trends over the last 28 days
- Switch between line and bar charts
- View summary statistics
- Access detailed monthly reports with calendar views
- Track your positive mood percentage
- Navigate between different months
- Adjust app preferences
- Manage your data
- Configure streak tracking
MoodSnap is designed with privacy in mind:
- Local Storage Only: All your mood data is stored locally in your browser
- No Tracking: No analytics, no user tracking, no data collection
- No Accounts: No registration required - just start tracking immediately
- Offline Capable: Works without an internet connection
- Push your code to GitHub
- Connect your repository to Vercel
- Deploy with zero configuration
The application can be deployed on any platform that supports Next.js:
- Netlify
- Railway
- DigitalOcean App Platform
- AWS Amplify
Contributions are welcome! Please feel free to submit a Pull Request. For major changes, please open an issue first to discuss what you would like to change.
- Fork the repository
- Create your feature branch (
git checkout -b feature/AmazingFeature) - Commit your changes (
git commit -m 'Add some AmazingFeature') - Push to the branch (
git push origin feature/AmazingFeature) - Open a Pull Request
This project is licensed under the MIT License - see the LICENSE file for details.
- Built with Next.js
- Icons by Heroicons
- Charts powered by Chart.js
- Styled with Tailwind CSS
If you have any questions or need help, please:
- Open an issue on GitHub
- Visit the contact page
- Check out the about page for more information
Made with ❤️ for better mental health awareness and self-reflection.