# Desktop app: Electron + React + Vite
URL: https://wwadd.dev/stacks/electron-react-vite
Last verified: 2026-09-28

Desktop apps that must look and behave the same on every OS — bundled Chromium, a React UI, and Node.js behind a narrow bridge.

## When to use it
- Rendering has to be identical on Windows, macOS, and Linux, or the app relies on Chromium-only APIs
- The team wants to stay in JavaScript and TypeScript end to end
- You're wrapping an existing web app, or it needs npm packages with native Node.js modules
- Download size and memory use matter less than consistency

## How the pieces fit
Electron ships its own Chromium and Node.js, so the React UI renders the same everywhere. The main process owns windows, menus, the file system, and native modules; the renderer is a normal Vite-built React app. A preload script exposes a small, typed API through contextBridge, with context isolation on and Node.js integration off in the renderer, so web content never touches Node directly. electron-builder produces signed installers for each OS, and electron-updater installs new versions in the background. Local data can live in SQLite through a native module or in IndexedDB.

## The tech and its role
- Electron: Bundled Chromium + Node.js, windows, native APIs
- React + TypeScript: UI in the renderer process
- Vite: Renderer dev server and build
- Preload + contextBridge: Narrow, typed bridge between UI and main process
- electron-builder: Installers, code signing, auto-updates
- SQLite (optional): Local data through a native module

## Real-world examples
- Insomnia: Kong's open-source API client: an Electron app with a React and TypeScript renderer built with Vite, packaged with electron-builder, and updated through electron-updater. (source: https://github.com/Kong/insomnia)
- Signal Desktop: The Signal messenger's desktop app: Electron with React and TypeScript, packaged with electron-builder, storing messages in SQLCipher (encrypted SQLite). (Electron + React example; builds with webpack rather than Vite.) (source: https://github.com/signalapp/Signal-Desktop)

## Skip if
Skip if download size or memory use matters more than identical rendering — Tauri uses the OS webview and ships a fraction of the size.

