"Daily Mission" is a minimalist, data-driven web application for tracking daily tasks with a focus on user motivation. The application provides a clean, simple interface for managing tasks with progress visualization and weekly performance statistics.

• User Personalization: Custom welcome screen that requires user name entry
• Task Management: Add, edit, delete, and mark tasks as complete
• Progress Tracking: Visual progress bar showing daily task completion
• Weekly Statistics: Data visualization of the past 7 days' performance
• Motivational Elements: Narrative-based feedback to encourage task completion

• HTML, CSS, and vanilla JavaScript (ES6+)
• Vite for development workflow
• IndexedDB for local data storage (30-day retention)
• GSAP for smooth animations
• Fully offline functionality, no backend required

1. Clone the repository
2. Run npm install to install dependencies
3. Use npm run dev to start the development server
4. Enter your name at the prompt to begin using the application

The application follows a modular structure with separate components for tasks, progress visualization, statistics, and user authentication.

Create a lightweight, minimalist, yet data-driven web application for managing daily tasks with a focus on user motivation. Technologies:

• HTML + CSS + JavaScript (ES6+)
• Vite for rapid development
• IndexedDB for storing up to 30 days of data
• Smooth animations with GSAP
• No backend, completely offline and browser-based

Before displaying the main page, users are prompted to enter their name. This serves several purposes:

• Creates a sense of personalization and daily mission
• Stores the name in localStorage
• Displays the name across all app pages:
  "Today's Mission: [User Name]"
• Without entering a name, there's no access to tasks or statistics

• Add, edit, and delete daily tasks
• Check off completed tasks
• Store each day independently in IndexedDB
• Auto-reset tasks at the start of a new day

• Horizontal bar at the top with GSAP animation
• Fills based on the percentage of completed tasks
• Colors:
  • 0–49%: Subtle gray
  • 50–99%: Light green
  • 100%: Bold green + success animation

• Display activity for the past 7 days with simple charts (column or block)
• Calculate:
  • Number of days with 100% completion
  • Average completion percentage for the week
• Motivational message:
  "🔥 You completed your mission on 4 out of 7 days!"

• Minimalist, simple, plenty of white space
• Only 1 or 2 main colors (e.g., white + green)
• No complexity, no visual noise
• Readable font, responsive design (mobile and desktop)

🛡️ Today is your battlefield.
Each task a challenge, each check a victory.
Build the day — and yourself.

"🎯 Task completed! Keep going, champion..."

"🏆 Today conquered! You're a winner, not just in tasks, but in willpower."

/public
/src
/components
- TaskList.js
- ProgressBar.js
- StatsView.js
- NameGate.js
/db
- indexdb.js
/styles
- main.css
main.js
index.html
vite.config.js

• No frameworks like React or Vue
• Code should be Vanilla JS with modular structure
• Lightweight and browser-executable
• No need for internet connection or backend

• Complete Vite project with modular structure
• GSAP animations for interactions
• Daily task storage in IndexedDB
• Simple and effective statistical chart for performance feedback
• Name-based entry lock with narrative messages
• A minimalist, smooth, and motivating experience for the user

• Set up a new Next.js project
• Migrate HTML/CSS structure to Next.js components
• Convert vanilla JS modules to React hooks and components
• Implement client-side routing
• Ensure responsive design works in Next.js environment
• Test performance and optimize as needed

• Set up Supabase project
• Implement user authentication with Supabase Auth
• Migrate IndexedDB storage to Supabase database
• Create database schema for tasks and user data
• Implement data synchronization between local storage and Supabase
• Add user profile management features

• Implement browser notifications for task deadlines
• Add reminder scheduling functionality
• Create notification preferences settings
• Implement email notifications via Supabase
• Add daily/weekly digest emails option
• Create push notifications for mobile devices
• Implement snooze and dismiss actions for notifications

• Implement task categories and tags
• Add recurring tasks functionality
• Create task priority levels
• Implement task sharing between users
• Add data export/import capabilities
• Create advanced statistics and reporting