Skip to content
Preset · built on dashboard

Desktop kit

Start the app kit in an Electron shell with a typed IPC contract and native dialogs.

For: Teams shipping a desktop app for Windows, macOS and Linux who want it to look the same on every machine.

kitr new my-app --kit desktop

First time? Run npm i -g @kitr/kitr once. Inside a project, the global kitr runs your project's own version.

Browse the filesSource
kitr dev app
The Electron window, with hot reload
kitr dev site
The same app in a browser
kitr build app
Installers for your operating system

The dashboard in Electron

The same app runs in a window and, with kitr dev site, in a browser.

A typed IPC contract

app/ipc.ts declares what the app may ask the main process, and both sides are type-checked.

Native dialogs and the OS

The home page opens a file dialog, keeps a secret in the OS vault and sends a notification.

Ready to package

platforms/app/ holds the Electron main process and the electron-builder config.

What's inside

Read from the kit's output in the kitr repository, so it matches what kitr new writes today. 18 packages · 12 components · 56 files.

Platforms
site: webspaapp: desktop
Packages
routerplatformstoragequeryhttpformstablestatetailwindthemetoastauthmockstestingdevtoolssecure-storagenotificationsvite
Components
app-shellbadgebuttoncarddata-tableempty-stateformiconinputlabelpage-headertheme-toggle

Every file it writes

Start with app/ipc.ts. Pick any file to read it.

Source
app/ipc.ts
import { createIpcClient } from '@kitr/desktop/client'
import type { Ipc, IpcPush } from '../platforms/app/ipc'

/** Typed renderer-side client. `ipc.available` is false in a plain browser, so the web build still runs. */
export const ipc = createIpcClient<Ipc, IpcPush>()

Other kits

All kits →