Electron Example Windows APPlication

Convert your website/blog into Windows Application Build using Electron

Requirements

• Electron
• Electron Packager
• Electron Win Installer

# Install Electrom
sudo npm install -g electron --unsafe-perm=true

# Install Electron Packager
sudo npm install electron-packager -g

Installation

• Clone this Respo

https://github.com/mskian/electron-example-windows.git

• Install dependencies

cd electron-example-windows

yarn

• Build a Package for Windows

yarn package-win

• Build .exe Package

yarn create-installer-win

Customization

Add ICONS

• Add Icons on assets/icons/win Directory
• open https://convertico.com/ and Upload your ICON.Format png & size 512x512
• Convert your png icon to icoFormat
• Rename the icon Icon-512.ico to Icon.ico
• Next Move the Icon to assets/icons/win Folder (PS: Before Adding your Own ICON Cleanup Default icon which already added for example APP)

Convert the website/blog to Desktop APP

• open main.js File
• Find the Below & Update your Blog/website URL

var weburl = 'https://task.santhoshveer.com';

• Add Background Color Find this Line backgroundColor: '#15171A', & Replace it with your Background Color code
• Test your APP

electron main.js

• Open /installers/windows/createinstaller.js File & Update the APP Directory, Author name, Output Directory, Setup exe File Name.

Windows package Setup

• package.json - Open it & replace it with your Name, Description and Version
• Windows Application Packager and Builder Configuration from package.json

 "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "package-win": "electron-packager . electron-example --overwrite --asar --platform=win32 --arch=ia32 --icon=assets/icons/win/icon.ico --prune=true --out=release-builds --version-string.CompanyName=MSKIAN --version-string.FileDescription=MSKIAN --version-string.ProductName=\"Electron Example\"",
    "create-installer-win": "node installers/windows/createinstaller.js"
  },

• electron-example - Replace with your APP Name
• release-builds/electron-example-win32-ia32/ - same Replace electron-example with your APP Name

Learn More about Electron

Special thanks to Christian Engvall for this Awesome Tutorials

LICENSE

MIT