This is a collection of ToDo apps developed for educational purposes. These apps demonstrate different web development concepts and frameworks, including HTML, CSS, JavaScript, and various libraries and frameworks. Each version of the app showcases a different approach to building and managing tasks.
1|2|3|4. Vanilla JS - Approach 1/2/3/4: Basic implementation using plain JavaScript and HTML.
- ES6: Modern version using ES6 syntax and features.
- Backbone: Implementing the app using the Backbone.js framework.
- Vue: Building the app with the Vue.js framework.
- React: Creating the app using the React.js library.
- Angular: Developing the app using the Angular framework.
- Knockout: Building the app using the Knockout.js library.
- The PHP version of the app supports multiple storage mechanisms using drivers:
- Session Storage Driver: Uses an in-memory array to store tasks.
- MySQL Storage Driver: Stores tasks in a MySQL database using PHP drivers.
- Additional Storage Drivers: Feel free to explore and learn from the code!
- jQuery: Simple implemention with jquery.
- jQuery V2: Advance implemention with events, plugin arch.
jQuery V2 version of the ToDo app includes the following features:
- Create new tasks
- Mark tasks as completed
- Delete tasks
- Edit task
- Sort tasks using drag and drop
- Filter tasks by status
- Fuzzy search for tasks with keyboard shortcut
- Select tasks using long-press
- Support for different storage plugins
- Task count summary
- Information modal with plugin details
- Clone this repository to your local machine.
- Navigate to the version specific file you're interested in (e.g.,
react,vue, etc.). - Open the
[SELECTED_VERSION].htmlfile in your web browser. - Start managing your tasks with the chosen version!
These apps are intended as learning resources. If you're interested in contributing, you can fork the repository, make improvements, and submit pull requests. You can also suggest new features, add more frameworks, or report any issues you encounter.
This project is licensed under the MIT License.
These apps are developed for educational purposes only. They serve as demonstrations of various web development concepts and technologies. They should not be used in production environments.