Skip to content
nanohypenanohype

Electron Desktop App (React + esbuild)

Scaffolds an Electron desktop application with a React 19 renderer for AI-powered chat. The main process holds API keys and routes AI calls through IPC, keeping secrets out of the renderer. Uses esbuild for main process bundling and Vite for the renderer. Supports Anthropic and OpenAI as LLM providers with a pluggable registry.

Nameelectron-app
Version0.1.0
Categoryapplications
LicenseApache-2.0
Personaengineering
Tagselectron, desktop, react, typescript, ai, esbuild, vite
Sourcetemplates/electron-app

Render it

Three front doors, one catalog. Pick whichever suits the caller.

# CLI
npx @nanohype/sdk render electron-app --out ./my-app

# SDK
import { LocalSource, renderTemplate } from "@nanohype/sdk";
const result = await renderTemplate(source, "electron-app", variables);

# MCP — from an agent
get_template({ name: "electron-app" })

Prerequisites

ToolVersionWhy
node>=22Node.js runtime for Electron, esbuild, and Vite
electron (optional)—Desktop runtime (installed as npm dependency)

Variables

Required

ProjectName string
Kebab-case project name, used as package name and directory Must be lowercase kebab-case starting with a letter.

Optional

Description string — defaults to Desktop app with AI
Short app description for package.json and README
LlmProvider string — defaults to anthropic
Default LLM provider for AI interactions
IncludeAutoUpdate bool — defaults to false
Include electron-updater for auto-update support
IncludeTests bool — defaults to true
Include test setup with Vitest

What it produces

27 files. Placeholder names such as __APP_NAME__ are what the renderer substitutes into.

.env.example
.gitignore
biome.json
esbuild.config.mjs
package.json
README.md
src/__tests__/ipc.test.ts
src/main/bootstrap.ts
src/main/config.ts
src/main/index.ts
src/main/ipc-handlers.ts
src/main/preload.ts
src/main/providers/anthropic.ts
src/main/providers/index.ts
src/main/providers/openai.ts
src/main/providers/registry.ts
src/main/providers/types.ts
src/renderer/App.tsx
src/renderer/components/Chat.tsx
src/renderer/components/Message.tsx
src/renderer/index.html
src/renderer/main.tsx
src/renderer/styles/globals.css
src/renderer/types.ts
tsconfig.json
vite.config.ts
vitest.config.ts

Composes with