This electron app is used to expose local client's folders to our webapp (app.rookout.com)
via a local GraphQL server
There are 3 components to this electron app:
The main process
Typescript, the main process is used to initialize the windows and communicate with them via electron's built in RPC functionality.
It helps the windows achieve functionalities they cannot access directly (e.g: desktop notifications, tray icon)
The react web app
ES6, and uses
create-react-app, The react app is the window the client actually sees.
The window exposes configurations to the clients and stuff like add/delete/edit repositories, exposing the access token (see Access Token)
The invisible worker window
The invisible worker window runs the GraphQL server and manages all operations on repositories (CRUD operations and indexing)
The reason we open an invisible windows (and not use the main process for that) is because the indexing job is cpu heavy and we cannot block the main process, as it blocks renderer processes as well (reference)
The access Token
Because we listen on http://localhost:44512 (which is the graphql endpoint we spin), every website running on the client's machine has access to our API.
In order to restrict access we use an access token whitout which every call to our API will return
status 401 see auth middleware
/src/webappto install webapp dependencies
npm installin root directory to install electron's dependencies
Run in development
In development we run the webpack server to serve the react web app. We do this because we get hot reload when we modify the react code.
To run the webapp server:
yarn run startin
/src/webappto run development server
npm startin the root directory to run the electron app
Build for production
TODO (see circleci yaml)