Previously we saw how we can use plugins such as Bootstrap with Electron, therefore, having an outline of a more complete application, it is time to know a fundamental tool when developing our web applications, a tool that we always have at hand is the use from the developer console of the browser or devTools to debug it, in Electron, we can also easily use it, for this, we have to activate it in the BrowserWindow() object:

index.js

function createWindow(){
    let win = new BrowserWindow({
        width: 800,
        height:600,
        webPreferences:{
            nodeIntegration: true,
            contextIsolation: false 
        }
    })
    win.loadFile("index.html")
    win.webContents.openDevTools()
}

And we will have:

Now with this, we can create more complete development, such as a chat list with Electron.js and Bootstrap 5.

Remember that the previous material is part of mi curso completo sobre Electron.js