2024-03-11 11:58:01 +00:00
|
|
|
# Dependencies
|
|
|
|
|
|
2024-03-13 08:32:52 +00:00
|
|
|
## Electron
|
2024-03-12 12:08:39 +00:00
|
|
|
|
2024-03-13 08:32:52 +00:00
|
|
|
[Electron](https://www.electronjs.org) is a cross-platform (Linux, Windows,
|
|
|
|
|
macOS) way for creating desktop apps using TypeScript.
|
|
|
|
|
|
|
|
|
|
Electron embeds Chromium and Node.js in the generated app's binary. The
|
|
|
|
|
generated app thus consists of two separate processes - the _main_ process, and
|
|
|
|
|
a _renderer_ process.
|
|
|
|
|
|
|
|
|
|
- The _main_ process is runs the embedded node. This process can deal with the
|
|
|
|
|
host OS - it is conceptually like a `node` repl running on your machine. In
|
|
|
|
|
our case, the TypeScript code (in the `src/` directory) gets transpiled by
|
|
|
|
|
`tsc` into JavaScript in the `build/app/` directory, which gets bundled in
|
|
|
|
|
the generated app's binary and is loaded by the node (main) process when the
|
|
|
|
|
app starts.
|
|
|
|
|
|
|
|
|
|
- The _renderer_ process is a regular web app that gets loaded into the
|
|
|
|
|
embedded Chromium. When the main process starts, it creates a new "window"
|
|
|
|
|
that shows this embedded Chromium. In our case, we build and bundle a static
|
|
|
|
|
export of the [Photos web app](../web/README.md) in the generated app. This
|
|
|
|
|
gets loaded by the embedded Chromium at runtime, acting as the app's UI.
|
|
|
|
|
|
2024-03-13 11:08:45 +00:00
|
|
|
There is also a third environment that gets temporarily created:
|
|
|
|
|
|
|
|
|
|
- The [preload script](../src/preload.ts) acts as a gateway between the _main_
|
|
|
|
|
and the _renderer_ process. It runs in its own isolated environment.
|
|
|
|
|
|
2024-03-13 08:32:52 +00:00
|
|
|
### electron-builder
|
|
|
|
|
|
|
|
|
|
[Electron Builder](https://www.electron.build) is used for packaging the app for
|
|
|
|
|
distribution.
|
2024-03-12 12:08:39 +00:00
|
|
|
|
2024-03-15 09:26:24 +00:00
|
|
|
During the build it uses
|
|
|
|
|
[electron-builder-notarize](https://github.com/karaggeorge/electron-builder-notarize)
|
|
|
|
|
to notarize the macOS binary.
|
|
|
|
|
|
2024-03-26 07:09:53 +00:00
|
|
|
[electron-updater](https://www.electron.build/auto-update#debugging), while a
|
|
|
|
|
separate package, is also a part of Electron Builder. It provides an alternative
|
|
|
|
|
to Electron's built in auto updater, with a more flexible API. It supports auto
|
|
|
|
|
updates for the DMG, AppImage, DEB, RPM and NSIS packages.
|
|
|
|
|
|
|
|
|
|
### electron-log
|
|
|
|
|
|
|
|
|
|
[electron-log](https://github.com/megahertz/electron-log) is used for logging.
|
|
|
|
|
Specifically, it allows us to log to a file (in addition to the console of the
|
|
|
|
|
Node.js process), and also handles log rotation and limiting the size of the log
|
|
|
|
|
files.
|
|
|
|
|
|
2024-03-12 12:08:39 +00:00
|
|
|
### next-electron-server
|
|
|
|
|
|
|
|
|
|
This spins up a server for serving files using a protocol handler inside our
|
2024-03-13 07:57:43 +00:00
|
|
|
Electron process. This allows us to directly use the output produced by
|
|
|
|
|
`next build` for loading into our renderer process.
|
2024-03-15 09:26:24 +00:00
|
|
|
|
2024-03-26 07:09:53 +00:00
|
|
|
## Dev
|
2024-03-15 09:26:24 +00:00
|
|
|
|
2024-03-26 07:09:53 +00:00
|
|
|
See [web/docs/dependencies#DX](../../web/docs/dependencies.md#dev) for the
|
2024-03-15 09:26:24 +00:00
|
|
|
general development experience related dependencies like TypeScript etc, which
|
|
|
|
|
are similar to that in the web code.
|
|
|
|
|
|
|
|
|
|
Some extra ones specific to the code here are:
|
|
|
|
|
|
|
|
|
|
* [concurrently](https://github.com/open-cli-tools/concurrently) for spawning
|
|
|
|
|
parallel tasks when we do `yarn dev`.
|
2024-03-26 07:00:44 +00:00
|
|
|
|
|
|
|
|
* [shx](https://github.com/shelljs/shx) for providing a portable way to use Unix
|
|
|
|
|
commands in our `package.json` scripts. This allows us to use the same
|
|
|
|
|
commands (like `ln`) across different platforms like Linux and Windows.
|
