Bước 1: Thêm tool quản lý todo Step 1: Add Todo Management Tools ជំហាន 1: បន្ថែម tool គ្រប់គ្រង todo
- Chúng ta đang xây What we're building អ្វីដែលយើងកំពុងសង់
- Complete CRUD functionality for a todo application with add_new_todo, list_all_todos, and complete_todo tools.
- Vì sao quan trọng Why this matters ហេតុអ្វីសំខាន់
- Demonstrates how AI assistants can create and manage persistent, stateful applications users can interact with over time.
this.server.tool(
"add_new_todo",
"Add a new task to your todo list",
{ task: z.string().describe("Task description") },
async ({ task }) => {
await this.env.TODO_STORE.put(
`${task}`,
JSON.stringify({
completed: false,
createdAt: new Date().toISOString(),
}),
);
return { content: [{ type: "text", text: `Added task: ${task}` }] };
},
);
this.server.tool(
"list_all_todos",
"List all tasks in your todo list",
{},
async () => {
const list = await this.env.TODO_STORE.list();
const tasks = [];
for (const key of list.keys) {
const value = await this.env.TODO_STORE.get(key.name);
if (value) {
let taskData;
try {
taskData = JSON.parse(value);
} catch (e) {
continue;
}
tasks.push(`${taskData.completed ? "✅" : "📋"} ${key.name}`);
}
}
if (tasks.length === 0) {
return {
content: [
{ type: "text", text: "No tasks found. Add some tasks first!" },
],
};
}
return {
content: [
{
type: "text",
text: `Todo List:\n${tasks.join("\n")}`,
},
],
};
},
);
this.server.tool(
"complete_todo",
"Mark a task as completed",
{ task: z.string().describe("Task to mark as completed") },
async ({ task }) => {
const value = await this.env.TODO_STORE.get(task);
if (!value) {
return { content: [{ type: "text", text: `Task "${task}" not found` }] };
}
let taskData;
try {
taskData = JSON.parse(value);
} catch (e) {
return { content: [{ type: "text", text: `Invalid task ${task}` }] };
}
taskData.completed = true;
await this.env.TODO_STORE.put(task, JSON.stringify(taskData));
return { content: [{ type: "text", text: `Completed task: ${task}` }] };
},
); Bước 2: Deploy và test Step 2: Deploy and Test ជំហាន 2: Deploy និង test
Deploy your updated server with npm run deploy, then head to the AI Playground and connect with your deployment URL. If you were already connected, click the refresh button next to “Available Tools” to pick up the new tools.
Deploy your updated server with npm run deploy, then head to the AI Playground and connect with your deployment URL. If you were already connected, click the refresh button next to “Available Tools” to pick up the new tools.
Deploy your updated server with npm run deploy, then head to the AI Playground and connect with your deployment URL. If you were already connected, click the refresh button next to “Available Tools” to pick up the new tools.
Try a natural conversation:
Try a natural conversation:
Try a natural conversation:
- “Add a task to buy groceries”
- “Show me my todo list”
- “Mark ‘buy groceries’ as completed”
- Refresh the page and list tasks again - they persist!
Here is a chat transcript with the qwen3-30b-a3b-fp8 model on the AI Playground and the MCP server we just created.
Here is a chat transcript with the qwen3-30b-a3b-fp8 model on the AI Playground and the MCP server we just created.
Here is a chat transcript with the qwen3-30b-a3b-fp8 model on the AI Playground and the MCP server we just created.