Skip to content

Latest commit

 

History

History
103 lines (73 loc) · 3.25 KB

CONTRIBUTING.md

File metadata and controls

103 lines (73 loc) · 3.25 KB

Contributing

Install dependencies

npm install

Running

Start the application

npm run start
//or for automatic reloading of the main process with nodemon
npm run start:dev

Building

The application will be built and published automatically when merged to the main branch.
However, if you want to build locally then you can run

npm run build

Linting

All files will be automatically linted when committing. However, if you want to manually lint you can run

npm run lint

Commit validation

This repository uses conventional commits. All commits must follow this format.

Architecture

Key technology:

  • Electron - The core of the application is built using this.
  • Node.js - Language used to build the electron main process (the backend of the application).
  • Vue 3 - Frontend framework
  • Loopback Context - Dependency injection and IoC container used in the main process to simplify setup

Main process

The code for the main process is mostly broken into controllers and services, along with the application bootstrapping.

  • controllers - Handle ipc events from the renderer. These can be registered with the @controller decorator and ipc handlers with @handle.
  • services - Responsible for the bulk of the logic. Controllers delegate to services to perform actual business logic.
  • application.ts - Bootstraps and initialise the application, including registering the controller and service artefacts.

Example Controller

The following will register a controller with 2 ipc handlers. It is recommended that the channel names are stored in a const enum.

// `main/controllers/example/example.controller.ts`

import { controller, handle } from "@/main/decorators/controller.decorator";
import { EXAMPLE_EVENTS } from "@/main/controllers/example/example.events";
import { service } from "@loopback/core";
import { ExampleService } from "@/main/services/example.service";

@controller
export class ExampleController {
  constructor(@service(ExampleService) private exampleService: ExampleService) {
  }

  @handle('something else')
  async somethingElse(...args) {
    await this.exampleService.doSomethingElse(...args);
  }
  
  @handle(EXAMPLE_EVENTS.DO_SOMETHING)
  async doSomething(...args) {
    await this.exampleService.doSomething(...args);
  }
}

Renderer process

Only the main process can access node events. The renderer process cannot directly access node events. To access " backend" events, the renderer process must invoke events from the ipc service. Because of this, importing anything with any node code into the renderer process will cause errors. So, anything that must be shared between both must not contain node code. It is recommended that shared const enums are put in their own file.

Example ipc invoke

export default class Example extends Vue {
  private ipcService = injectStrict(SERVICE_BINDINGS.IPC_SERVICE);

  async created() {
    await this.ipcService.invoke(EXAMPLE_EVENTS.DO_SOMETHING)
  }
}