# Electron Tabbed This is a sample app that demonstrates multiple windows and multiple tabs functionality in [Electron](https://electronjs.org/). Tabbing functionality is provided by [electron-tabs](https://www.npmjs.com/package/electron-tabs) ## Running ```sh $ npm i $ npm start ``` ## File Structure Overview * `tabs\` folder containing sample pages that are open within tabs * `windows\` folder with sample pages that are open as new windows * `windows\main\` window displayed when app first starts and shows a menu with links to all tabs * `windows\tabs\` window that contains all tabs that are opened from the main menu * `main.js` main process of the application. Responsible for opening the windows and handling communication between the windows ## Overall Approach 1. When the app first starts, a new window (`window\main\index.html`) is opened. The main window has a menu with three links. The links can reference other pages within this application (see Link 1 and Link 2) or link outside (see Link 3) 2. When a link is selected from the menu, the window requests the main process to open a new tab with the title and URL parameters. 3. The main process checks if a window with tabs already exists. If it does, it sends a message to the tabbed window to add a tab. If not, it first creates a tabbed window and then sends a message to it to add a tab. 4. The tabbed window listens for requests from the main process, and adds new tabs to the tab group when the new tab events are dispatched from the main process.