Focusly is a clean and engaging productivity app designed to keep you focused on what matters. Manage tasks, track progress, and celebrate achievements — all in one simple interface. Data is stored locally, so you can stay productive without creating an account.
🔗 Deployed on Netlify:(https://focuslypro.netlify.app/)
- Add, delete, and complete tasks with ease
- Highlight completed tasks automatically
- Search tasks instantly by:
- Task name
- Description
- Category
- LocalStorage ensures your tasks never wipe on refresh
- Weekly Completion Chart — visual progress over the current week
- Category Breakdown Chart — track your tasks by category
- Completion Rate Gauge — percentage of completion at a glance
Every action matters:
- Task created
- Task completed
- Task deleted
Displayed in chronological order (latest first)
- Greets user by name using a browser prompt
- Automatically records “Joined Date”
- Displays username + join date on dashboard header
- Simple tab navigation:
- Overview
- Stats
- History
- Settings
- Clean, modern, and consistent styling
- Best on Laptop/Desktop screens
(Mobile version coming soon)
| Technology | Purpose |
|---|---|
| HTML5 | UI Structure |
| CSS3 | Styling & Layout |
| JavaScript (ES6+) | State & App Logic |
| Chart.js | Data Visualizations |
| LocalStorage API | Persistent Storage |
/src controller.js model.js /view historyView.js taskView.js ---add more---
index.html
# Clone the repository
git clone https://github.com/Codehumps001/focusly.git
cd focusly
# Open the app
Open index.html in your browser
🗺️ Roadmap — Version 2
Planned upgrades:
• Better mobile & tablet responsiveness
• Dark mode toggle
• Editable user profile (name/photo)
• Notifications for deadlines
• Motivational quotes with rotating API
• Cloud sync + Authentication
👑 Author
Developed by: Yaw Fosu
A passionate self-taught web developer building real-world solutions.