皆さん、おはこんばんにちは！ SIer出身のエンジニア、みやもとです。
「RPAを使った業務の自動化に挑戦（前編）」に引き続きRPAを使った業務の自動化に挑戦したいと思います。前回は、自動化するためにどのようなパッケージを使うかを書きましたが今回はそのパッケージを組み込んでデスクトップアプリ作るためにElectronをインストールしたいと思います。
1.Electron
Electronとは
Electronは、GitHubが開発したオープンソースのソフトウェアフレームワークである。
Electron (ソフトウェア) -Wikipediaより引用
ChromiumとNode.jsを使っており、HTML、CSS、JavaScriptのようなWeb技術で、macOS、Windows、Linuxに対応したデスクトップアプリケーションをつくることができる。
Electronは、 SkypeやVisual Studio Code、Slackなどでも使われており簡単にデスクトップアプリを作成できるソフトウェアフレームワークです。
インストール
１. Node.jsのインストール
Electronをインストールする前にNode.jsをインストールします。
２. Electronのインストール
下記のコマンドを実行して、 Electronをインストールします。
インストールするとコマンドを実行したディレクトリ直下に下記のファイルが作成されます。
npm i -D electron
３. Electronの実行ファイル作成
Electronをインストールすると出来上がるsrc直下にファイルを作成します。
{
"main": "main.js"
}const { app, Menu, BrowserWindow } = require('electron');
const path = require('path');
const url = require('url');
let mainWindow;
function createWindow() {
mainWindow = new BrowserWindow({ width: 800, height: 600});
mainWindow.loadURL(url.format({
pathname: path.join(__dirname, 'index.html'),
protocol: 'file',
slashes: true
}));
// 開発ツール有効化
// mainWidow.webContents.openDevTools();
const menu = Menu.buildFromTemplate(createMenuTemplate());
Menu.setApplicationMenu(menu);
mainWindow.on('closed', () => {
mainWindow = null;
});
}
app.on('ready', createWindow);
app.on('window-all-closed', () => {
if (process.platform !== 'darwin') {
app.quit();
}
});
app.on('activate', () => {
if (mainWindow === null) {
createWindow();
}
});
// メニューテンプレート作成
function createMenuTemplate(){
let template = [{
label: 'ファイル',
submenu: [{
label: '開く',
accelerator: 'CmdOrCtrl+o',
click: function(item, focusedWindow) {
if (focusedWindow) {
focusedWindow.webContents.send('main_file_message', 'open');
}
}
}]
}]
return template;
}<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>MY ELECTRON</title>
</head>
</html>４. Electronの実行
下記のコマンドをElectronをインストールしたディレクトリで実行します。
npx electron src
2.まとめ
Electronは様々なデスクトップアプリで使われていますが、使ったことがなかったので今回試しにインストールして実行まで行いましたがものすごく簡単にデスクトップの枠組みができました。まだデザインや機能を組み込んでいないため真っ白な画面となっていますが、今後はPyAutoGuiを使って処理を組み込んで行き業務の自動化を進めていきたいと思います。
コメント