Skip to main content
Overlayed apps are built using an architecture where the Electron/native app loads a website rather than a local file.

​
Benefits

This architecture gives a few key benefits:
  • Seamless Updates: You can release fixes and enhancements to your UI without the user having to get an update (which typically requires restarting the entire app)
  • Faster Development: Speeds up local development when using HMR-enabled technology like Vite or Webpack

​
Structure Overview

All Overlayed apps must follow the below structure:

​
Electron App

The Electron app is responsible for:
  • Starting the application
  • Managing your windows
  • Listening to game events
  • Interacting with the OS as needed
  • Loading the website at a served URL, not via file://
    • Locally this can be localhost:3000
    • In production, your app will be deployed at https://your-site.overlayedapps.com
  • Sending data to the website via Electron IPC

​
Website

The website that the Electron app loads is responsible for:
  • Displaying your UI
  • Sending data back to Electron via IPC