設定情報やちょっとしたデータの管理にレンダラープロセスの場合はWebStorageやIndexedDBが利用できますが、メインプロセスでは自力でファイルに保存する処理が必要でちょっと面倒。そんな時に利用するのがelectron-storeです。手軽にデータの永続化ができます。 今回はこのelectron-storeを利用しウィンドウの位置とサイズを記録、次回起動する際に復元するサンプルを作成します。 ソースコード 準備 基本的な原理 利用方法 どこに記録されるの? サンプル デモ メインプロセス レンダラープロセス おまけ 保存先やファイル名を変更する データファイルを暗号化する Validationを行う 参考ページ ソースコード 実際に稼働するソースはGitHubからも確認できます。 github.com 準備 npmで一発で入ります。 $ npm install electron-s
Electronによってサポートされているコマンドラインスイッチ。 app モジュールで ready イベントが発生する前に、アプリのメインスクリプトで app.commandLine.appendSwitch を使って、コマンドラインスイッチを追加することができます。 const { app } = require('electron') app.commandLine.appendSwitch('remote-debugging-port', '8315') app.commandLine.appendSwitch('host-rules', 'MAP * 127.0.0.1') app.whenReady().then(() => { // コードをここに }) 末尾が example.com、foobar.com、baz である url は、統合認証の対象になります。 * のプリフ
[Electron] IPC には新しい ipcRenderer.invoke() メソッドを使ったほうが便利 (v7+)JavaScriptNode.jsElectron TL;DR; Electron v7 から、ipcRenderer.invoke()、ipcMain.handle() が新たに追加されました。これは、従来まで利用されてきた ipcRenderer.send() や ipcRenderer.sendSync() の上位互換のようなものです。今後は積極的にこちらを使ったほうがよさそう。 従来の Renderer <-> Main プロセス間通信 (IPC) 同期: ipcRenderer.sendSync() 文字通り、同期 (Sync) 的にプロセス間通信を行います。 この際に重要なのは、sendSync によって Main プロセスが呼ばれるとその間は Render
2021/09/22にリリースされた v.15.0.0 中でIPC通信周りに大きな変更はありませんでした。 ただ、その前のバージョン(14.0.0)で、contextBridge.exposeInMainWorld(apiKey, api)からExperimental(実験的)が取れ、正式運用となっていたようです(#30011)。 Electron における IPC 通信 Electron で Desktop アプリケーションを作るにあたって理解しなければならないのは、根幹を成す「IPC通信」かと思います。IPC は Inter-Process Communication、プロセス間通信の略です。 IPC 通信の方法については、Electron において、いくつかの段階を経て、進化を遂げています。今回の記事では、その歴史を追いながら、仕組みとセキュアな方法を書いていきたいと思います。 なぜ
Photo by Caspar Camille Rubin on Unsplash はじめに Electron + Vue.jsで構築したデスクトップアプリでSQLite3を使うための手順をまとめます。 前提と環境 以下の通りです。 OS : Ubuntu 18.04 Vue CLI : 3.8.2 Electron : 5.0.0 この記事でのElectron + Vue.jsアプリは、Vue CLI 3を使って構築したVueアプリにVue CLI Plugin Electron Builderをプラグインとして追加した状態での手順になります。他のelectron-vueなどを使用して構築した場合やその他の条件下で試していませんが、何か参考になれば幸いです。なお、VUe CLI 3とVue CLI Plugin Electron Builderを使ったElectron + Vue.jsア
Words by the Google Chrome team, comics adaptation by Scott McCloud This work is licensed under the Creative Commons Attribution-Noncommercial-No Derivative Works 2.5 License. Google and the Google logo are trademarks of Google Inc. All other company and product names may be trademarks of the respective companies with which they are associated. © Google - Google Home - About Google
Node.js で子プロセスを生み出す場合、Node.js というコマンドラインで起動するツールである都合上、たいていの場合は、Ctrl+C で止めることが多いはずですが、そうじゃない場合に子プロセスが生き残るよね、どうやって殺す?という話です。 たとえば const childProcess = require('child_process') childProcess.exec('sleep 10000')
WindowsやmacOS、Linuxなどのクロスプラットフォーム対応のデスクトップアプリ開発を容易にするフレームワークとして高い人気を持つフレームワークが「Electron」です。 ElectronはChromiumとNode.jsを用いることで、HTML/CSS/JavaScriptのWebテクノロジーによってデスクトップアプリケーションを開発できるのが最大の特徴です。 いまやElectronは、Visual Studio CodeやMicrosoft Teams、Slack、GitHub Desktop、そして最近話題のNotionなど、さまざまなアプリケーションに採用されています。 このElectronの優れた特徴を備えつつ、よりメモリ消費量が小さくファイルサイズもコンパクトで、高いセキュリティを備え、柔軟なライセンスを実現しようと開発されたのが「Tauri」です。 Tauriは、
Electron+Vue.js+NestJS+TypeScriptでデスクトップアプリのひな型を作る。TypeScriptVue.jsElectronNestJS
Electron とは何ですか?Electron は、JavaScript、HTML、CSS によるデスクトップアプリケーションを構築するフレームワークです。 Electron は Chromium と Node.js をバイナリに組み込むことで、単一の JavaScript コードベースを維持しつつ、ネイテイブ開発経験無しでも Windows、macOS、Linux で動作するクロスプラットフォームアプリを作成できます。 はじめましょうまずは チュートリアル から始めて、Electron アプリの開発からユーザーへの頒布までの流れを把握することを推奨します。 サンプル や API ドキュメント もブラウズして新しいものを発見するには良い場所でしょう。 Electron Fiddle でサンプルを動かすElectron Fiddle は Electron で書かれたサンドボックスアプリ
組み込み端末のアプリケーションに Electron を採用し開発・運用を行っています。 継続的な機能追加やトラブルサポートを行いながら 3 年が経過したので、Electron を採用した経緯や結果を経験を交えながら共有したいと思います。 組み込み案件自体が初めてでしたのでその話も入っています。 約 700 台ほど導入されており、なかなか大きな案件での採用と思いますので参考になれば幸いです。 ※Electron の基本的な説明は割愛します。 システムについて 一般的に「受付精算機」などと呼ばれ、店頭に何台か並べて設置して自動で受付・精算を行うシステムです。 ホテルの受付端末のイメージです。ハード的にはセルフレジにも近いです。 筐体自体は他社が用意し、弊社はその上に載せる GUI アプリケーションのみを担当しました。 機能 主な機能として 来店受付・整理券発行 予約チェックイン チェックアウト
こんにちは丸山@h13i32maruです。システム全体を簡単な図とテキストでまとめる「ARCHITECTURE.md」というものを最近知りました。これは良さそうと思い、JasperのARCHITECTURE.mdを書いてみました。 jasperapp/jasper/ARCHITECTURE.md ARCHITECTURE.md自体の目的は「プロジェクトへの新規参加者が全体像の把握を効率的に行えるようにする」という感じです。書き方の指針や注意点などは考案者による記事を見てもらうのがよさそうです。また良いサンプルとしてrust-analyzerというOSSのARCHITECTURE.mdが紹介されています。 https://matklad.github.io//2021/02/06/ARCHITECTURE.md.html https://github.com/rust-analyzer/ru
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く