Best Electron Boilerplates for Desktop Apps in 2026
TL;DR
electron-vite for new apps in 2026 — Vite HMR, framework-agnostic, and the fastest DX. electron-react-boilerplate if you want a battle-tested React setup with 7k+ stars. Electron Forge for the officially-recommended toolchain with code signing support. Quasar Desktop if you are on Vue and want to target web, mobile, and desktop from one codebase.
Electron: Still the Desktop Web Standard
Electron powers the most-used developer tools in existence: VS Code (100M+ users), Slack, Discord, Figma, Notion, and 1Password all run on Electron. Despite its reputation for memory usage, Electron remains the most practical way to ship cross-platform desktop apps with web technologies.
In 2026, the Electron ecosystem has matured significantly. Vite replaced Webpack. TypeScript is default. Native module handling is well-understood. The boilerplate landscape has consolidated around a few excellent options.
Quick Comparison
| Starter | Price | Bundler | Framework | TypeScript | Auto-Update | Best For |
|---|---|---|---|---|---|---|
| electron-vite | Free | Vite | Any | ✅ | electron-updater | Modern Electron apps |
| electron-react-boilerplate | Free | Webpack→Vite | React | ✅ | electron-updater | React desktop apps |
| electron-forge | Free | Various | Any | ✅ | Squirrel | Official toolchain |
| Quasar Desktop | Free | Vite | Vue | ✅ | electron-updater | Vue cross-platform |
The Starters
electron-vite — Best Modern Starter
Price: Free (MIT) | Creator: Alex Wei
The modern Electron development toolkit. Vite-based build system, hot module replacement for both main and renderer processes, TypeScript, source code protection, and support for any UI framework (React, Vue, Svelte, Vanilla).
npm create @quick-start/electron@latest my-app
# Choose: React / Vue / Svelte / Vanilla + TypeScript
Project structure:
├── src/
│ ├── main/ # Main process (Node.js)
│ │ ├── index.ts # App entry
│ ├── preload/ # Preload scripts (IPC bridge)
│ │ ├── index.ts
│ └── renderer/ # Renderer process (web app)
│ ├── src/ # Your UI framework code
└── electron.vite.config.ts
The key advantage over older Electron starters is the Vite integration. Hot module replacement works across all three layers — main, preload, and renderer — so you see changes in under a second without restarting the entire Electron process. Source code protection via bytecode compilation is also built in, which matters if you are shipping commercial software.
Choose if: You want the fastest modern Electron development experience with Vite HMR and you have no strong framework preference.
electron-react-boilerplate — Best React Desktop
Price: Free (MIT) | Creator: Community (7k+ stars)
Long-running, production-proven React + Electron boilerplate. Recently migrated to Vite from Webpack. React Router, TypeScript, Jest + React Testing Library, ESLint, electron-updater for automatic updates, and GitHub Actions releases.
The community behind this project has been maintaining it since 2015, which means years of solved edge cases. GitHub Actions workflows for packaging and releasing to all three platforms are included out of the box. The architecture follows best practices for the main/preload/renderer split.
If you have worked with Create React App in the past, the folder structure will feel familiar. The migration to Vite means the slow rebuild times from the Webpack era are gone.
Choose if: React is your UI of choice and you want a mature, community-maintained boilerplate with an extensive commit history.
Electron Forge — Best Official Toolchain
Price: Free | Creator: OpenJS Foundation
The official Electron build/test/package toolchain. Framework-agnostic — use with React, Vue, Angular, or vanilla JavaScript. Handles code signing, notarization, auto-updates, and distribution. The recommended approach from the Electron documentation.
npm init electron-app@latest my-app --template=webpack
# or
npm init electron-app@latest my-app --template=vite
Forge's plugin system is the differentiator. The @electron-forge/plugin-vite gives you a Vite setup, while the packager plugins handle platform-specific outputs: .exe installers via NSIS, .dmg images for macOS, and AppImage/deb for Linux. Because Forge is maintained by the Electron team itself, it tracks compatibility with new Electron releases faster than community alternatives.
Choose if: You want the officially recommended toolchain, maximum flexibility in your framework choice, and first-party support for code signing.
Quasar Desktop — Best Vue Cross-Platform
Price: Free (MIT) | Creator: Quasar Team
Quasar is a Vue 3 framework with a single codebase that targets web, Electron desktop, Capacitor mobile (iOS/Android), and browser extensions. The Electron mode is a first-class target, not an afterthought.
The pitch is write-once, ship-everywhere. A Quasar component tree renders in the browser as a SPA or SSR app, in Electron as a desktop app, and via Capacitor as a native mobile app. The Quasar CLI handles the platform switching.
When does it make sense over standalone Electron? If you are already building a Vue web app and want to ship a desktop version without maintaining a separate codebase. The tradeoff is that Quasar adds an opinionated layer on top of Vue — you get its component library, routing conventions, and build tooling rather than setting those up yourself.
Choose if: You are on Vue 3, you want to target multiple platforms from one codebase, and you are comfortable adopting the Quasar conventions and component library.
Electron Architecture Essentials
Main vs Renderer Process
Electron's two-process architecture is the most important concept to understand:
// main/index.ts — Node.js process, full OS access
import { app, BrowserWindow, ipcMain } from 'electron';
ipcMain.handle('read-file', async (event, path) => {
return fs.readFile(path, 'utf8'); // Full Node.js access
});
// preload/index.ts — Bridge between main and renderer
import { contextBridge, ipcRenderer } from 'electron';
contextBridge.exposeInMainWorld('api', {
readFile: (path: string) => ipcRenderer.invoke('read-file', path)
});
// renderer/src/App.tsx — Sandboxed web app
function App() {
const readFile = async () => {
const content = await window.api.readFile('/path/to/file');
// Access Node.js capabilities safely
};
}
Good boilerplates set up this IPC pattern for you. Bad boilerplates nodeIntegration: true everywhere (security risk).
Auto-Updates
Every production Electron app needs automatic updates. Users do not manually download new versions of VS Code — it just updates. Your app should too.
// main/index.ts
import { autoUpdater } from 'electron-updater';
autoUpdater.on('update-available', () => {
// Notify user
});
autoUpdater.on('update-downloaded', () => {
autoUpdater.quitAndInstall();
});
autoUpdater.checkForUpdatesAndNotify();
electron-vite and electron-react-boilerplate both include this configured correctly. The default update source is GitHub Releases, which costs nothing. For S3-hosted updates — which give you more control over rollout timing and rollback — configure the publish key in your electron-builder.yml to point at an S3 bucket. S3 hosting lets you stage a release to 10% of users first, watch crash reports, and expand to 100% only when you are confident. GitHub Releases is simpler but gives you no staged rollout capability.
Code Signing and Distribution
This is the topic most boilerplate guides skip, and it will block your first real release.
macOS Code Signing
Apple requires that apps distributed outside the Mac App Store be code-signed and notarized. Without notarization, macOS Gatekeeper will block users from opening your app unless they navigate through a multi-step workaround in System Preferences. Most users will not do this.
You need an Apple Developer account ($99/year). Notarization runs through Apple's servers and takes 1–5 minutes per build. electron-builder handles the submission automatically when you configure your signing credentials.
Windows Code Signing
Windows Defender and SmartScreen show a warning when users run unsigned executables. This is a significant trust barrier for your first releases. An EV (Extended Validation) code signing certificate costs $300–500/year from providers like DigiCert or Sectigo. Standard OV certificates are cheaper but take longer to build reputation with SmartScreen.
electron-builder Configuration
electron-builder handles code signing for both platforms when configured:
# electron-builder.yml
appId: com.yourcompany.yourapp
productName: YourApp
mac:
category: public.app-category.developer-tools
hardenedRuntime: true
gatekeeperAssess: false
entitlements: build/entitlements.mac.plist
entitlementsInherit: build/entitlements.mac.plist
notarize:
teamId: YOUR_APPLE_TEAM_ID
win:
certificateSubjectName: "Your Company Name"
signingHashAlgorithms: ["sha256"]
publish:
provider: github
owner: your-username
repo: your-repo
Set APPLE_ID, APPLE_APP_SPECIFIC_PASSWORD, and CSC_LINK (the .p12 certificate path) as environment variables in your CI environment. GitHub Actions secrets work well for this.
Native Modules
Native modules are Node.js packages that include compiled C++ code: better-sqlite3, sharp, canvas, bcrypt, and node-pty are common examples. They must be compiled against a specific Node.js version's ABI — and Electron ships its own Node.js version, which usually differs from the system Node.js.
If you install a native module with your system Node.js and then run it in Electron, you get a cryptic error about a module not being built for the right Node.js version.
The fix is rebuilding native modules for Electron's Node.js version. electron-rebuild handles this:
npm install --save-dev @electron/rebuild
./node_modules/.bin/electron-rebuild
electron-vite and Electron Forge both have hooks that run this rebuild step automatically during the build process. electron-react-boilerplate includes it as a postinstall script. If you roll your own setup, you will need to wire this up yourself — it is one of the more common causes of "works on my machine, fails in production" bugs in Electron apps.
If you are using better-sqlite3 specifically, prefer it over the sqlite3 package — it is synchronous, faster, and more reliable to rebuild for Electron.
Packaging and Distribution Strategies
Electron Builder vs Electron Forge
Both handle cross-platform packaging, but they have different philosophies. Electron Builder is a standalone tool focused purely on packaging and distribution — it has no opinion about your dev server or build system. Electron Forge is an end-to-end toolchain that handles dev server, testing, building, and distribution in one opinionated package.
For most projects, electron-builder gives more flexibility at the cost of more configuration. Electron Forge gives less flexibility but requires fewer decisions upfront.
Platform Output Formats
| Platform | Format | Notes |
|---|---|---|
| Windows | NSIS installer | Familiar .exe installer, handles upgrades |
| Windows | Portable | Single .exe, no install required |
| macOS | DMG | Drag-to-Applications installer |
| macOS | PKG | For Mac App Store submission |
| Linux | AppImage | Single file, runs anywhere |
| Linux | deb | Debian/Ubuntu systems |
| Linux | rpm | Fedora/RHEL systems |
Distribution Channels
GitHub Releases is the default for most open-source and indie projects. electron-builder uploads your artifacts automatically on CI. Combined with electron-updater, it gives you free hosting and automatic update delivery.
Microsoft Store and Mac App Store give you discoverability and the ability to charge through platform billing. Both require additional configuration (sandboxing, different signing flows) and review processes. Electron Forge has specific makers for both stores. Start with direct distribution and add stores later.
Electron vs Tauri
The key decision for desktop apps in 2026:
| Electron | Tauri | |
|---|---|---|
| Bundle size | 50-200MB | 3-30MB |
| Memory | 100-500MB | 10-50MB |
| Language | JavaScript | Rust + JavaScript |
| Webview | Bundled Chromium | System webview |
| Maturity | 2013, very mature | 2022, growing fast |
| Consistency | ✅ Same renderer everywhere | ⚠️ System webview varies |
Tauri wins on size and memory. Electron wins on consistency and ecosystem maturity.
When to Start with Electron
Use Electron when:
- Your team knows JavaScript/TypeScript and does not want to learn Rust
- You need consistent rendering behavior across Windows, macOS, and Linux
- You are building a tool that your users will compare to VS Code or Notion (expectations are set by Electron apps)
- You have web app code you want to reuse directly in the desktop app
- You need a large npm ecosystem — native Node.js modules, database drivers, etc.
- Your app needs to run on Linux distributions that ship old WebKit versions (Tauri's system webview is notoriously inconsistent on older Linux)
Consider Tauri when bundle size is a hard product requirement — shipping a 150MB installer for a simple utility is hard to justify. Also consider Tauri if you have Rust experience on the team and want the security benefits of a memory-safe backend.
Conclusion
For most developers starting a new desktop app in 2026, electron-vite is the right starting point. It pairs Vite's fast feedback loop with a clean architecture that separates main, preload, and renderer concerns correctly. If your team is React-specific and wants a boilerplate with years of production use behind it, electron-react-boilerplate is the mature alternative.
Plan for code signing early — it is not an optional polish step, it is required for users to trust and run your app. Factor the $99–500/year certificate cost into your product budget before launch.
Browse the full list of Electron starters on StarterPick, compare cross-platform options in the desktop boilerplate category, or see how Electron stacks up against its main alternative in the best Tauri boilerplates guide. The desktop app market has seen renewed interest driven by AI-native applications — tools like local model runners, AI-powered writing apps, and offline-capable developer tools are choosing Electron for its mature Node.js integration and Web API access, keeping the framework highly relevant for new projects in 2026.
As your Electron app matures, two boilerplate decisions compound. Testing desktop apps is harder than testing web apps — IPC calls, file system access, and OS-specific behavior all require different strategies than standard Jest unit tests. The best boilerplates for testing guide covers which starters include Playwright for E2E, Spectron patterns, and mocking approaches for Electron's main/renderer split. If you're adding AI features — Ollama for local inference, Claude API for user-facing features — the guide to adding AI features to your boilerplate covers patterns that work within Electron's process boundaries.
Check out this boilerplate
View electron-viteon StarterPick →