Project

Electron + Next.js App

A production-ready Electron + Next.js 16 app for building modern desktop and web applications from a single React codebase.

Open Source
2 days
•Creator & Maintainer
NextronElectronNext.js 16React 19TypeScriptTailwind CSS
Electron + Next.js App screenshot 1

#Overview

A batteries-included starter kit for building cross-platform desktop apps with Electron and full-featured web apps with Next.js 16, sharing the same React codebase. It includes opinionated structure, hot reload, and production build tooling.

#Key Features

  • ▹Electron + Next.js 16 integration using Nextron
  • ▹Single shared React codebase for web and desktop
  • ▹TypeScript-first setup with strict configuration
  • ▹Hot reload for renderer (Next.js) and main Electron process
  • ▹Production-ready bundling and packaging for desktop apps
  • ▹Clean separation between main, preload, and renderer code
  • ▹Environment variable handling for both web and desktop builds
  • ▹Scalable project structure suitable for real-world apps

#Challenges & Solutions

Challenge

Integrating Electron with the Next.js App Router while keeping the developer experience smooth and maintaining a simple build pipeline for both web and desktop targets.

Solution

Used Nextron to bridge Electron and Next.js, organized the project into clear main/preload/renderer layers, and configured scripts and tooling so the same React components can power both the browser-based app and the desktop application.

Project Info

Company:

Open Source

Role:

Creator & Maintainer

Duration:

2 days

Category:

Project

Want to Learn More?

Check out the complete documentation to understand the project architecture, setup instructions, and detailed API references.