Last active
March 5, 2025 09:45
-
-
Save Jminding/d3a97162159795057c8d2e20f9d85fd9 to your computer and use it in GitHub Desktop.
Simple way to convert most websites into desktop applications, run create-application.sh then do index.js and then build.sh
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
# Run this in terminal after doing index.js, make sure to read the comments | |
# This script will build your app and make it distributable | |
# The mas version is for the mac app store | |
npm install electron-packager --save-dev | |
# OK so here you can either build it for your own computer or make it distributable | |
# For your own computer below | |
npm run make | |
# Once you've run this command then go to your file explorer and navigate to your application directory then go to out/<app-name>-<platform>-x64/<app-name>.<platform-executable-type> | |
# Now this one is for making it distributable for a certain platform | |
electron-packager src <app name> --platform=<platform> --arch=<arch> --icon=<icon-file> | |
# You should see this one directly in the folder, no need to go to out | |
# This one is for making a distributable for all platforms | |
electron-packager src --all --icon=<icon-file> | |
# Great you did it, you now have a distributable for all platforms | |
# There will be a lot of files to navigate, but the distributable will have the same name as your app (so like <app-name>.app, <app-name>.exe...) | |
# the "mas" is for mac app store, you can ignore it unless you're putting it on the mac app store |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
# Run this in terminal FIRST | |
# This script installs electron and creates an electron app for you | |
npm install electron --save-dev | |
npx create-electron-app <app name goes here> | |
cd <app name goes here> |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
const { app, BrowserWindow } = require('electron'); | |
const path = require('path'); | |
// Handle creating/removing shortcuts on Windows when installing/uninstalling. | |
if (require('electron-squirrel-startup')) { // eslint-disable-line global-require | |
app.quit(); | |
} | |
const createWindow = () => { | |
// Create the browser window. | |
const mainWindow = new BrowserWindow({ | |
width: 800, | |
height: 600, | |
}); | |
// Opening devtools is disabled here | |
mainWindow.loadURL("<URL of webpage you want to load goes here>"); | |
// Put the URL of the website you want to convert here ^ | |
}; | |
// This method will be called when Electron has finished | |
// initialization and is ready to create browser windows. | |
// Some APIs can only be used after this event occurs. | |
app.on('ready', createWindow); | |
// Quit when all windows are closed, except on macOS. There, it's common | |
// for applications and their menu bar to stay active until the user quits | |
// explicitly with Cmd + Q. | |
app.on('window-all-closed', () => { | |
if (process.platform !== 'darwin') { | |
app.quit(); | |
} | |
}); | |
app.on('activate', () => { | |
// On OS X it's common to re-create a window in the app when the | |
// dock icon is clicked and there are no other windows open. | |
if (BrowserWindow.getAllWindows().length === 0) { | |
createWindow(); | |
} | |
}); | |
// In this file you can include the rest of your app's specific main process | |
// code. You can also put them in separate files and import them here. |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment