Todo App Tutorial
⏱️ 30 minutes Build a complete task manager with adding, completing, and persisting tasks. You’ll learn about lists, forms, state management, and local data storage.What You’ll Build
A todo app that:- Shows a list of tasks
- Lets you add new tasks
- Mark tasks as complete
- Delete tasks
- Saves everything locally (persists between app launches)
Part 1: Create the App
Start a New Project
On the Nativeline home page, enter this description:Complete the Wizard
- Who is this for? — Just me
- Feel — Simple & clean
- Priority — Core functionality first
- Colors — Choose any palette
- Name — Todo List
Part 2: Review What You Have
Your app should have:- A list view (possibly empty)
- A way to add tasks
- Basic styling
Part 3: Add Task Input
If your app doesn’t have a good way to add tasks, let’s improve it:- Type a task
- Tap Add
- See it appear in the list
Part 4: Add Checkboxes
Let’s add the ability to complete tasks:Part 5: Add Delete Functionality
Now let’s add the ability to remove tasks:Part 6: Make It Persistent
Right now, tasks disappear when you close the app. Let’s fix that:- Add a few tasks
- Press Cmd+Shift+H to go to home screen in Simulator
- Reopen the app
- Your tasks should still be there!
Part 7: Polish the Design
Let’s make it look professional:Part 8: Add Task Details (Optional)
Want to go further? Add due dates:Part 9: Add Categories (Optional)
Organize tasks with categories:Final Result
You now have a fully functional todo app with:- ✅ Task creation
- ✅ Completion with visual feedback
- ✅ Deletion
- ✅ Local persistence
- ✅ Polished design
- ✅ (Optional) Due dates
- ✅ (Optional) Categories
What You Learned
This tutorial taught you:| Concept | How It Was Used |
|---|---|
| Lists | Displaying multiple tasks |
| Forms | Text field for input |
| State | Tracking completion status |
| Persistence | Saving with SwiftData |
| Gestures | Swipe to delete |
| Styling | Shadows, rounded corners, colors |
Tips & Troubleshooting
Tasks aren't saving
Tasks aren't saving
Make sure you asked for SwiftData or local persistence. Try:
“Save tasks using SwiftData so they persist when the app is closed”
Swipe to delete isn't working
Swipe to delete isn't working
Some implementations might not have swipe. You can ask:
“Use the standard iOS swipe-to-delete gesture on the list”
The design looks cramped
The design looks cramped
Ask for more spacing:
“Add 16pt padding around the list and 12pt spacing between tasks”
I want to edit tasks
I want to edit tasks
Add editing functionality:
“Let me tap a task to edit its title in a sheet”
Challenge: Extend Your App
Try adding these features on your own:- Search — Add a search bar to filter tasks
- Priority levels — High, Medium, Low with colors
- Sorting — Sort by date, priority, or alphabetically
- Statistics — Show how many tasks you’ve completed this week
- Themes — Let users choose between light and dark mode