tdpeuter/2025SELab2-project-Dwengo
tdpeuter/2025SELab2-project-Dwengo
1
Fork 0
Code Issues Releases 4 Packages 2 Wiki Activity

style: Format boilerplate

Browse source
This commit is contained in:
Tibo De Peuter 2025-02-20 14:18:32 +01:00
parent 9b52b43f65
commit 788e1642d1
Signed by: tdpeuter
GPG key ID: 38297DE43F75FFE2
26 changed files with 686 additions and 564 deletions
Download patch file Download diff file Expand all files Collapse all files

4
.github/ISSUE_TEMPLATE/bug-report.md vendored
View file

@ -1,10 +1,9 @@
--- ---
name: Bug rapport name: Bug rapport
about: Maak een bug rapport om fouten te signaleren about: Maak een bug rapport om fouten te signaleren
title: "`error message` of beschrijving" title: '`error message` of beschrijving'
labels: bug labels: bug
assignees: '' assignees: ''
--- ---
**Beschrijf de bug** **Beschrijf de bug**
@ -12,6 +11,7 @@ Een duidelijke, beknopte beschrijving van de bug.
**Reproductie** **Reproductie**
Stappen om het gedrag te reproduceren: Stappen om het gedrag te reproduceren:
1. Ga naar '...' 1. Ga naar '...'
2. Klik op '....' 2. Klik op '....'
3. Scroll naar beneden tot '....' 3. Scroll naar beneden tot '....'

3
.github/ISSUE_TEMPLATE/feature-request.md vendored
View file

@ -1,10 +1,9 @@
--- ---
name: Feature aanvragen name: Feature aanvragen
about: Stel een feature voor about: Stel een feature voor
title: "Korte beschrijving of naam" title: 'Korte beschrijving of naam'
labels: enhancement labels: enhancement
assignees: '' assignees: ''
--- ---
**Is your feature request related to a problem? Please describe.** **Is your feature request related to a problem? Please describe.**

9
backend/src/app.ts
View file

