Underrated way to make webapps on linux using electron

Best thing is that it uses your system's Electron for making "webapps"
Most distros have some Electron version in their repos, hence you don't need any npm/node fluff or have to worry about your webapps being 200 MB each.

The method is basically writing a JavaScript script and using Electron as the shebang; you can make a desktop entry for it yourself.

(I Wrote the script below using AI — if yk javascript please verify & share if you find any bugs)

#!/bin/electron35 --ozone-platform-hint=auto

const { app, BrowserWindow } = require('electron');
const path = require('path');
const fs = require('fs');

// --------------------
// Configurable variables
// --------------------
const SITE_URL = 'https://discord.com/login';
const ZOOM_FACTOR = 1.3;
const STORAGE_PATH = path.join(app.getPath('home'), '.local/share/discord-webapp');

// --------------------
// Ensure persistent storage exists
// --------------------
if (!fs.existsSync(STORAGE_PATH)) fs.mkdirSync(STORAGE_PATH, { recursive: true });
app.setPath('userData', STORAGE_PATH);

// --------------------
// Create the main window
// --------------------
function createWindow() {
  const win = new BrowserWindow({
    width: 900,
    height: 600,
    frame: false,            // hide toolbar / menu
    webPreferences: {
      nodeIntegration: false,
      contextIsolation: true
    }
  });

  // Load site and set zoom factor
  win.loadURL(SITE_URL);
  win.webContents.on('did-finish-load', () => {
    win.webContents.setZoomFactor(ZOOM_FACTOR);
  });
}

// --------------------
// App lifecycle
// --------------------
app.whenReady().then(createWindow);

app.on('window-all-closed', () => {
  app.quit();
});

Leave a Reply