add new lesson mode and started code refraction

client/vite.config.js

@@ -1,19 +1,32 @@
-import { fileURLToPath, URL } from 'node:url'
-import { defineConfig } from 'vite'
-import vue from '@vitejs/plugin-vue'
+import { fileURLToPath, URL } from 'node:url';
+import { defineConfig } from 'vite';
+import vue from '@vitejs/plugin-vue';
 
 export default defineConfig({
-	plugins: [vue()],
-	resolve: {
-		alias: {
-			'@': fileURLToPath(new URL('./src', import.meta.url))
-		}
-	},
-	css: {
-		preprocessorOptions: {
-			scss: {
-				additionalData: `@use "@/styles/abstracts/_variables.scss" as *; @use "@/styles/abstracts/_mixins.scss" as *;`
-			}
-		}
-	}
-})
+  plugins: [vue()],
+  resolve: {
+    alias: {
+      '@': fileURLToPath(new URL('./src', import.meta.url)),
+    },
+  },
+  css: {
+    preprocessorOptions: {
+      scss: {
+        additionalData: '@use "@/styles/abstracts/_variables.scss" as *; @use "@/styles/abstracts/_mixins.scss" as *;',
+      },
+    },
+  },
+  server: {
+    allowedHosts: [
+      'zenkanji.crylia.de',
+    ],
+    host: true,
+    port: 5173,
+    strictPort: true,
+    hmr: {
+      host: 'zenkanji.crylia.de',
+      protocol: 'wss',
+      clientPort: 443,
+    },
+  },
+});