Todoist

Log into Todoist at todoist.com. Click your profile avatar in the top-right corner and select 'Settings'. In the Settings page, click the 'Integrations' tab in the left menu. Scroll to the bottom of the Integrations page to find the 'Developer' section. Your Personal API token appears here as a 40-character hexadecimal string. Copy the token. Unlike some APIs, Todoist does not let you generate multiple tokens or revoke individual ones — this single token is tied to your account. If you ever need to invalidate it, you can regenerate it from the same page, but all existing integrations using the old token will stop working immediately. Note that this token never expires unless you regenerate it. It authenticates all API requests as your personal Todoist account, giving access to all your projects, tasks, and labels.

In your Bubble app, open the Plugins tab and confirm the API Connector plugin (by Bubble) is installed. Click 'Add another API' and name it 'Todoist'. Set the Authentication to 'Private key in header'. In the key name field, enter `Authorization`. In the value field, enter `Bearer YOUR_TOKEN_HERE` — replace YOUR_TOKEN_HERE with your actual 40-character Todoist API token. Tick the 'Private' checkbox. A Private header is stored encrypted on Bubble's servers and never included in browser-visible requests. Set the base URL to `https://api.todoist.com/rest/v2`. Add a shared header: Content-Type: application/json. Bubble will now proxy all Todoist calls from its servers using your token. You do not need to configure CORS or create any proxy functions — Bubble's server-side execution handles this automatically.

1{
2  "api_name": "Todoist",
3  "base_url": "https://api.todoist.com/rest/v2",
4  "headers": [
5    {
6      "key": "Authorization",
7      "value": "Bearer <private>",
8      "private": true
9    },
10    {
11      "key": "Content-Type",
12      "value": "application/json",
13      "private": false
14    }
15  ]
16}

Inside the Todoist API group, click 'Add another call'. Name it 'Get Projects'. Set method to GET and path to `/projects`. Click 'Initialize call'. Todoist returns a bare JSON array: `[{"id": "123", "name": "My Project", ...}, ...]`. There is no wrapper key. Bubble initializes this correctly and detects it as a list. In the 'Use as' dropdown, select 'Data' and tick 'List'. If Bubble tries to set it as a single object, manually switch to List. The data type will be named 'Todoist Get Projects' — rename it to 'Todoist Project' in the Bubble data types panel for cleanliness. Add a second call: 'Get Tasks'. Path: `/tasks`. Add two optional query parameters: - project_id (text, dynamic, optional) - filter (text, dynamic, optional — valid values include 'today', 'overdue', 'p1', '@label_name') For initialization, use a filter value of 'today' as the default. Click 'Initialize call'. Todoist returns the task list including fields: id, content, description, project_id, priority (1-4), due (object with date field), labels (array), and is_completed. In the 'Use as' dropdown, select 'Data' and tick 'List'. Bubble detects the nested `due` object — the `due.date` field contains the task due date as YYYY-MM-DD string.

1GET https://api.todoist.com/rest/v2/projects
2Authorization: Bearer <private>
3
4GET https://api.todoist.com/rest/v2/tasks?filter=today
5Authorization: Bearer <private>
6
7// Example task object in response:
8// {
9//   "id": "2995104339",
10//   "content": "Buy groceries",
11//   "description": "",
12//   "project_id": "2203306141",
13//   "priority": 4,
14//   "due": {
15//     "date": "2026-07-10",
16//     "is_recurring": false
17//   },
18//   "labels": [],
19//   "is_completed": false
20// }

Add a third call: 'Create Task'. Set method to POST and path to `/tasks`. Set body type to JSON. Add the following fields to the body: - content (text, dynamic) — the task title; this is the ONLY required field - project_id (text, dynamic, optional) - due_date (text, dynamic, optional — format YYYY-MM-DD) - priority (number, dynamic, optional — values 1, 2, 3, or 4) - description (text, dynamic, optional) For initialization, enter a real content value ('Test task from Bubble') and click 'Initialize call'. Todoist creates a real task and returns the task object. After initialization, delete the test task from Todoist. On your Bubble page, add: - A text input: 'Task content' (required) - A dropdown: 'Project' with choices from Get Projects call - A date picker: 'Due date' - A dropdown: 'Priority' with choices: Normal (value: 1), Medium (value: 2), High (value: 3), Urgent (value: 4) - A 'Create Task' button Create a workflow triggered by the 'Create Task' button: call 'Todoist - Create Task' with content=Task content input's value, project_id=Project dropdown's value, due_date=Due date picker's value formatted as YYYY-MM-DD, priority=Priority dropdown's value. In the On success event, reset the inputs and refresh the tasks repeating group by calling 'Display data → Get Tasks' again.