@ -1,5 +1,5 @@
import express, {Express, Request, Response} from 'express'; import express, { Express, Response } from 'express';
import initORM from './orm' import initORM from './orm.js';
const app: Express = express(); const app: Express = express();
const port: string | number = process.env.PORT || 3000; const port: string | number = process.env.PORT || 3000;
@ -7,12 +7,13 @@ const port: string | number = process.env.PORT || 3000;
// TODO Replace with Express routes // TODO Replace with Express routes
app.get('/', (_, res: Response) => { app.get('/', (_, res: Response) => {
res.json({ res.json({
message: 'Hello Dwengo!' message: 'Hello Dwengo!',
}); });
}); });
async function startServer() { async function startServer() {
const orm = await initORM(); await initORM();
app.listen(port, () => { app.listen(port, () => {
console.log(`Server is running at http://localhost:${port}`); console.log(`Server is running at http://localhost:${port}`);
}); });

2
backend/src/entities/user.entity.ts
View file

@ -1,4 +1,4 @@
import { Entity, OneToOne, PrimaryKey, Property } from '@mikro-orm/core' import { Entity, PrimaryKey, Property } from '@mikro-orm/core';
@Entity() @Entity()
export class User { export class User {

6
backend/src/mikro-orm.config.ts
View file

@ -1,12 +1,12 @@
import { Options } from '@mikro-orm/core' import { Options } from '@mikro-orm/core';
import { PostgreSqlDriver } from '@mikro-orm/postgresql' import { PostgreSqlDriver } from '@mikro-orm/postgresql';
const config: Options = { const config: Options = {
driver: PostgreSqlDriver, driver: PostgreSqlDriver,
dbName: 'dwengo', dbName: 'dwengo',
entities: ['dist/**/*.entity.js'], entities: ['dist/**/*.entity.js'],
entitiesTs: ['src/**/*.entity.ts'], entitiesTs: ['src/**/*.entity.ts'],
debug: true debug: true,
}; };
export default config; export default config;

4
backend/src/orm.ts
View file

@ -1,5 +1,5 @@
import { MikroORM } from '@mikro-orm/core' import { MikroORM } from '@mikro-orm/core';
import config from './mikro-orm.config'; import config from './mikro-orm.config.js';
export default async function initORM() { export default async function initORM() {
await MikroORM.init(config); await MikroORM.init(config);

2
frontend/e2e/vue.spec.ts
View file

@ -5,4 +5,4 @@ import { test, expect } from '@playwright/test';
test('visits the app root url', async ({ page }) => { test('visits the app root url', async ({ page }) => {
await page.goto('/'); await page.goto('/');
await expect(page.locator('h1')).toHaveText('You did it!'); await expect(page.locator('h1')).toHaveText('You did it!');
}) });

8
frontend/index.html
View file

@ -1,9 +1,9 @@
<!DOCTYPE html> <!doctype html>
<html lang=""> <html lang="">
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8" />
<link rel="icon" href="/favicon.ico"> <link rel="icon" href="/favicon.ico" />
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Vite App</title> <title>Vite App</title>
</head> </head>
<body> <body>

38
frontend/playwright.config.ts
View file

@ -1,11 +1,11 @@
import process from 'node:process' import process from 'node:process';
import { defineConfig, devices } from '@playwright/test' import { defineConfig, devices } from '@playwright/test';
/** /**
* Read environment variables from file. * Read environment variables from file.
* https://github.com/motdotla/dotenv * https://github.com/motdotla/dotenv
*/ */
// require('dotenv').config(); // Require('dotenv').config();
/** /**
* See https://playwright.dev/docs/test-configuration. * See https://playwright.dev/docs/test-configuration.
@ -22,7 +22,7 @@ export default defineConfig({
timeout: 5000, timeout: 5000,
}, },
/* Fail the build on CI if you accidentally left test.only in the source code. */ /* Fail the build on CI if you accidentally left test.only in the source code. */
forbidOnly: !!process.env.CI, forbidOnly: Boolean(process.env.CI),
/* Retry on CI only */ /* Retry on CI only */
retries: process.env.CI ? 2 : 0, retries: process.env.CI ? 2 : 0,
/* Opt out of parallel tests on CI. */ /* Opt out of parallel tests on CI. */
@ -34,13 +34,15 @@ export default defineConfig({
/* Maximum time each action such as `click()` can take. Defaults to 0 (no limit). */ /* Maximum time each action such as `click()` can take. Defaults to 0 (no limit). */
actionTimeout: 0, actionTimeout: 0,
/* Base URL to use in actions like `await page.goto('/')`. */ /* Base URL to use in actions like `await page.goto('/')`. */
baseURL: process.env.CI ? 'http://localhost:4173' : 'http://localhost:5173', baseURL: process.env.CI
? 'http://localhost:4173'
: 'http://localhost:5173',
/* Collect trace when retrying the failed test. See https://playwright.dev/docs/trace-viewer */ /* Collect trace when retrying the failed test. See https://playwright.dev/docs/trace-viewer */
trace: 'on-first-retry', trace: 'on-first-retry',
/* Only on CI systems run the tests headless */ /* Only on CI systems run the tests headless */
headless: !!process.env.CI, headless: Boolean(process.env.CI),
}, },
/* Configure projects for major browsers */ /* Configure projects for major browsers */
@ -66,35 +68,35 @@ export default defineConfig({
/* Test against mobile viewports. */ /* Test against mobile viewports. */
// { // {
// name: 'Mobile Chrome', // Name: 'Mobile Chrome',
// use: { // Use: {
// ...devices['Pixel 5'], // ...devices['Pixel 5'],
// }, // },
// }, // },
// { // {
// name: 'Mobile Safari', // Name: 'Mobile Safari',
// use: { // Use: {
// ...devices['iPhone 12'], // ...devices['iPhone 12'],
// }, // },
// }, // },
/* Test against branded browsers. */ /* Test against branded browsers. */
// { // {
// name: 'Microsoft Edge', // Name: 'Microsoft Edge',
// use: { // Use: {
// channel: 'msedge', // Channel: 'msedge',
// }, // },
// }, // },
// { // {
// name: 'Google Chrome', // Name: 'Google Chrome',
// use: { // Use: {
// channel: 'chrome', // Channel: 'chrome',
// }, // },
// }, // },
], ],
/* Folder for test artifacts such as screenshots, videos, traces, etc. */ /* Folder for test artifacts such as screenshots, videos, traces, etc. */
// outputDir: 'test-results/', // OutputDir: 'test-results/',
/* Run your local dev server before starting the tests */ /* Run your local dev server before starting the tests */
webServer: { webServer: {
@ -107,4 +109,4 @@ export default defineConfig({
port: process.env.CI ? 4173 : 5173, port: process.env.CI ? 4173 : 5173,
reuseExistingServer: !process.env.CI, reuseExistingServer: !process.env.CI,
}, },
}) });

44
frontend/src/App.vue
View file

@ -1,11 +1,17 @@
<script setup lang="ts"> <script setup lang="ts">
import { RouterLink, RouterView } from 'vue-router' import { RouterLink, RouterView } from "vue-router";
import HelloWorld from './components/HelloWorld.vue' import HelloWorld from "./components/HelloWorld.vue";
</script> </script>
<template> <template>
<header> <header>
<img alt="Vue logo" class="logo" src="@/assets/logo.svg" width="125" height="125" /> <img
alt="Vue logo"
class="logo"
src="@/assets/logo.svg"
width="125"
height="125"
/>
<div class="wrapper"> <div class="wrapper">
<HelloWorld msg="You did it!" /> <HelloWorld msg="You did it!" />
@ -21,42 +27,42 @@ import HelloWorld from './components/HelloWorld.vue'
</template> </template>
<style scoped> <style scoped>
header { header {
line-height: 1.5; line-height: 1.5;
max-height: 100vh; max-height: 100vh;
} }
.logo { .logo {
display: block; display: block;
margin: 0 auto 2rem; margin: 0 auto 2rem;
} }
nav { nav {
width: 100%; width: 100%;
font-size: 12px; font-size: 12px;
text-align: center; text-align: center;
margin-top: 2rem; margin-top: 2rem;
} }
nav a.router-link-exact-active { nav a.router-link-exact-active {
color: var(--color-text); color: var(--color-text);
} }
nav a.router-link-exact-active:hover { nav a.router-link-exact-active:hover {
background-color: transparent; background-color: transparent;
} }
nav a { nav a {
display: inline-block; display: inline-block;
padding: 0 1rem; padding: 0 1rem;
border-left: 1px solid var(--color-border); border-left: 1px solid var(--color-border);
} }
nav a:first-of-type { nav a:first-of-type {
border: 0; border: 0;
} }
@media (min-width: 1024px) { @media (min-width: 1024px) {
header { header {
display: flex; display: flex;
place-items: center; place-items: center;
@ -81,5 +87,5 @@ nav a:first-of-type {
padding: 1rem 0; padding: 1rem 0;
margin-top: 1rem; margin-top: 1rem;
} }
} }
</style> </style>

8
frontend/src/assets/base.css
View file

@ -70,14 +70,14 @@ body {
Inter, Inter,
-apple-system, -apple-system,
BlinkMacSystemFont, BlinkMacSystemFont,
'Segoe UI', "Segoe UI",
Roboto, Roboto,
Oxygen, Oxygen,
Ubuntu, Ubuntu,
Cantarell, Cantarell,
'Fira Sans', "Fira Sans",
'Droid Sans', "Droid Sans",
'Helvetica Neue', "Helvetica Neue",
sans-serif; sans-serif;
font-size: 15px; font-size: 15px;
text-rendering: optimizeLegibility; text-rendering: optimizeLegibility;

2
frontend/src/assets/main.css
View file

@ -1,4 +1,4 @@
@import './base.css'; @import "./base.css";
#app { #app {
max-width: 1280px; max-width: 1280px;

39
frontend/src/components/HelloWorld.vue
View file

@ -1,7 +1,7 @@
<script setup lang="ts"> <script setup lang="ts">
defineProps<{ defineProps<{
msg: string msg: string;
}>() }>();
</script> </script>
<template> <template>
@ -9,33 +9,44 @@ defineProps<{
<h1 class="green">{{ msg }}</h1> <h1 class="green">{{ msg }}</h1>
<h3> <h3>
You’ve successfully created a project with You’ve successfully created a project with
<a href="https://vite.dev/" target="_blank" rel="noopener">Vite</a> + <a
<a href="https://vuejs.org/" target="_blank" rel="noopener">Vue 3</a>. What's next? href="https://vite.dev/"
target="_blank"
rel="noopener"
>Vite</a
>
+
<a
href="https://vuejs.org/"
target="_blank"
rel="noopener"
>Vue 3</a
>. What's next?
</h3> </h3>
</div> </div>
</template> </template>
<style scoped> <style scoped>
h1 { h1 {
font-weight: 500; font-weight: 500;
font-size: 2.6rem; font-size: 2.6rem;
position: relative; position: relative;
top: -10px; top: -10px;
} }
h3 { h3 {
font-size: 1.2rem; font-size: 1.2rem;
} }
.greetings h1, .greetings h1,
.greetings h3 { .greetings h3 {
text-align: center; text-align: center;
} }
@media (min-width: 1024px) { @media (min-width: 1024px) {
.greetings h1, .greetings h1,
.greetings h3 { .greetings h3 {
text-align: left; text-align: left;
} }
} }
</style> </style>

144
frontend/src/components/TheWelcome.vue
View file

@ -1,12 +1,14 @@
<script setup lang="ts"> <script setup lang="ts">
import WelcomeItem from './WelcomeItem.vue' import WelcomeItem from "./WelcomeItem.vue";
import DocumentationIcon from './icons/IconDocumentation.vue' import DocumentationIcon from "./icons/IconDocumentation.vue";
import ToolingIcon from './icons/IconTooling.vue' import ToolingIcon from "./icons/IconTooling.vue";
import EcosystemIcon from './icons/IconEcosystem.vue' import EcosystemIcon from "./icons/IconEcosystem.vue";
import CommunityIcon from './icons/IconCommunity.vue' import CommunityIcon from "./icons/IconCommunity.vue";
import SupportIcon from './icons/IconSupport.vue' import SupportIcon from "./icons/IconSupport.vue";
const openReadmeInEditor = () => fetch('/__open-in-editor?file=README.md') function openReadmeInEditor() {
return fetch("/__open-in-editor?file=README.md");
}
</script> </script>
<template> <template>
@ -17,7 +19,12 @@ const openReadmeInEditor = () => fetch('/__open-in-editor?file=README.md')
<template #heading>Documentation</template> <template #heading>Documentation</template>
Vue’s Vue’s
<a href="https://vuejs.org/" target="_blank" rel="noopener">official documentation</a> <a
href="https://vuejs.org/"
target="_blank"
rel="noopener"
>official documentation</a
>
provides you with all information you need to get started. provides you with all information you need to get started.
</WelcomeItem> </WelcomeItem>
@ -28,22 +35,53 @@ const openReadmeInEditor = () => fetch('/__open-in-editor?file=README.md')
<template #heading>Tooling</template> <template #heading>Tooling</template>
This project is served and bundled with This project is served and bundled with
<a href="https://vite.dev/guide/features.html" target="_blank" rel="noopener">Vite</a>. The <a
recommended IDE setup is href="https://vite.dev/guide/features.html"
<a href="https://code.visualstudio.com/" target="_blank" rel="noopener">VSCode</a> target="_blank"
rel="noopener"
>Vite</a
>. The recommended IDE setup is
<a
href="https://code.visualstudio.com/"
target="_blank"
rel="noopener"
>VSCode</a
>
+ +
<a href="https://github.com/johnsoncodehk/volar" target="_blank" rel="noopener">Volar</a>. If <a
you need to test your components and web pages, check out href="https://github.com/johnsoncodehk/volar"
<a href="https://vitest.dev/" target="_blank" rel="noopener">Vitest</a> target="_blank"
rel="noopener"
>Volar</a
>. If you need to test your components and web pages, check out
<a
href="https://vitest.dev/"
target="_blank"
rel="noopener"
>Vitest</a
>
and and
<a href="https://www.cypress.io/" target="_blank" rel="noopener">Cypress</a> <a
href="https://www.cypress.io/"
target="_blank"
rel="noopener"
>Cypress</a
>
/ /
<a href="https://playwright.dev/" target="_blank" rel="noopener">Playwright</a>. <a
href="https://playwright.dev/"
target="_blank"
rel="noopener"
>Playwright</a
>.
<br /> <br />
More instructions are available in More instructions are available in
<a href="javascript:void(0)" @click="openReadmeInEditor"><code>README.md</code></a <a
href="javascript:void(0)"
@click="openReadmeInEditor"
><code>README.md</code></a
>. >.
</WelcomeItem> </WelcomeItem>
@ -54,12 +92,36 @@ const openReadmeInEditor = () => fetch('/__open-in-editor?file=README.md')
<template #heading>Ecosystem</template> <template #heading>Ecosystem</template>
Get official tools and libraries for your project: Get official tools and libraries for your project:
<a href="https://pinia.vuejs.org/" target="_blank" rel="noopener">Pinia</a>, <a
<a href="https://router.vuejs.org/" target="_blank" rel="noopener">Vue Router</a>, href="https://pinia.vuejs.org/"
<a href="https://test-utils.vuejs.org/" target="_blank" rel="noopener">Vue Test Utils</a>, and target="_blank"
<a href="https://github.com/vuejs/devtools" target="_blank" rel="noopener">Vue Dev Tools</a>. If rel="noopener"
you need more resources, we suggest paying >Pinia</a
<a href="https://github.com/vuejs/awesome-vue" target="_blank" rel="noopener">Awesome Vue</a> >,
<a
href="https://router.vuejs.org/"
target="_blank"
rel="noopener"
>Vue Router</a
>,
<a
href="https://test-utils.vuejs.org/"
target="_blank"
rel="noopener"
>Vue Test Utils</a
>, and
<a
href="https://github.com/vuejs/devtools"
target="_blank"
rel="noopener"
>Vue Dev Tools</a
>. If you need more resources, we suggest paying
<a
href="https://github.com/vuejs/awesome-vue"
target="_blank"
rel="noopener"
>Awesome Vue</a
>
a visit. a visit.
</WelcomeItem> </WelcomeItem>
@ -70,14 +132,32 @@ const openReadmeInEditor = () => fetch('/__open-in-editor?file=README.md')
<template #heading>Community</template> <template #heading>Community</template>
Got stuck? Ask your question on Got stuck? Ask your question on
<a href="https://chat.vuejs.org" target="_blank" rel="noopener">Vue Land</a> <a
href="https://chat.vuejs.org"
target="_blank"
rel="noopener"
>Vue Land</a
>
(our official Discord server), or (our official Discord server), or
<a href="https://stackoverflow.com/questions/tagged/vue.js" target="_blank" rel="noopener" <a
href="https://stackoverflow.com/questions/tagged/vue.js"
target="_blank"
rel="noopener"
>StackOverflow</a >StackOverflow</a
>. You should also follow the official >. You should also follow the official
<a href="https://bsky.app/profile/vuejs.org" target="_blank" rel="noopener">@vuejs.org</a> <a
href="https://bsky.app/profile/vuejs.org"
target="_blank"
rel="noopener"
>@vuejs.org</a
>
Bluesky account or the Bluesky account or the
<a href="https://x.com/vuejs" target="_blank" rel="noopener">@vuejs</a> <a
href="https://x.com/vuejs"
target="_blank"
rel="noopener"
>@vuejs</a
>
X account for latest news in the Vue world. X account for latest news in the Vue world.
</WelcomeItem> </WelcomeItem>
@ -87,8 +167,12 @@ const openReadmeInEditor = () => fetch('/__open-in-editor?file=README.md')
</template> </template>
<template #heading>Support Vue</template> <template #heading>Support Vue</template>
As an independent project, Vue relies on community backing for its sustainability. You can help As an independent project, Vue relies on community backing for its sustainability. You can help us by
us by <a
<a href="https://vuejs.org/sponsor/" target="_blank" rel="noopener">becoming a sponsor</a>. href="https://vuejs.org/sponsor/"
target="_blank"
rel="noopener"
>becoming a sponsor</a
>.
</WelcomeItem> </WelcomeItem>
</template> </template>

24
frontend/src/components/WelcomeItem.vue
View file

@ -13,18 +13,18 @@
</template> </template>
<style scoped> <style scoped>
.item { .item {
margin-top: 2rem; margin-top: 2rem;
display: flex; display: flex;
position: relative; position: relative;
} }
.details { .details {
flex: 1; flex: 1;
margin-left: 1rem; margin-left: 1rem;
} }
i { i {
display: flex; display: flex;
place-items: center; place-items: center;
place-content: center; place-content: center;
@ -32,16 +32,16 @@ i {
height: 32px; height: 32px;
color: var(--color-text); color: var(--color-text);
} }
h3 { h3 {
font-size: 1.2rem; font-size: 1.2rem;
font-weight: 500; font-weight: 500;
margin-bottom: 0.4rem; margin-bottom: 0.4rem;
color: var(--color-heading); color: var(--color-heading);
} }
@media (min-width: 1024px) { @media (min-width: 1024px) {
.item { .item {
margin-top: 0; margin-top: 0;
padding: 0.4rem 0 1rem calc(var(--section-gap) / 2); padding: 0.4rem 0 1rem calc(var(--section-gap) / 2);
@ -59,7 +59,7 @@ h3 {
} }
.item:before { .item:before {
content: ' '; content: " ";
border-left: 1px solid var(--color-border); border-left: 1px solid var(--color-border);
position: absolute; position: absolute;
left: 0; left: 0;
@ -68,7 +68,7 @@ h3 {
} }
.item:after { .item:after {
content: ' '; content: " ";
border-left: 1px solid var(--color-border); border-left: 1px solid var(--color-border);
position: absolute; position: absolute;
left: 0; left: 0;
@ -83,5 +83,5 @@ h3 {
.item:last-of-type:after { .item:last-of-type:after {
display: none; display: none;
} }
} }
</style> </style>

18
frontend/src/components/__tests__/HelloWorld.spec.ts
View file

@ -1,11 +1,11 @@
import { describe, it, expect } from 'vitest' import { describe, it, expect } from "vitest";
import { mount } from '@vue/test-utils' import { mount } from "@vue/test-utils";
import HelloWorld from '../HelloWorld.vue' import HelloWorld from "../HelloWorld.vue";
describe('HelloWorld', () => { describe("HelloWorld", () => {
it('renders properly', () => { it("renders properly", () => {
const wrapper = mount(HelloWorld, { props: { msg: 'Hello Vitest' } }) const wrapper = mount(HelloWorld, { props: { msg: "Hello Vitest" } });
expect(wrapper.text()).toContain('Hello Vitest') expect(wrapper.text()).toContain("Hello Vitest");
}) });
}) });

7
frontend/src/components/icons/IconCommunity.vue
View file

@ -1,5 +1,10 @@
<template> <template>
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" fill="currentColor"> <svg
xmlns="http://www.w3.org/2000/svg"
width="20"
height="20"
fill="currentColor"
>
<path <path
d="M15 4a1 1 0 1 0 0 2V4zm0 11v-1a1 1 0 0 0-1 1h1zm0 4l-.707.707A1 1 0 0 0 16 19h-1zm-4-4l.707-.707A1 1 0 0 0 11 14v1zm-4.707-1.293a1 1 0 0 0-1.414 1.414l1.414-1.414zm-.707.707l-.707-.707.707.707zM9 11v-1a1 1 0 0 0-.707.293L9 11zm-4 0h1a1 1 0 0 0-1-1v1zm0 4H4a1 1 0 0 0 1.707.707L5 15zm10-9h2V4h-2v2zm2 0a1 1 0 0 1 1 1h2a3 3 0 0 0-3-3v2zm1 1v6h2V7h-2zm0 6a1 1 0 0 1-1 1v2a3 3 0 0 0 3-3h-2zm-1 1h-2v2h2v-2zm-3 1v4h2v-4h-2zm1.707 3.293l-4-4-1.414 1.414 4 4 1.414-1.414zM11 14H7v2h4v-2zm-4 0c-.276 0-.525-.111-.707-.293l-1.414 1.414C5.42 15.663 6.172 16 7 16v-2zm-.707 1.121l3.414-3.414-1.414-1.414-3.414 3.414 1.414 1.414zM9 12h4v-2H9v2zm4 0a3 3 0 0 0 3-3h-2a1 1 0 0 1-1 1v2zm3-3V3h-2v6h2zm0-6a3 3 0 0 0-3-3v2a1 1 0 0 1 1 1h2zm-3-3H3v2h10V0zM3 0a3 3 0 0 0-3 3h2a1 1 0 0 1 1-1V0zM0 3v6h2V3H0zm0 6a3 3 0 0 0 3 3v-2a1 1 0 0 1-1-1H0zm3 3h2v-2H3v2zm1-1v4h2v-4H4zm1.707 4.707l.586-.586-1.414-1.414-.586.586 1.414 1.414z" d="M15 4a1 1 0 1 0 0 2V4zm0 11v-1a1 1 0 0 0-1 1h1zm0 4l-.707.707A1 1 0 0 0 16 19h-1zm-4-4l.707-.707A1 1 0 0 0 11 14v1zm-4.707-1.293a1 1 0 0 0-1.414 1.414l1.414-1.414zm-.707.707l-.707-.707.707.707zM9 11v-1a1 1 0 0 0-.707.293L9 11zm-4 0h1a1 1 0 0 0-1-1v1zm0 4H4a1 1 0 0 0 1.707.707L5 15zm10-9h2V4h-2v2zm2 0a1 1 0 0 1 1 1h2a3 3 0 0 0-3-3v2zm1 1v6h2V7h-2zm0 6a1 1 0 0 1-1 1v2a3 3 0 0 0 3-3h-2zm-1 1h-2v2h2v-2zm-3 1v4h2v-4h-2zm1.707 3.293l-4-4-1.414 1.414 4 4 1.414-1.414zM11 14H7v2h4v-2zm-4 0c-.276 0-.525-.111-.707-.293l-1.414 1.414C5.42 15.663 6.172 16 7 16v-2zm-.707 1.121l3.414-3.414-1.414-1.414-3.414 3.414 1.414 1.414zM9 12h4v-2H9v2zm4 0a3 3 0 0 0 3-3h-2a1 1 0 0 1-1 1v2zm3-3V3h-2v6h2zm0-6a3 3 0 0 0-3-3v2a1 1 0 0 1 1 1h2zm-3-3H3v2h10V0zM3 0a3 3 0 0 0-3 3h2a1 1 0 0 1 1-1V0zM0 3v6h2V3H0zm0 6a3 3 0 0 0 3 3v-2a1 1 0 0 1-1-1H0zm3 3h2v-2H3v2zm1-1v4h2v-4H4zm1.707 4.707l.586-.586-1.414-1.414-.586.586 1.414 1.414z"
/> />

7
frontend/src/components/icons/IconDocumentation.vue
View file

@ -1,5 +1,10 @@
<template> <template>
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="17" fill="currentColor"> <svg
xmlns="http://www.w3.org/2000/svg"
width="20"
height="17"
fill="currentColor"
>
<path <path
d="M11 2.253a1 1 0 1 0-2 0h2zm-2 13a1 1 0 1 0 2 0H9zm.447-12.167a1 1 0 1 0 1.107-1.666L9.447 3.086zM1 2.253L.447 1.42A1 1 0 0 0 0 2.253h1zm0 13H0a1 1 0 0 0 1.553.833L1 15.253zm8.447.833a1 1 0 1 0 1.107-1.666l-1.107 1.666zm0-14.666a1 1 0 1 0 1.107 1.666L9.447 1.42zM19 2.253h1a1 1 0 0 0-.447-.833L19 2.253zm0 13l-.553.833A1 1 0 0 0 20 15.253h-1zm-9.553-.833a1 1 0 1 0 1.107 1.666L9.447 14.42zM9 2.253v13h2v-13H9zm1.553-.833C9.203.523 7.42 0 5.5 0v2c1.572 0 2.961.431 3.947 1.086l1.107-1.666zM5.5 0C3.58 0 1.797.523.447 1.42l1.107 1.666C2.539 2.431 3.928 2 5.5 2V0zM0 2.253v13h2v-13H0zm1.553 13.833C2.539 15.431 3.928 15 5.5 15v-2c-1.92 0-3.703.523-5.053 1.42l1.107 1.666zM5.5 15c1.572 0 2.961.431 3.947 1.086l1.107-1.666C9.203 13.523 7.42 13 5.5 13v2zm5.053-11.914C11.539 2.431 12.928 2 14.5 2V0c-1.92 0-3.703.523-5.053 1.42l1.107 1.666zM14.5 2c1.573 0 2.961.431 3.947 1.086l1.107-1.666C18.203.523 16.421 0 14.5 0v2zm3.5.253v13h2v-13h-2zm1.553 12.167C18.203 13.523 16.421 13 14.5 13v2c1.573 0 2.961.431 3.947 1.086l1.107-1.666zM14.5 13c-1.92 0-3.703.523-5.053 1.42l1.107 1.666C11.539 15.431 12.928 15 14.5 15v-2z" d="M11 2.253a1 1 0 1 0-2 0h2zm-2 13a1 1 0 1 0 2 0H9zm.447-12.167a1 1 0 1 0 1.107-1.666L9.447 3.086zM1 2.253L.447 1.42A1 1 0 0 0 0 2.253h1zm0 13H0a1 1 0 0 0 1.553.833L1 15.253zm8.447.833a1 1 0 1 0 1.107-1.666l-1.107 1.666zm0-14.666a1 1 0 1 0 1.107 1.666L9.447 1.42zM19 2.253h1a1 1 0 0 0-.447-.833L19 2.253zm0 13l-.553.833A1 1 0 0 0 20 15.253h-1zm-9.553-.833a1 1 0 1 0 1.107 1.666L9.447 14.42zM9 2.253v13h2v-13H9zm1.553-.833C9.203.523 7.42 0 5.5 0v2c1.572 0 2.961.431 3.947 1.086l1.107-1.666zM5.5 0C3.58 0 1.797.523.447 1.42l1.107 1.666C2.539 2.431 3.928 2 5.5 2V0zM0 2.253v13h2v-13H0zm1.553 13.833C2.539 15.431 3.928 15 5.5 15v-2c-1.92 0-3.703.523-5.053 1.42l1.107 1.666zM5.5 15c1.572 0 2.961.431 3.947 1.086l1.107-1.666C9.203 13.523 7.42 13 5.5 13v2zm5.053-11.914C11.539 2.431 12.928 2 14.5 2V0c-1.92 0-3.703.523-5.053 1.42l1.107 1.666zM14.5 2c1.573 0 2.961.431 3.947 1.086l1.107-1.666C18.203.523 16.421 0 14.5 0v2zm3.5.253v13h2v-13h-2zm1.553 12.167C18.203 13.523 16.421 13 14.5 13v2c1.573 0 2.961.431 3.947 1.086l1.107-1.666zM14.5 13c-1.92 0-3.703.523-5.053 1.42l1.107 1.666C11.539 15.431 12.928 15 14.5 15v-2z"
/> />

7
frontend/src/components/icons/IconEcosystem.vue
View file

@ -1,5 +1,10 @@
<template> <template>
<svg xmlns="http://www.w3.org/2000/svg" width="18" height="20" fill="currentColor"> <svg
xmlns="http://www.w3.org/2000/svg"
width="18"
height="20"
fill="currentColor"
>
<path <path
d="M11.447 8.894a1 1 0 1 0-.894-1.789l.894 1.789zm-2.894-.789a1 1 0 1 0 .894 1.789l-.894-1.789zm0 1.789a1 1 0 1 0 .894-1.789l-.894 1.789zM7.447 7.106a1 1 0 1 0-.894 1.789l.894-1.789zM10 9a1 1 0 1 0-2 0h2zm-2 2.5a1 1 0 1 0 2 0H8zm9.447-5.606a1 1 0 1 0-.894-1.789l.894 1.789zm-2.894-.789a1 1 0 1 0 .894 1.789l-.894-1.789zm2 .789a1 1 0 1 0 .894-1.789l-.894 1.789zm-1.106-2.789a1 1 0 1 0-.894 1.789l.894-1.789zM18 5a1 1 0 1 0-2 0h2zm-2 2.5a1 1 0 1 0 2 0h-2zm-5.447-4.606a1 1 0 1 0 .894-1.789l-.894 1.789zM9 1l.447-.894a1 1 0 0 0-.894 0L9 1zm-2.447.106a1 1 0 1 0 .894 1.789l-.894-1.789zm-6 3a1 1 0 1 0 .894 1.789L.553 4.106zm2.894.789a1 1 0 1 0-.894-1.789l.894 1.789zm-2-.789a1 1 0 1 0-.894 1.789l.894-1.789zm1.106 2.789a1 1 0 1 0 .894-1.789l-.894 1.789zM2 5a1 1 0 1 0-2 0h2zM0 7.5a1 1 0 1 0 2 0H0zm8.553 12.394a1 1 0 1 0 .894-1.789l-.894 1.789zm-1.106-2.789a1 1 0 1 0-.894 1.789l.894-1.789zm1.106 1a1 1 0 1 0 .894 1.789l-.894-1.789zm2.894.789a1 1 0 1 0-.894-1.789l.894 1.789zM8 19a1 1 0 1 0 2 0H8zm2-2.5a1 1 0 1 0-2 0h2zm-7.447.394a1 1 0 1 0 .894-1.789l-.894 1.789zM1 15H0a1 1 0 0 0 .553.894L1 15zm1-2.5a1 1 0 1 0-2 0h2zm12.553 2.606a1 1 0 1 0 .894 1.789l-.894-1.789zM17 15l.447.894A1 1 0 0 0 18 15h-1zm1-2.5a1 1 0 1 0-2 0h2zm-7.447-5.394l-2 1 .894 1.789 2-1-.894-1.789zm-1.106 1l-2-1-.894 1.789 2 1 .894-1.789zM8 9v2.5h2V9H8zm8.553-4.894l-2 1 .894 1.789 2-1-.894-1.789zm.894 0l-2-1-.894 1.789 2 1 .894-1.789zM16 5v2.5h2V5h-2zm-4.553-3.894l-2-1-.894 1.789 2 1 .894-1.789zm-2.894-1l-2 1 .894 1.789 2-1L8.553.106zM1.447 5.894l2-1-.894-1.789-2 1 .894 1.789zm-.894 0l2 1 .894-1.789-2-1-.894 1.789zM0 5v2.5h2V5H0zm9.447 13.106l-2-1-.894 1.789 2 1 .894-1.789zm0 1.789l2-1-.894-1.789-2 1 .894 1.789zM10 19v-2.5H8V19h2zm-6.553-3.894l-2-1-.894 1.789 2 1 .894-1.789zM2 15v-2.5H0V15h2zm13.447 1.894l2-1-.894-1.789-2 1 .894 1.789zM18 15v-2.5h-2V15h2z" d="M11.447 8.894a1 1 0 1 0-.894-1.789l.894 1.789zm-2.894-.789a1 1 0 1 0 .894 1.789l-.894-1.789zm0 1.789a1 1 0 1 0 .894-1.789l-.894 1.789zM7.447 7.106a1 1 0 1 0-.894 1.789l.894-1.789zM10 9a1 1 0 1 0-2 0h2zm-2 2.5a1 1 0 1 0 2 0H8zm9.447-5.606a1 1 0 1 0-.894-1.789l.894 1.789zm-2.894-.789a1 1 0 1 0 .894 1.789l-.894-1.789zm2 .789a1 1 0 1 0 .894-1.789l-.894 1.789zm-1.106-2.789a1 1 0 1 0-.894 1.789l.894-1.789zM18 5a1 1 0 1 0-2 0h2zm-2 2.5a1 1 0 1 0 2 0h-2zm-5.447-4.606a1 1 0 1 0 .894-1.789l-.894 1.789zM9 1l.447-.894a1 1 0 0 0-.894 0L9 1zm-2.447.106a1 1 0 1 0 .894 1.789l-.894-1.789zm-6 3a1 1 0 1 0 .894 1.789L.553 4.106zm2.894.789a1 1 0 1 0-.894-1.789l.894 1.789zm-2-.789a1 1 0 1 0-.894 1.789l.894-1.789zm1.106 2.789a1 1 0 1 0 .894-1.789l-.894 1.789zM2 5a1 1 0 1 0-2 0h2zM0 7.5a1 1 0 1 0 2 0H0zm8.553 12.394a1 1 0 1 0 .894-1.789l-.894 1.789zm-1.106-2.789a1 1 0 1 0-.894 1.789l.894-1.789zm1.106 1a1 1 0 1 0 .894 1.789l-.894-1.789zm2.894.789a1 1 0 1 0-.894-1.789l.894 1.789zM8 19a1 1 0 1 0 2 0H8zm2-2.5a1 1 0 1 0-2 0h2zm-7.447.394a1 1 0 1 0 .894-1.789l-.894 1.789zM1 15H0a1 1 0 0 0 .553.894L1 15zm1-2.5a1 1 0 1 0-2 0h2zm12.553 2.606a1 1 0 1 0 .894 1.789l-.894-1.789zM17 15l.447.894A1 1 0 0 0 18 15h-1zm1-2.5a1 1 0 1 0-2 0h2zm-7.447-5.394l-2 1 .894 1.789 2-1-.894-1.789zm-1.106 1l-2-1-.894 1.789 2 1 .894-1.789zM8 9v2.5h2V9H8zm8.553-4.894l-2 1 .894 1.789 2-1-.894-1.789zm.894 0l-2-1-.894 1.789 2 1 .894-1.789zM16 5v2.5h2V5h-2zm-4.553-3.894l-2-1-.894 1.789 2 1 .894-1.789zm-2.894-1l-2 1 .894 1.789 2-1L8.553.106zM1.447 5.894l2-1-.894-1.789-2 1 .894 1.789zm-.894 0l2 1 .894-1.789-2-1-.894 1.789zM0 5v2.5h2V5H0zm9.447 13.106l-2-1-.894 1.789 2 1 .894-1.789zm0 1.789l2-1-.894-1.789-2 1 .894 1.789zM10 19v-2.5H8V19h2zm-6.553-3.894l-2-1-.894 1.789 2 1 .894-1.789zM2 15v-2.5H0V15h2zm13.447 1.894l2-1-.894-1.789-2 1 .894 1.789zM18 15v-2.5h-2V15h2z"
/> />

7
frontend/src/components/icons/IconSupport.vue
View file

@ -1,5 +1,10 @@
<template> <template>
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" fill="currentColor"> <svg
xmlns="http://www.w3.org/2000/svg"
width="20"
height="20"
fill="currentColor"
>
<path <path
d="M10 3.22l-.61-.6a5.5 5.5 0 0 0-7.666.105 5.5 5.5 0 0 0-.114 7.665L10 18.78l8.39-8.4a5.5 5.5 0 0 0-.114-7.665 5.5 5.5 0 0 0-7.666-.105l-.61.61z" d="M10 3.22l-.61-.6a5.5 5.5 0 0 0-7.666.105 5.5 5.5 0 0 0-.114 7.665L10 18.78l8.39-8.4a5.5 5.5 0 0 0-.114-7.665 5.5 5.5 0 0 0-7.666-.105l-.61.61z"
/> />

18
frontend/src/main.ts
View file

@ -1,15 +1,15 @@
import './assets/main.css' import "./assets/main.css";
import { createApp } from 'vue'; import { createApp } from "vue";
// Vuetify // Vuetify
import 'vuetify/styles'; import "vuetify/styles";
import { createVuetify } from 'vuetify'; import { createVuetify } from "vuetify";
import * as components from 'vuetify/components'; import * as components from "vuetify/components";
import * as directives from 'vuetify/directives'; import * as directives from "vuetify/directives";
// Components // Components
import App from './App.vue' import App from "./App.vue";
import router from './router' import router from "./router";
const app = createApp(App); const app = createApp(App);
@ -21,4 +21,4 @@ const vuetify = createVuetify({
}); });
app.use(vuetify); app.use(vuetify);
app.mount('#app'); app.mount("#app");

26
frontend/src/router/index.ts
View file

@ -1,23 +1,25 @@
import { createRouter, createWebHistory } from 'vue-router' import { createRouter, createWebHistory } from "vue-router";
import HomeView from '../views/HomeView.vue' import HomeView from "../views/HomeView.vue";
const router = createRouter({ const router = createRouter({
history: createWebHistory(import.meta.env.BASE_URL), history: createWebHistory(import.meta.env.BASE_URL),
routes: [ routes: [
{ {
path: '/', path: "/",
name: 'home', name: "home",
component: HomeView, component: HomeView,
}, },
{ {
path: '/about', path: "/about",
name: 'about', name: "about",
// route level code-splitting // Route level code-splitting
// this generates a separate chunk (About.[hash].js) for this route // This generates a separate chunk (About.[hash].js) for this route
// which is lazy-loaded when the route is visited. // Which is lazy-loaded when the route is visited.
component: () => import('../views/AboutView.vue'), component: () => {
return import("../views/AboutView.vue");
},
}, },
], ],
}) });
export default router export default router;

4
frontend/src/views/AboutView.vue
View file

@ -6,11 +6,11 @@
</template> </template>
<style> <style>
@media (min-width: 1024px) { @media (min-width: 1024px) {
.about { .about {
min-height: 100vh; min-height: 100vh;
display: flex; display: flex;
align-items: center; align-items: center;
} }
} }
</style> </style>

2
frontend/src/views/HomeView.vue
View file

@ -1,5 +1,5 @@
<script setup lang="ts"> <script setup lang="ts">
import TheWelcome from '../components/TheWelcome.vue' import TheWelcome from "../components/TheWelcome.vue";
</script> </script>
<template> <template>

17
frontend/vite.config.ts
View file

@ -1,18 +1,15 @@
import { fileURLToPath, URL } from 'node:url' import { fileURLToPath, URL } from 'node:url';
import { defineConfig } from 'vite' import { defineConfig } from 'vite';
import vue from '@vitejs/plugin-vue' import vue from '@vitejs/plugin-vue';
import vueDevTools from 'vite-plugin-vue-devtools' import vueDevTools from 'vite-plugin-vue-devtools';
// https://vite.dev/config/ // https://vite.dev/config/
export default defineConfig({ export default defineConfig({
plugins: [ plugins: [vue(), vueDevTools()],
vue(),
vueDevTools(),
],
resolve: { resolve: {
alias: { alias: {
'@': fileURLToPath(new URL('./src', import.meta.url)) '@': fileURLToPath(new URL('./src', import.meta.url)),
}, },
}, },
}) });