„Development/Frontend“ hinzufügen

Development%2FFrontend.md

@@ -0,0 +1,66 @@
+# Frontend Development
+* [General](#general)
+* [Useful commands](Development#commands)
+* [Plugin](#plugin)
+* [General development](Development)
+
+## General
+
+## Commands
+Useful commands for developing the frontend / frontend plugins
+
+##### Start the app in development mode
+Provides hot-code reloading, error reporting, etc.
+```sh
+yarn quasar dev
+```
+
+##### Code formatting
+
+```sh
+yarn pretty
+```
+
+##### File linting
+
+```sh
+yarn lint
+```
+
+## Plugins
+
+#### Build a Plugin
+
+Create a new node.js project and add `@flaschengeist/api` as a peer dependency (e.g. `yarn add --peer '@flaschengeist/api'`).
+If your plugin depends on an other plugin (e.g. you use the `@flaschengeist/users` plugin / stores),
+then you have to add that plugin as a peer dependency too.
+
+You need to define a main entry point for your plugin (e.g. `"main": "src/index.ts"` in your `package.json`) which exportes
+a plugin descriptor as the default export (see `@flaschengeist/types` -> `FG_Plugin.Plugin`).
+E.g.
+
+```ts
+import { FG_Plugin } from '@flaschengeist/types';
+import { routes } from './routes';
+
+const plugin: FG_Plugin.Plugin = {
+  id: 'com.example.myplugin',
+  name: 'myplugin',
+  innerRoutes: routes,
+  // This are required backend plugins:
+  requiredModules: [['auth'], ['users'], ['roles']],
+  version: '0.0.1',
+  widgets: [
+    {
+      priority: 1,
+      name: 'greeting',
+      permissions: [],
+      widget: defineAsyncComponent(() => import('./components/Widget.vue')),
+    },
+  ],
+};
+
+export default plugin;
+```
+
+This will add a plugin providing a widget for the dashboard side and some routes.