Todo List App
A complete Svelte example: Build a todo app with local storage, filters, and CRUD operations
What You'll Learn
- Managing state with Svelte stores
- Implementing CRUD operations
- Working with localStorage
- Filtering and searching todos
- Using transitions and animations
Project Structure
todo-list/ ├── src/ │ ├── lib/ │ │ ├── TodoInput.svelte │ │ ├── TodoList.svelte │ │ ├── TodoItem.svelte │ │ └── TodoFilters.svelte │ ├── stores/ │ │ └── todos.js │ └── App.svelte ├── public/ │ └── index.html └── package.json
Key Features
- Add, edit, and delete todos
- Mark todos as complete
- Filter by status (All, Active, Completed)
- Persistent storage
- Clear completed todos
- Todo count summary
- Smooth animations