Closed10

2024年のElectronとエコシステムの調査

kimizuykimizuy

Viteのテンプレートを作成するコマンドにはElectronとViteのテンプレートが存在するので、ここからプロジェクトのベースを作るのが良さそう

❯ npm create vite@latest my-electron-vite-app

> npx
> create-vite my-electron-vite-app

✔ Select a framework: › Others
✔ Select a variant: › create-electron-vite ↗

> npx
> create-electron-vite my-electron-vite-app

✔ Project template: › React

Scaffolding project in /Users/kimizuy/Documents/dev/my-electron-vite-app...

Done. Now run:

  cd my-electron-vite-app
  npm install
  npm run dev
kimizuykimizuy

electron-viteというプラグインがあり、こちらのテンプレート作成機能でElectron+Vite+Reactのテンプレートを作ると上記のcreate viteテンプレートと同じ内容だった

❯ npm create electron-vite@latest

> npx
> create-electron-vite

✔ Project name: … my-vite-plugin-electron-app
✔ Project template: › React

Scaffolding project in /Users/kimizuy/Documents/dev/_temp/my-vite-plugin-electron-app...

Done. Now run:

  cd my-vite-plugin-electron-app
  npm install
  npm run dev
kimizuykimizuy

少し横道に逸れるけど、個人的にmonorepoの要件が加わっているのでボイラープレートがないか調査する。turborepoを使ったことがあり概ね体験が良かったので、このツールを使ったものを探す

Web界隈のインフルエンサーとして有名なTheoさんのmonorepoプロジェクト。2年前なのでちょい古い
https://github.com/t3dotgg/yerba

上記をフォークした新しめのリポジトリ
https://github.com/vickp/electron-vite-react-monorepo

kimizuykimizuy

Electron内部でデータを永続化する方法をChatGPT 4oに聞いてみた。

https://chatgpt.com/share/35286851-73ed-44de-8c01-e2532d19b0ef

以下、箇条書きでまとめたもの:

  1. ローカルファイルを使用
  2. ローカルストレージ (Electron's localStorage)
  3. IndexedDB
  4. SQLite
  5. NeDB

他に、JSONファイルでデータを永続化するライブラリもあり、かなりスターを集めている。作成者は個人開発で有名なsindresorhusさん
https://github.com/sindresorhus/electron-store

kimizuykimizuy

electron-storeでほとんどの要件はカバーできそうだが、より複雑な要件に対応しきるためにSQLiteを使う。関連の記事やExampleを調べてみる。sqlite3よりパフォーマンスが高いbetter-sqlite3を使ったものを探す

上記で紹介したelectron-viteがサポートするExampleが存在する。参考になりそう

2023年に書かれたElectronにbetter-sqlite3を導入する記事
https://dev.to/arindam1997007/a-step-by-step-guide-to-integrating-better-sqlite3-with-electron-js-app-using-create-react-app-3k16

このスクラップは4ヶ月前にクローズされました