Todo App | Frontend Only

A frontend-only Todo application built with vanilla JavaScript that implements full CRUD functionality.

Technologies

• HTML5 - Semantic structure
• CSS3 - Animations & responsive design
• Vanilla JavaScript (ES6 Modules) - Clean architecture
• LocalStorage API - Data persistence

Features

• Create new todos with validation (max 20 characters)
• Read todos from localStorage on page load
• Update existing todos in-place with edit mode
• Delete todos with user feedback
• Toggle completion using checkbox
• Toast notifications for all operations (success/error)
• Input validation with real-time character limit feedback
• Accessibility (A11Y) - ARIA labels, semantic HTML5
• Responsive design - Works on all devices
• Smart scrollbar detection - Dynamic padding with ResizeObserver
• Data persistence - localStorage with error handling

Future Improvements

• Backend integration
• User authentication
• Drag and drop reordering

Testing (Planned)

• Unit tests for core business logic
• Integration tests for storage and UI interactions

License

This project was created for learning and portfolio purposes.

👤 Author

G3rzson

• GitHub: @G3rzson