DEV Community

29 x
29 x

Posted on

Build Electron Apps Like NestJS: Modular Architecture, Multi-Window Management, and Typed IPC Communication

Build Electron Apps Like NestJS: Modular Architecture, Multi-Window Management, and Typed IPC Communication

When we develop Electron applications, the main process often becomes a tangled mess: window creation logic is scattered everywhere, ipcMain handlers are registered imperatively all over the place, and communication logic is tightly coupled. Maintenance becomes increasingly difficult as the application grows.

As a full-stack developer with experience in NestJS, I wanted to apply Nest’s modular thinking to the Electron main process.

That’s why I created this project:

👉 🔗 GitHub Repository: X29w/electronest

✨ What Is This Project?

This is a highly scalable and elegant Electron + Vite + NestJS full-featured template that supports:

  • 💠 Main process architecture inspired by NestJS
  • 🪟 Modular multi-window management system
  • 🔌 Type-safe, decorator-based IPC communication
  • 📦 Independent NestJS server integrated into Electron
  • 🔄 Built-in auto-registration of modules, services, and IPC handlers
  • 💡 Perfect for large Electron applications

🔍 Core Innovations

1. 🧱 NestJS-Inspired Architecture for Electron Main Process

Inspired by @Module(), @Injectable(), and @Controller() in NestJS, this project brings a similar architecture to the Electron main process.

  • IPC logic is encapsulated in modules
  • Dependency injection is used for services
  • Clean separation of concerns

✅ No more imperative ipcMain.on(...) scattered everywhere!

2. 🪟 Declarative Multi-Window Management with Decorators

Instead of managing windows manually in random files, you can now use decorators like:

@RegisterWindow('home')
export class HomeWindow { ... }
Enter fullscreen mode Exit fullscreen mode

And auto-register them via:

@AutoRegisterWindows([HomeWindow, SettingsWindow])
export class WindowModule {}
Enter fullscreen mode Exit fullscreen mode

All windows are created declaratively, lifecycle-aware, and can expose methods for main/renderer communication.

3. 🔁 Decorator-Based IPC Communication (with TypeScript support)

You can define IPC handlers like this:

@IPCHandle('get-user-info')
handleUserInfo(payload: UserPayload) {
  return this.userService.getUserInfo(payload.id);
}
Enter fullscreen mode Exit fullscreen mode

And on the renderer side, TypeScript will provide autocomplete & type-checks:

window.electronAPI.invoke('get-user-info', { id: '123' });
Enter fullscreen mode Exit fullscreen mode

✅ Supports full request/response structure, type inference, and automatic registration.

4. 🚀 Embedded NestJS Server

A full NestJS backend is embedded in Electron and runs alongside your main process. You can:

  • Expose REST APIs
  • Reuse backend logic in the main process
  • Use it to drive IPC logic or window lifecycle behavior

This is especially useful for heavy logic processing or multi-window state management.

📦 Tech Stack

  • Electron – Desktop runtime
  • Vite – Lightning-fast frontend builder
  • React – UI rendering (can replace with Vue/Svelte/etc.)
  • NestJS – Backend architecture (used inside and alongside Electron)
  • TypeScript – Full type safety

🛠️ Get Started 

git clone https://github.com/X29w/electronest
cd electronest
pnpm install
pnpm dev
Enter fullscreen mode Exit fullscreen mode

You’ll have a fully running Electron app with a NestJS server, multi-window setup, and IPC system in just one command.

📌 Conclusion

This template is perfect for developers who:

  • Want to build scalable Electron apps
  • Prefer structured architecture
  • Value type safety and modular design
  • Are familiar with NestJS or want to bring backend patterns to desktop development

If you found this project interesting, feel free to ⭐️ it on GitHub:
👉 https://github.com/X29w/electronest

Happy coding!

Top comments (0)