This template is designed to integrate easily with the main app in development.
A plugin consists of a React frontend and a Docker backend. It has a GitHub action that automatically runs npm run build and creates a release from the dist folder.
The main production app has an option to download a plugin from GitHub in the plugin manager.
To get started with developing a plugin:
Option 1: Clone the main repository and make a folder/repository inside of the plugins folder. Push only that folder to GitHub.
Option 2: If it is easier for you, copy all the contents of the plugin-template folder into a completely separate repository. All of the usage steps should still work.
-
Follow the instructions in the README to install the app in development mode.
-
Open a terminal and
cdinto your plugin's folder. Then runnpm installto install your plugin's dependencies. -
Start the main app in development mode: Run
npm run devin the main project folder. -
Start the plugin in development mode: Run
npm run devin your plugin's folder. -
In the main app, go to the first menu dropdown and open the plugin manager. Click the plus, and paste the URL of your plugin (something like
http://localhost:5172) in the development plugin option.
The first lines of the package.json are important to identifying your plugin.
"name": "plugin-template",
"pluginName": "Plugin Template",
"icon": "./icon.svg",
"index": "./index.html",
"dockerCompose": "./compose.yml",
nameis considered to be the pluginidpluginNameis the display name of the pluginiconis thedist-relative path to the icon for the pluginindexis thedist-relative path to the index HTML file generated by the builddockerComposeis an optionaldist-relative path to a Docker Compose file to run the plugin backend.