DEV Community

Fayaz Bin Salam
Fayaz Bin Salam

Posted on

I built a clean Electron + React + Shadcn starter so I'd never have to wire it up from scratch again

Every time I sat down to start a new desktop app, the first hour was always the same boring dance. Bolt Vite onto Electron, wire React, sprinkle TypeScript, set up Tailwind, install Shadcn, then fight the build config until it stops crying.

Eventually I stopped re-doing it and extracted the parts that always have to be there into a starter. It's been sitting at ~80 stars on GitHub without much promotion, which suggests other folks were doing the same dance.

What's in the box

  • Electron + electron-forge + electron-vite — instant dev reload, one-command packaging for mac/win/linux
  • React + TypeScript
  • TailwindCSS + shadcn/ui — real components, not just primitives
  • usm-redux for state — lighter than redux-toolkit, less boilerplate than scaling vanilla zustand into a large app
  • Prettier + ESLint preconfigured so the linter shuts up day one

The non-obvious part

The bit that took the longest to settle was keeping the main process and the renderer process completely separate in the Vite config so HMR doesn't get confused when you touch a preload script. If you've ever had Vite quietly stop hot-reloading after you edited preload.ts, you know the exact bug. Once that clicked, everything else slotted in.

Commands you actually use

yarn          # install
yarn dev      # develop
yarn build:mac    # ship mac
yarn build:win    # ship windows
yarn build:linux  # ship linux
Enter fullscreen mode Exit fullscreen mode

Repo

electron-shadcn-typescript on GitHub

https://github.com/p32929/electron-shadcn-typescript

If you've been stalling at the setup phase before building a desktop app — clone it, run it, build something. Would love stars / forks / issues if it saves you some setup time.

Open to collaborating with sharp teams and solo founders on real product work — DMs / email open at github.com/p32929.

Top comments (0)