This project is a simple todo list application built with Vue.js. It allows users to add, manage, and hide completed tasks in an easy-to-use interface.
- ➕ Add a Task: Users can enter and add new tasks with ease.
- ✅ Complete a Task: Mark tasks as completed by checking the checkbox.
- 👁️ Hide Completed Tasks: Option to hide tasks that have already been completed.
- 📋 Task Sorting: Tasks are automatically sorted, with incomplete tasks displayed at the top.
Make sure you have Node.js (version 14+) and Vue.js (version 3) installed.
-
Clone the repository: git clone https://github.com/OgulcanSevinc/TodoList.git
-
Navigate to the project directory: cd vue-project
-
Install dependencies: npm install
-
Run the application: npm run dev
- Add a Task: Enter a task in the input field and click the "Add" button.
- Complete a Task: Once a task is finished, check the box next to it.
- Hide Completed Tasks: Toggle the checkbox at the bottom to hide tasks that are marked as completed.
- Change Task Input Placeholder: Modify the placeholder text for the task input field in the template.
- Customize Task Style: Edit the
.completed
CSS class to change how completed tasks are displayed.