Start the Electron version

.gitignore

@@ -380,3 +380,4 @@ data
 .vite
 *.db
 package-lock.json
+dist-electron

.vscode/tasks.json

@@ -15,8 +15,24 @@
                 "panel": "shared"
             },
             "group": {
-                "kind": "build",
+                "kind": "build"
-                "isDefault": true
+            }
+        },
+        {
+            "label": "Run (Electron)",
+            "type": "shell",
+            "command": "npm run dev:electron",
+            "options": {
+                "cwd": "${workspaceFolder}"
+            },
+            "presentation": {
+                "echo": true,
+                "reveal": "always",
+                "focus": false,
+                "panel": "shared"
+            },
+            "group": {
+                "kind": "build"
             }
         }
     ]

frontend/electron/main.ts

@@ -0,0 +1,15 @@
+import { app, BrowserWindow } from 'electron';
+
+app.whenReady().then(() => {
+  const win = new BrowserWindow({
+    title: 'Main window',
+  })
+
+  // You can use `process.env.VITE_DEV_SERVER_URL` when the vite command is called `serve`
+  if (process.env.VITE_DEV_SERVER_URL) {
+    win.loadURL(process.env.VITE_DEV_SERVER_URL)
+  } else {
+    // Load your file
+    win.loadFile('dist/index.html');
+  }
+});

frontend/vite.config.ts

@@ -1,22 +1,39 @@
-import { defineConfig } from 'vite'
+import { defineConfig, PluginOption } from 'vite';
-import { createHtmlPlugin } from 'vite-plugin-html'
+import { createHtmlPlugin } from 'vite-plugin-html';
-import autoprefixer from 'autoprefixer'
+import autoprefixer from 'autoprefixer';
+import electron from 'vite-plugin-electron/simple';
+
+const plugins: PluginOption[] = [
+    createHtmlPlugin({
+        minify: {
+            collapseWhitespace: true,
+            removeComments: true,
+            removeRedundantAttributes: true,
+            removeScriptTypeAttributes: true,
+            removeStyleLinkTypeAttributes: true,
+            useShortDoctype: true,
+            minifyCSS: true,
+            minifyJS: true
+        }
+    })
+]
+
+if (process.env.VITE_ELECTRON) {
+    plugins.push(
+        electron({
+            main: {
+                entry: "electron/main.ts",
+            },
+            preload: {
+                input: "frontend/electron/preload.ts"
+            },
+            renderer: {},
+        })
+    );
+}
 
 export default defineConfig({
-    plugins: [
+    plugins: plugins,
-        createHtmlPlugin({
-            minify: {
-                collapseWhitespace: true,
-                removeComments: true,
-                removeRedundantAttributes: true,
-                removeScriptTypeAttributes: true,
-                removeStyleLinkTypeAttributes: true,
-                useShortDoctype: true,
-                minifyCSS: true,
-                minifyJS: true
-            }
-        })
-    ],
     server: {
         host: '0.0.0.0',
         port: 8301,
@@ -50,4 +67,4 @@ export default defineConfig({
         cssMinify: true,
         assetsInlineLimit: 0
     }
-})
+});

package.json

@@ -3,6 +3,7 @@
     "private": true,
     "version": "0.0.0",
     "type": "module",
+    "main": "frontend/dist-electron/main.js",
     "scripts": {
         "backend:run": "cd backend && dotenv -e ../deployment/.env -- ../.venv/bin/fastapi dev --port 8300 main.py",
         "backend:dependencies": "python3 -m venv .venv && ./.venv/bin/pip3 install -r backend/requirements.txt",
@@ -10,10 +11,12 @@
         "backend:clean": "rm -rf backend/data",
         "frontend:dev": "vite frontend",
         "frontend:build": "tsc --project frontend && vite build frontend",
+        "frontend:electron:dev": "VITE_ELECTRON=true npm run frontend:dev",
         "frontend:preview": "vite preview frontend",
         "frontend:dependencies": "npm install --ignore-scripts",
         "frontend:clean": "rm -rf frontend/dist",
         "dev": "concurrently 'npm run frontend:dev' 'npm run backend:run'",
+        "dev:electron": "concurrently 'npm run frontend:electron:dev' 'npm run backend:run'",
         "build": "npm run frontend:build",
         "preview": "cd deployment && docker compose up --build --watch",
         "preview:clean": "cd deployment && docker compose down -v",
@@ -23,12 +26,15 @@
     "devDependencies": {
         "autoprefixer": "^10.4.21",
         "concurrently": "^9.2.0",
+        "electron": "^37.3.1",
         "dotenv-cli": "^10.0.0",
         "postcss": "^8.5.6",
         "sass-embedded": "^1.90.0",
         "terser": "^5.43.1",
         "typescript": "~5.9.2",
         "vite": "^7.1.2",
+        "vite-plugin-electron": "^0.29.0",
+        "vite-plugin-electron-renderer": "^0.14.6",
         "vite-plugin-html": "^3.2.2"
     },
     "dependencies": {