feat(frontend): first version of Vue SPA

Ref: #138
questionpy-org · Dec 3, 2024 · d46267a · d46267a
1 parent 3e228ed
commit d46267a
Show file tree

Hide file tree

Showing 100 changed files with 12,998 additions and 34 deletions.
diff --git a/.gitignore b/.gitignore
@@ -1,11 +1,12 @@
 /venv
 /.venv
-/.idea
+.idea
 *.iml
 config.ini
 __pycache__
 /dist
-/.vscode
+.vscode
+.DS_Store
 
 /.mypy_cache
 /.pytest_cache
@@ -16,4 +17,5 @@ __pycache__
 
 /example.qpy
 /questionpy_sdk/resources/minimal_example.zip
-/questionpy_sdk/webserver/question_state_storage/
+/questionpy_sdk/webserver_legacy/question_state_storage/
+/questionpy_sdk/webserver_spa/static/
diff --git a/examples/minimal/qpy_config.yml b/examples/minimal/qpy_config.yml
@@ -7,3 +7,17 @@ name:
   de: Minimales Beispiel
   en: Minimal Example
 languages: [de, en]
+description:
+  en:
+    Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod
+    tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero
+    eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea
+    takimata sanctus est Lorem ipsum dolor sit amet.
+  de:
+    Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod
+    tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero
+    eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea
+    takimata sanctus est Lorem ipsum dolor sit amet.
+url: https://github.com/foo/bar
+icon: https://picsum.photos/400/400/?image=20
+license: GPLv2
diff --git a/frontend/.gitignore b/frontend/.gitignore
@@ -0,0 +1,10 @@
+logs
+*.log
+npm-debug.log*
+
+node_modules
+coverage
+*.local
+
+*.tsbuildinfo
+/components.d.ts
diff --git a/frontend/.prettierrc.json b/frontend/.prettierrc.json
@@ -0,0 +1,6 @@
+{
+    "$schema": "https://json.schemastore.org/prettierrc",
+    "semi": false,
+    "singleQuote": true,
+    "printWidth": 120
+}
diff --git a/frontend/README.md b/frontend/README.md
@@ -0,0 +1,45 @@
+# frontend
+
+This template should help get you started developing with Vue 3 in Vite.
+
+## Recommended IDE Setup
+
+[VSCode](https://code.visualstudio.com/) + [Volar](https://marketplace.visualstudio.com/items?itemName=Vue.volar) (and disable Vetur).
+
+## Type Support for `.vue` Imports in TS
+
+TypeScript cannot handle type information for `.vue` imports by default, so we replace the `tsc` CLI with `vue-tsc` for type checking. In editors, we need [Volar](https://marketplace.visualstudio.com/items?itemName=Vue.volar) to make the TypeScript language service aware of `.vue` types.
+
+## Customize configuration
+
+See [Vite Configuration Reference](https://vite.dev/config/).
+
+## Project Setup
+
+```sh
+npm install
+```
+
+### Compile and Hot-Reload for Development
+
+```sh
+npm run dev
+```
+
+### Type-Check, Compile and Minify for Production
+
+```sh
+npm run build
+```
+
+### Run Unit Tests with [Vitest](https://vitest.dev/)
+
+```sh
+npm run test:unit
+```
+
+### Lint with [ESLint](https://eslint.org/)
+
+```sh
+npm run lint
+```
diff --git a/frontend/env.d.ts b/frontend/env.d.ts
@@ -0,0 +1 @@
+/// <reference types="vite/client" />
diff --git a/frontend/eslint.config.js b/frontend/eslint.config.js
@@ -0,0 +1,37 @@
+import pluginVue from 'eslint-plugin-vue'
+import vueTsEslintConfig from '@vue/eslint-config-typescript'
+import pluginVitest from '@vitest/eslint-plugin'
+import skipFormatting from '@vue/eslint-config-prettier/skip-formatting'
+
+export default [
+    {
+        name: 'app/files-to-lint',
+        files: ['**/*.{ts,mts,tsx,vue}'],
+    },
+
+    {
+        name: 'app/files-to-ignore',
+        ignores: ['**/dist/**'],
+    },
+
+    ...pluginVue.configs['flat/essential'],
+    ...vueTsEslintConfig(),
+
+    {
+        ...pluginVitest.configs.recommended,
+        files: ['src/**/__tests__/*'],
+    },
+
+    skipFormatting,
+
+    {
+        rules: {
+            '@typescript-eslint/no-unused-vars': [
+                'error',
+                {
+                    ignoreRestSiblings: true,
+                },
+            ],
+        },
+    },
+]
diff --git a/frontend/index.html b/frontend/index.html
@@ -0,0 +1,13 @@
+<!doctype html>
+<html lang="en">
+    <head>
+        <meta charset="UTF-8" />
+        <link rel="icon" href="/favicon.ico" />
+        <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
+        <title>QuestionPy SDK</title>
+    </head>
+    <body>
+        <div id="app"></div>
+        <script type="module" src="/src/main.ts"></script>
+    </body>
+</html>