How to make a semi-transparent app background with electron?

When setting up the browser window in your main.js file, set the vibrancy option to one of electrons options.

A snippet from electrons documents below

"vibrancy String (optional) - Add a type of vibrancy effect to the window, only on macOS. 
Can be appearance-based, light, dark, titlebar, selection, menu, popover, sidebar, medium-light or ultra-dark."

https://github.com/arkenthera/electron-vibrancy/blob/master/README.md

example js code if using the ultra-dark theme

let mainWindow;

const createWindow = () => {
  // Create the browser window.
  mainWindow = new BrowserWindow({
    width: 800,
    height: 600,
    vibrancy: 'ultra-dark',
  });
};

After setting up the main window's background with the vibrancy set then simply split the window up with a sidebar and the main content. Setting the background color of main to any color you wish leaving the sidebar still with its OSX style transparency

I hope this helps