electron

Electron cross-platform desktop apps with web technologies. Use for desktop apps.

7 stars

byG1Joshi

View on GitHub Installation ↓

Best use case

electron is best used when you need a repeatable AI agent workflow instead of a one-off prompt.

Electron cross-platform desktop apps with web technologies. Use for desktop apps.

Teams using electron should expect a more consistent output, faster repeated execution, less prompt rewriting.

When to use this skill

You want a reusable workflow that can be run more than once with consistent structure.

When not to use this skill

You only need a quick one-off answer and do not need a reusable workflow.
You cannot install or maintain the underlying files, dependencies, or repository context.

Installation

Claude Code / Cursor / Codex

$curl -o ~/.claude/skills/electron/SKILL.md --create-dirs "https://raw.githubusercontent.com/G1Joshi/Agent-Skills/main/skills/frameworks/electron/SKILL.md"

Manual Installation

Download SKILL.md from GitHub
Place it in .claude/skills/electron/SKILL.md inside your project
Restart your AI agent — it will auto-discover the skill

How electron Compares

Feature / Agent	electron	Standard Approach
Platform Support	Not specified	Limited / Varies
Context Awareness	High	Baseline
Installation Complexity	Unknown	N/A

Frequently Asked Questions

What does this skill do?

Electron cross-platform desktop apps with web technologies. Use for desktop apps.

Where can I find the source code?

You can find the source code on GitHub using the link provided at the top of the page.

SKILL.md Source

# Electron

Electron bundles **Chromium** and **Node.js** into a desktop app. It is the industry standard (VS Code, Slack, Discord) despite the file size.

## When to Use

- **Rich Capabilities**: If you need full Node.js access (Filesystem, Serial Port).
- **Consistent UI**: Loops exactly the same on Windows/Mac/Linux (Pixel Perfect).
- **Legacy**: Migrating an existing web app to desktop with zero changes.

## Core Concepts

### Main Process

The Node.js backend. Controls lifecycle and windows.

### Renderer Process

The Chromium frontend. Displays UI.

### Preload Scripts

The secure bridge between Main and Renderer (Context Isolation).

## Best Practices (2025)

**Do**:

- **Enable Context Isolation**: Critical security feature (`contextIsolation: true`).
- **Use IPC**: `ipcMain` and `ipcRenderer` for communication.
- **Update Chromium**: Security patches come via Electron updates.

**Don't**:

- **Don't use `remote` module**: It is deprecated and insecure.

## References

- [Electron Documentation](https://www.electronjs.org/)