1POST https://api.todoist.com/rest/v2/tasks
2Authorization: Bearer <private>
3Content-Type: application/json
4
5{
6  "content": "<task_content>",
7  "project_id": "<project_id>",
8  "due_date": "<due_date_YYYY-MM-DD>",
9  "priority": <priority_1_to_4>
10}

To mark a Todoist task as complete, add a call: 'Close Task'. Method: POST. Path: `/tasks/{task_id}/close`. Add a path parameter: task_id (text, dynamic). The close endpoint accepts no body and returns a 204 No Content response on success. In your tasks repeating group, add a checkbox element (or a checkmark icon button). Create a workflow: on click, call 'Todoist - Close Task' with task_id = current cell's task's id. On success, refresh the repeating group. For priority color-coding, Todoist uses this scale: - priority = 1 → Normal (show grey badge) - priority = 2 → Medium (show blue badge) - priority = 3 → High (show orange badge) - priority = 4 → Urgent (show red badge) In your repeating group cell, add a Group element sized to a small pill/badge. Add conditionals on this Group: - When current cell's task's priority = 4 → Background color: #EF4444 (red) - When current cell's task's priority = 3 → Background color: #F97316 (orange) - When current cell's task's priority = 2 → Background color: #3B82F6 (blue) - When current cell's task's priority = 1 → Background color: #9CA3AF (grey) Add a text element inside the badge Group with corresponding conditional labels: 'Urgent', 'High', 'Medium', 'Normal'.

1POST https://api.todoist.com/rest/v2/tasks/{task_id}/close
2Authorization: Bearer <private>
3// No body needed; returns 204 No Content on success
4
5// Priority mapping (Todoist inverted scale):
6// priority = 1 → Normal (lowest)
7// priority = 2 → Medium
8// priority = 3 → High
9// priority = 4 → Urgent (highest)

Todoist due dates live inside a nested `due` object on each task. The `due.date` field is a YYYY-MM-DD string. When a task has no due date, the `due` field itself is null — not an empty object, but null. This means Bubble may show an error or blank text if you reference `task's due's date` without checking for null first. Add a conditional in your due date text element: 'When current cell's task's due is empty, display No due date in grey text; otherwise, display the due's date value.' For overdue detection: compare `due.date` (as a string) with today's date (formatted as YYYY-MM-DD). When due.date < today's date string, the task is overdue. Add a conditional on the row Group: 'When current cell's task's due is not empty AND current cell's task's due's date < Current date/time formatted as YYYY-MM-DD → Background color: light red (#FEE2E2)'. This gives visual overdue alerts. For the projects filter, add a Dropdown above the repeating group. Populate it with the Get Projects call. Add an 'All Projects' option. When the dropdown value changes, update the repeating group data source: 'Get Tasks' with project_id = selected dropdown's value (leave blank for all projects). RapidDev's team builds Todoist widgets embedded in larger Bubble productivity dashboards regularly — if you want to combine this with calendar views, Stripe billing, or team reporting, book a free scoping call at rapidevelopers.com/contact.

1// Due date handling in Bubble conditional expressions:
2// Check: 'current cell's task's due is empty'
3// If not empty: 'current cell's task's due's date'
4// Overdue check: compare date string with formatted current date
5
6// Todoist filter parameter examples:
7// filter=today          → tasks due today
8// filter=overdue        → all overdue tasks
9// filter=p1             → priority 4 (urgent) tasks
10// filter=@work          → tasks with 'work' label
11// filter=today | overdue → today and overdue combined