desktop
Electron desktop development guide — IPC handlers, controllers, preload scripts, window/menu management.
- Installs
- 4.2K
- Last 24h
- —
- Trending rank
- —
- Security
- Warn
Install
Works with every agent the skills CLI supports.
npx skills add https://github.com/lobehub/lobehub --skill desktop- 01
Install
Run the command in your project. The CLI asks which agents to install for.
- 02
Describe the task
Ask your agent for something this skill covers. It loads desktop automatically when relevant.
- 03
Review the result
The agent follows the SKILL.md steps, scripts and references bundled with the skill.
Security audits
Independent scans of the skill's instructions and bundled files.
SKILL.md
The instructions your agent reads when the skill is triggered.
Desktop Development Guide
Architecture Overview
LobeHub desktop is built on Electron with main-renderer architecture:
- Main Process (
apps/desktop/src/main): App lifecycle, system APIs, window management - Renderer Process: Reuses web code from
src/ - Preload Scripts (
apps/desktop/src/preload): Securely expose main process to renderer
Adding New Desktop Features
1. Create Controller
Location: apps/desktop/src/main/controllers/
import { ControllerModule, IpcMethod } from '@/controllers';
export default class NewFeatureCtr extends ControllerModule {
static override readonly groupName = 'newFeature';
@IpcMethod()
async doSomething(params: SomeParams): Promise<SomeResult> {
// Implementation
return { success: true };
}
}
Register in apps/desktop/src/main/controllers/registry.ts.
2. Define IPC Types
Location: packages/electron-client-ipc/src/types/<domain>.ts, re-exported from types/index.ts
export interface SomeParams {
/* ... */
}
export interface SomeResult {
success: boolean;
error?: string;
}
3. Create Renderer Service
Location: src/services/electron/
import { ensureElectronIpc } from '@/utils/electron/ipc';
const ipc = ensureElectronIpc();
export const newFeatureService = async (params: SomeParams) => {
return ipc.newFeature.doSomething(params);
};
4. Implement Store Action
Location: src/store/
5. Add Tests
Location: beside the controller, apps/desktop/src/main/controllers/<Name>Ctr.test.ts (source-layout §2)
Detailed Guides
See references/ for specific topics:
- Feature implementation:
references/feature-implementation.md - Local tools workflow:
references/local-tools.md - Menu configuration:
references/menu-config.md - Window management:
references/window-management.md
FAQ
What does the desktop skill do?
Electron desktop development guide — IPC handlers, controllers, preload scripts, window/menu management.
How do I install desktop?
Run npx skills add https://github.com/lobehub/lobehub --skill desktop in your project. The skills CLI detects the agents you use and copies the skill into the right folder. For Claude Code you can also place the skill folder at ~/.claude/skills/desktop/ (personal) or .claude/skills/desktop/ (project).
Which AI agents can use desktop?
Any agent that supports the open Agent Skills format (a folder with a SKILL.md file), including Claude Code, Codex, Cursor, GitHub Copilot, Gemini CLI, Windsurf, Cline, OpenCode and more.
Is desktop safe to install?
Security partners have reviewed it: Gen Agent Trust Hub passed; Socket flagged items to review; Snyk passed; Runlayer flagged items to review; ZeroLeaks passed. As with any skill, read the SKILL.md and bundled scripts before installing.
Who maintains desktop?
It is published by lobehub in lobehub/lobehub. It has 4,231 recorded installs.
More from lobehub/lobehub
zustand
lobehub/lobehub
Use for Zustand stores: state shapes and type sources, state-only stores with xActions classes, replica-backed list/detail data (local-replica), selectors, optimistic writes, and legacy slice/internal action composition.
react
lobehub/lobehub
Use for TSX components, UI libraries, styling, state locality, layout, render performance and memoization.
drizzle
lobehub/lobehub
Use for Drizzle schemas and queries: tables, indexes, relations, joins and inferred types. Rollout belongs to db-migrations.
typescript
lobehub/lobehub
Use for TypeScript style and type safety when editing TS/TSX/MTS, including imports, async code and error suppression.
i18n
lobehub/lobehub
Use for user-facing strings and react-i18next locale keys, namespaces, interpolation, translations or bun run i18n.
project-overview
lobehub/lobehub
Use for the OSS repository map, code-layer lookup, apps/packages/src ownership and business stubs.
Popular other skills
hyperframes-cli
heygen-com/hyperframes
The HyperFrames CLI by job - scaffold, check, look at frames, edit the timeline, preview, render locally or in the cloud, publish, project history - plus reading its JSON and recovering from build or render failures.
triage
mattpocock/skills
Move issues and external PRs through a state machine of triage roles, categorise, verify, grill if needed, and write agent-ready briefs.
ask-matt
mattpocock/skills
Ask which skill or flow fits your situation. A router over the skills in this repo.
to-questionnaire
mattpocock/skills
Turn a decision you can't fully answer into a questionnaire for someone else to fill in.
loop-me
mattpocock/skills
Grill me about specs for the workflows I want to build, within this workspace.