Chapter 08

おわりに 〜 さらなる一歩のために

Kei Touge
Kei Touge
2021.09.18に更新

この本は、あくまでも Electron アプリケーション作成の「入門」編です。入り口への案内文にすぎないため、ここで筆を置きたいと思いますが、この先へ向かうためのヒントをいくつか挙げておきます。

多彩な Electron API を体験しよう

本編では dialog API しか紹介ができませんでしたが、ほかにも Electron には多種多様な API が用意されています。
Electorn の多彩な API を総覧的に体験できるデモも用意されています。ひと通り試してみることをお勧めします。

https://github.com/electron/electron-api-demos


画像はレポジトリの README.md から転載

レンダラープロセスはなんでもアリ?

本編でも見てきた通り、Electron のレンダラープロセスは Web アプリとほぼ同じなので、いわゆるフロントエンド向けの各種フレームワークがほとんどそのまま利用できることになります。

JavaScript フレームワークなら

https://ja.reactjs.org/

https://jp.vuejs.org/index.html

CSS フレームワークなら

https://tailwindcss.com/

https://styled-components.com/

https://tailwindcomponents.com/

⚠️ ただし注意も必要

ただし、各種フレームワークの導入には注意すべきことが一点だけあります。それは、そのスクリプトやスタイルをインポートしている HTML ファイルの コンテンツセキュリティポリシー (以下、CSP)です。

第 1 章のサンプルコードでは特に言及しませんでしたが、あのサンプルの HTML ファイルの meta タグは次のようになっていました。

index.html
<meta http-equiv="Content-Security-Policy" content="default-src 'self'" />

この default-src 'self' では、インラインスクリプトやインラインスタイルの読み込みをすべて拒否します。

ここでは CSP の設定方法まで解説することはできませんが、導入するフレームワークにあわせて適切な CSP を選択する必要があります。

https://developer.mozilla.org/ja/docs/Web/HTTP/CSP

おしまい

最後までお付き合いいただき、ありがとうございました。
素敵な Electron アプリを完成させたら教えてくださいね。

続編的な何か

https://zenn.dev/sprout2000/books/3691a679478de2