Skip to content

DEVELOPER.md

Latest commit

 

History

History
38 lines (26 loc) · 1.68 KB

DEVELOPER.md

File metadata and controls

38 lines (26 loc) · 1.68 KB

Web Deck – Developer Guide

This document describes the internal architecture and protocols of the Web Deck shell.

🏗️ Architecture

Web Deck uses a multi-view approach where the system UI and apps are managed as BrowserView instances on top of a single BrowserWindow.

  • Main shell: src/main/index.js manages the lifecycle of BrowserViews.
  • System UI: A transparent/persistent overlay at the bottom of the screen.
  • Apps: Dynamic web pages loaded into their own containers.

📡 IPC Protocol

The following channels are used for communication between the Renderer and Main processes via the webdeck context bridge.

⬆️ Renderer to Main (Send)

  • nav-back: Request the active app to go back in history.
  • nav-home: Switch to the Launcher view.
  • nav-recents: Switch to the Recents (Task Manager) view.
  • load-app: Load a specific app. Payload: { id: string, title: string, url: string }.
  • kill-app: Terminate a running app. Payload: appId: string.

⤴️ Renderer to Main (Invoke)

  • get-apps: Returns the list of apps defined in apps.json.
  • get-running-apps: Returns the list of currently open apps (including screenshots).

⬇️ Main to Renderer (Listen)

  • refresh-recents: Notifies the Recents view to reload the list of running apps.

🛠️ Development Workflow

  1. Quick Run: npm run dev (builds renderer once and starts Electron).
  2. HMR Mode:
    • Step 1: npm run dev:renderer (starts the Vite dev server).
    • Step 2: npm run dev:electron (starts Electron pointing to the dev server).

The shell identifies the view mode via a URL query parameter ?mode=... (e.g., launcher, recents, overlay).