1 2.11 Run the Development Server

github-actions[bot] edited this page 2026-02-20 20:14:22 +00:00

Table of Contents

• Run the Development Server
• Option 1: Local
• Prerequisites
• Local: Clone and Install
• Local: Start the Frontend
• Local: Run the Full App (Electron)
• Option 2: GitHub Codespaces
• Related

Run the Development Server

How to run Super Productivity locally for development, or in GitHub Codespaces.

Option 1: Local

Prerequisites

• Node.js 20 or higher (nodejs.org)
• Git

Local: Clone and Install

git clone https://github.com/super-productivity/super-productivity.git
cd super-productivity
npm i -g @angular/cli
npm i
npm run env

npm run env creates or updates the environment file once; re-run if you add or change variables.

Local: Start the Frontend

ng serve

Open http://127.0.0.1:4200. For most UI and frontend work this is enough. Redux DevTools work in the browser.

Local: Run the Full App (Electron)

ng serve

In a second terminal:

npm start

The Electron window will load the dev server.

Option 2: GitHub Codespaces

1. Open the repository on GitHub.
2. Click Code → Codespaces → Create codespace on main (or the plus icon).
3. Wait for the dev container to build. The development server usually starts automatically.
4. Open the Ports tab, find the forwarded port (e.g. 4200), and use Open in Browser or Ctrl+Click the URL to open the app.

VS Code settings sync in the codespace. To change the dev environment, edit .devcontainers/devcontainers.json per Codespaces documentation.

Related

• 2.16-Set-Up-Development-Environment (environment variables)
• 2.12-Package-the-App

1.00-Quickstarts

• 1.01-First-Steps
• 1.02-Configure-Data-Synchronization

2.00-How_To

Using Super-Productivity

• 2.01-Downloads and Install
• 2.02-Restore-Data-From-Backup
• 2.03-Add-Tasks
• 2.04-Manage-Subtasks
• 2.05-Manage-Scheduled-Tasks
• 2.06-Manage-Repeating-Tasks
• 2.07-Manage-Task-Integrations
• 2.08-Choose-Sync-Backend
• 2.09-Configure-Sync-Backend
• 2.19-Sync-Proton-Drive-via-rclone
• 2.13-Run-with-Docker

Contributing to Super-Productivity

• 2.18-Contribute-Translations
• 2.11-Run-the-Development-Server
• 2.16-Set-Up-Development-Environment
• 2.12-Package-the-App
• 2.14-Build-for-Android
• 2.15-Develop-a-Plugin
• 2.17-Add-a-New-Issue-Integration

3.00-Reference

• 3.01-API
• 3.02-Settings-and-Preferences
• 3.03-Keyboard-Shortcuts
• 3.04-Short-Syntax
• 3.05-Web-App-vs-Desktop
• 3.06-User-Data
• 3.07-Issue-Integration-Comparison
• 3.08-Sync-Integration-Comparison
• 3.09-Theming

4.00-Concepts

Data-and-Integrations

• 4.23-Managing-Your-Data
• 4.24-Integrations

Organizing

• 4.06-Project-View
• 4.07-Tag-View
• 4.08-Time-Estimates
• 4.09-Task-Attributes
• 4.10-Task-Notes
• 4.11-Subtasks

Planning

• 4.03-Planner-View
• 4.04-Schedule-View
• 4.12-Scheduled-Tasks
• 4.13-Repeating-Tasks
• 4.08-Time-Estimates

Doing

• 4.01-The-Today-View
• 4.02-Inbox-View
• 4.05-Board-View
• 4.14-How-Time-Is-Logged
• 4.15-Timers-and-Focus-Mode
• 4.16-Break-Reminders
• 4.17-Idle-Time
• 4.08-Time-Estimates

Reviewing

• 4.14-How-Time-Is-Logged
• 4.08-Time-Estimates
• 4.18-Reflection
• 4.19-Metrics
• 4.20-Task-Archiving
• 4.22-Quick-History
• 4.21-Worklog

If you have further questions, please refer to the discussions page.