Todo 應用程式
使用 AI Agent 建立
hero.badgeHub

Todo 應用程式後端模板
hero.subtitleHub

hero.descriptionHub

使用 AI Agent 建立hero.chooseTechBtn

主要心得

takeaways.introHub

  1. 在幾分鐘內部署 — 貼上 AI Agent 提示，並取得包含前端、後端和資料庫的執行應用程式。
  2. 預設安全 — 行層級 ACL 可確保每個使用者只能看到自己的待辦事項。
  3. {tech}-native SDK — 類型的物件、async/await、離線 pinning 以及 Live Queries 開箱即用。
  4. rest + __brand0__ — 這兩個 API 都是自動產生的，不需要撰寫自訂端點。
  5. 兩個班級 — _User (內建認證) 和 Todo (具有標題、已完成、到期日、優先順序、所有者的任務)。

definition.headingHub

definition.bodyHub

最適合

應用程式開發人員快速原型製作黑客研討會學習後端開發MVP 推出選擇 BaaS而非自訂後端的團隊

概述

Todo 應用程式是學習後端開發最常見的起點之一。它需要使用者註冊、任務 CRUD、基於所有權的存取控制，以及可選擇的即時同步。

overview.p2Hub

whyTech.headlineHub

whyTech.introHub

    每個堆疊都有相同的模式和 API - 稍後可切換用戶端，而無需變更後端。

    核心優勢

    生產就緒的 Todo 後端，讓您可以更快速地出貨並專注於您的應用程式。

    出貨速度更快，無需後端程式碼

    REST 和 GraphQL API 以及即用型模式 - 連接您的應用程式即可使用。

    預設安全

    ACL 和類別層級權限，讓使用者只能存取自己的資料。

    即時更新

    透過 WebSockets Live Queries 即時更新使用者介面。

    內建認證

    使用者註冊、登入及會話處理功能開箱即用 - 無須自訂 auth 層。

    離線工作

    本機釘選功能可保持資料離線可用，並在您重新連線時進行同步。

    在幾分鐘內部署

    使用 AI Agent 從此範本建立並部署您的 Todo 應用程式。

    準備好試試了嗎？

    midCta.bodyHub

    使用 AI Agent 建立嘗試 API 遊樂場

    免費開始 - 每月 50 個 AI 代理提示，無需信用卡

    技術堆疊

    此 Todo 應用程式範本的所有功能一目了然。

    ER 圖

    erDiagram.subtitleHub

    檢視圖表來源
    Mermaid
    erDiagram
    _User {
        String objectId PK
        String username
        String email
        String password
        Date createdAt
        Date updatedAt
    }

    Todo {
        String objectId PK
        String title
        Boolean done
        Date dueDate
        Number priority
        Pointer owner FK
        Date createdAt
        Date updatedAt
    }

    _User ||--o{ Todo : "owns"

    整合流程

    integrationFlow.subtitleHub

    檢視圖表來源
    Mermaid
    sequenceDiagram
  participant User
  participant App as Your App
  participant Back4app as Back4app Cloud

  User->>App: Login
  App->>Back4app: POST /login (username, password)
  Back4app-->>App: Session token
  App-->>User: Logged in

  User->>App: Load todos
  App->>Back4app: GET /classes/Todo
  Back4app-->>App: List of Todo objects
  App-->>User: Show list

  User->>App: Create todo
  App->>Back4app: POST /classes/Todo
  Back4app-->>App: Todo (objectId)
  App-->>User: Updated list

    資料詞典

    模式中每個類別的完整欄位參考。

    現場類型說明必須
    objectIdStringAuto-generated unique identifier自動
    titleStringShort description of the task
    doneBooleanWhether the task is completed—
    dueDateDateOptional deadline for the task—
    priorityNumberPriority level (1 = high, 3 = low)—
    ownerPointer<_User>User who owns this task—
    createdAtDateAuto-generated creation timestamp自動
    updatedAtDateAuto-generated last-update timestamp自動

    Todo中的8字段

    安全性與權限

    擁有權、ACL 及類別層級權限如何保護此模式中的資料。

    行層級 ACL

    每個 Todo 都有一個與擁有者綁定的 ACL。只有建立者可以讀取、更新或刪除自己的任務。

    等級權限

    CLP 限制哪些角色或使用者可以在類別層級建立、讀取、更新或刪除物件，這是您的第一道防線。

    指針型所有權

    所有者指標 (owner Pointer) 會將每個 Todo 連結至其 _使用者。雲端程式碼觸發器可自動設定所有權，並強制執行儲存的 ACL。

    模式 (JSON)

    原始 JSON 方案定義 - 複製並在您的 Back4app 應用程式中使用，或透過 API 匯入。

    JSON
    {
  "classes": [
    {
      "className": "Todo",
      "fields": {
        "objectId": {
          "type": "String",
          "required": false
        },
        "title": {
          "type": "String",
          "required": true
        },
        "done": {
          "type": "Boolean",
          "required": false,
          "defaultValue": false
        },
        "dueDate": {
          "type": "Date",
          "required": false
        },
        "priority": {
          "type": "Number",
          "required": false,
          "defaultValue": 3
        },
        "owner": {
          "type": "Pointer",
          "targetClass": "_User",
          "required": false
        },
        "createdAt": {
          "type": "Date",
          "required": false
        },
        "updatedAt": {
          "type": "Date",
          "required": false
        }
      }
    },
    {
      "className": "_User",
      "fields": {
        "objectId": {
          "type": "String",
          "required": false
        },
        "username": {
          "type": "String",
          "required": true
        },
        "email": {
          "type": "String",
          "required": true
        },
        "password": {
          "type": "String",
          "required": true
        },
        "createdAt": {
          "type": "Date",
          "required": false
        },
        "updatedAt": {
          "type": "Date",
          "required": false
        }
      }
    }
  ]
}

    使用 AI Agent 建立

    使用 Back4app AI Agent 從這個範本建立一個真正的 Todo 應用程式：它會建立前端、後端（此模式、認證和 API），並部署它 - 無須手動設定。下面的提示描述了這個 Todo 堆疊，因此 Agent 可以一次產生一個可供生產的應用程式。

    AI 代理商
    準備建造
    請使用以下確切的架構與行為在 Back4app 上建立 Todo 應用程式。

架構：
1. _User（使用 Back4app 內建）：username（字串，必填）、email（字串，必填）、password（字串，必填）；objectId、createdAt、updatedAt（系統）。
2. Todo：title（字串，必填）、done（布林，預設：false）、dueDate（日期，選填）、priority（數字，預設：3；1=高，2=中，3=低）、owner（指向 _User 的指標；建立時設為目前使用者）；objectId、createdAt、updatedAt（系統）。

安全性：
- 為每個 Todo 設定 ACL，僅允許擁有者讀寫。不開放公開讀寫。
- 建立時將 Todo.owner 設為目前使用者（例如透過 Cloud Code beforeSave 或用戶端）。
- 使用類別層級權限，僅允許已驗證使用者建立/讀取/更新/刪除 Todo。

認證：
- 註冊（username、email、password）與登入；支援登出/工作階段。
- 登入後，應用程式應僅顯示並允許目前使用者之 todo 的 CRUD。

行為：
- Todo 完整 CRUD：建立、列表（僅擁有者）、取得單一、更新（切換 done、編輯標題、dueDate、priority）、刪除。
- 列出 todo 並排序（例如依 priority 再 dueDate 或 createdAt）。新 todo 的預設 priority：3（低）。

交付：
- 使用上述架構、ACL 及所需 Cloud Code（例如在 Todo 的 beforeSave 設定 owner）建立 Back4app 應用程式。
- 產生前端並連接到此後端；部署使應用程式可端對端執行。

    按下下面的按鈕，即可開啟預先填入此範本提示的 Agent。

    agent.promptSuffixNote

    在幾分鐘內部署每月 50 個免費提示無需信用卡

    API 遊樂場

    請嘗試 Todo 方案的 REST 和 GraphQL 端點。來自上述範例資料的回應 - 不需要 Back4app 帳戶。

    正在載入遊樂場...

    使用與此模板相同的 Todo 模式。

    選擇您的技術

    每個指南都包括逐步的SDK整合、狀態管理模式、完整的數據模型和技術特定的AI代理提示。

    Flutter
    chooseTech.viewGuide
    React
    chooseTech.viewGuide
    React Native
    chooseTech.viewGuide
    Next.js
    chooseTech.viewGuide
    JavaScript
    chooseTech.viewGuide
    Android
    chooseTech.viewGuide
    iOS
    chooseTech.viewGuide
    Vue
    chooseTech.viewGuide
    Angular
    chooseTech.viewGuide
    GraphQL
    chooseTech.viewGuide
    REST API
    chooseTech.viewGuide
    PHP
    chooseTech.viewGuide
    .NET
    chooseTech.viewGuide

    chooseTech.whatYouGetHeading

    chooseTech.whatYouGetSubtitle

    常見問題

    有關 Todo 應用程式後端模板的常見問題。

    什麼是 Back4app？
    為什麼 Todo 應用程式要使用 Back4app？
    Todo 應用程式範本包含哪些內容？
    這個範本如何控制資料存取？
    我可以在部署后扩展 Todo 模式吗？
    如何篩選和排序待辦事項？
    範本是否支援即時更新？
    如何為任務新增類別或標籤？

    受到全球開發人員的信賴

    加入打造應用程式未來的社群

    G2 Users Love Us Badge

    準備好建立您的 Todo App 嗎？

    finalCta.subtitleHub

    finalCta.chooseTechBtn