henry/Studia
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

initial commit

Browse Source
This commit is contained in:
henry
2025-12-13 17:40:55 +01:00
parent 3219445d37
commit 726db69115
32 changed files with 4411 additions and 264 deletions
Download Patch File Download Diff File Expand all files Collapse all files

24
frontend/studia/.gitignore vendored Normal file
View File

@@ -0,0 +1,24 @@
# Logs
logs
*.log
npm-debug.log*
yarn-debug.log*
yarn-error.log*
pnpm-debug.log*
lerna-debug.log*
node_modules
dist
dist-ssr
*.local
# Editor directories and files
.vscode/*
!.vscode/extensions.json
.idea
.DS_Store
*.suo
*.ntvs*
*.njsproj
*.sln
*.sw?

73
frontend/studia/README.md Normal file
View File

@@ -0,0 +1,73 @@
# React + TypeScript + Vite
This template provides a minimal setup to get React working in Vite with HMR and some ESLint rules.
Currently, two official plugins are available:
- [@vitejs/plugin-react](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react) uses [Babel](https://babeljs.io/) (or [oxc](https://oxc.rs) when used in [rolldown-vite](https://vite.dev/guide/rolldown)) for Fast Refresh
- [@vitejs/plugin-react-swc](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react-swc) uses [SWC](https://swc.rs/) for Fast Refresh
## React Compiler
The React Compiler is not enabled on this template because of its impact on dev & build performances. To add it, see [this documentation](https://react.dev/learn/react-compiler/installation).
## Expanding the ESLint configuration
If you are developing a production application, we recommend updating the configuration to enable type-aware lint rules:
```js
export default defineConfig([
globalIgnores(['dist']),
{
files: ['**/*.{ts,tsx}'],
extends: [
// Other configs...
// Remove tseslint.configs.recommended and replace with this
tseslint.configs.recommendedTypeChecked,
// Alternatively, use this for stricter rules
tseslint.configs.strictTypeChecked,
// Optionally, add this for stylistic rules
tseslint.configs.stylisticTypeChecked,
// Other configs...
],
languageOptions: {
parserOptions: {
project: ['./tsconfig.node.json', './tsconfig.app.json'],
tsconfigRootDir: import.meta.dirname,
},
// other options...
},
},
])
```
You can also install [eslint-plugin-react-x](https://github.com/Rel1cx/eslint-react/tree/main/packages/plugins/eslint-plugin-react-x) and [eslint-plugin-react-dom](https://github.com/Rel1cx/eslint-react/tree/main/packages/plugins/eslint-plugin-react-dom) for React-specific lint rules:
```js
// eslint.config.js
import reactX from 'eslint-plugin-react-x'
import reactDom from 'eslint-plugin-react-dom'
export default defineConfig([
globalIgnores(['dist']),
{
files: ['**/*.{ts,tsx}'],
extends: [
// Other configs...
// Enable lint rules for React
reactX.configs['recommended-typescript'],
// Enable lint rules for React DOM
reactDom.configs.recommended,
],
languageOptions: {
parserOptions: {
project: ['./tsconfig.node.json', './tsconfig.app.json'],
tsconfigRootDir: import.meta.dirname,
},
// other options...
},
},
])
```

23
frontend/studia/eslint.config.js Normal file
View File

@@ -0,0 +1,23 @@
import js from '@eslint/js'
import globals from 'globals'
import reactHooks from 'eslint-plugin-react-hooks'
import reactRefresh from 'eslint-plugin-react-refresh'
import tseslint from 'typescript-eslint'
import { defineConfig, globalIgnores } from 'eslint/config'
export default defineConfig([
globalIgnores(['dist']),
{
files: ['**/*.{ts,tsx}'],
extends: [
js.configs.recommended,
tseslint.configs.recommended,
reactHooks.configs.flat.recommended,
reactRefresh.configs.vite,
],
languageOptions: {
ecmaVersion: 2020,
globals: globals.browser,
},
},
])

13
frontend/studia/index.html Normal file
View File

@@ -0,0 +1,13 @@
<!doctype html>
<html lang="de">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link href="/src/index.css" rel="stylesheet">
<title>studia</title>
</head>
<body>
<div id="root"></div>
<script type="module" src="/src/main.tsx"></script>
</body>
</html>

3732
frontend/studia/package-lock.json generated Normal file
View File

File diff suppressed because it is too large Load Diff

32
frontend/studia/package.json Normal file
View File

@@ -0,0 +1,32 @@
{
"name": "studia",
"private": true,
"version": "0.0.0",
"type": "module",
"scripts": {
"dev": "vite",
"build": "tsc -b && vite build",
"lint": "eslint .",
"preview": "vite preview"
},
"dependencies": {
"@tailwindcss/vite": "^4.1.18",
"react": "^19.2.0",
"react-dom": "^19.2.0",
"tailwindcss": "^4.1.18"
},
"devDependencies": {
"@eslint/js": "^9.39.1",
"@types/node": "^24.10.1",
"@types/react": "^19.2.5",
"@types/react-dom": "^19.2.3",
"@vitejs/plugin-react": "^5.1.1",
"eslint": "^9.39.1",
"eslint-plugin-react-hooks": "^7.0.1",
"eslint-plugin-react-refresh": "^0.4.24",
"globals": "^16.5.0",
"typescript": "~5.9.3",
"typescript-eslint": "^8.46.4",
"vite": "^7.2.4"
}
}

1
frontend/studia/public/vite.svg Normal file
View File

@@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--logos" width="31.88" height="32" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 257"><defs><linearGradient id="IconifyId1813088fe1fbc01fb466" x1="-.828%" x2="57.636%" y1="7.652%" y2="78.411%"><stop offset="0%" stop-color="#41D1FF"></stop><stop offset="100%" stop-color="#BD34FE"></stop></linearGradient><linearGradient id="IconifyId1813088fe1fbc01fb467" x1="43.376%" x2="50.316%" y1="2.242%" y2="89.03%"><stop offset="0%" stop-color="#FFEA83"></stop><stop offset="8.333%" stop-color="#FFDD35"></stop><stop offset="100%" stop-color="#FFA800"></stop></linearGradient></defs><path fill="url(#IconifyId1813088fe1fbc01fb466)" d="M255.153 37.938L134.897 252.976c-2.483 4.44-8.862 4.466-11.382.048L.875 37.958c-2.746-4.814 1.371-10.646 6.827-9.67l120.385 21.517a6.537 6.537 0 0 0 2.322-.004l117.867-21.483c5.438-.991 9.574 4.796 6.877 9.62Z"></path><path fill="url(#IconifyId1813088fe1fbc01fb467)" d="M185.432.063L96.44 17.501a3.268 3.268 0 0 0-2.634 3.014l-5.474 92.456a3.268 3.268 0 0 0 3.997 3.378l24.777-5.718c2.318-.535 4.413 1.507 3.936 3.838l-7.361 36.047c-.495 2.426 1.782 4.5 4.151 3.78l15.304-4.649c2.372-.72 4.652 1.36 4.15 3.788l-11.698 56.621c-.732 3.542 3.979 5.473 5.943 2.437l1.313-2.028l72.516-144.72c1.215-2.423-.88-5.186-3.54-4.672l-25.505 4.922c-2.396.462-4.435-1.77-3.759-4.114l16.646-57.705c.677-2.35-1.37-4.583-3.769-4.113Z"></path></svg>
Side by Side

After

Width:  |  Height:  |  Size: 1.5 KiB

0
frontend/studia/src/App.css Normal file
View File

20
frontend/studia/src/App.tsx Normal file
View File

@@ -0,0 +1,20 @@
import { useState } from "react";
import Landing from "./pages/Landing";
// import Dashboard from "./pages/Dashboard";
import Dashboard from "./pages/Dashboard"
import LoginModal from "./components/LoginModal";
export default function App() {
const [token, setToken] = useState(localStorage.getItem("token"));
const [showLogin, setShowLogin] = useState(false);
if (!token)
return (
<>
<Landing onLogin={() => setShowLogin(true)} />
{showLogin && <LoginModal onSuccess={setToken} />}
</>
);
return <Dashboard />;
}

23
frontend/studia/src/components/LoginModal.tsx Normal file
View File

@@ -0,0 +1,23 @@
export default function LoginModal({ onSuccess }: any) {
const login = async () => {
const res = await fetch("http://localhost:8080/login", { method: "POST" });
const data = await res.json();
localStorage.setItem("token", data.token);
onSuccess(data.token);
};
return (
<div className="fixed inset-0 bg-black/40 flex items-center justify-center">
<div className="bg-white rounded-2xl p-8 w-96 shadow-xl">
<h2 className="text-2xl font-bold mb-6">Login</h2>
<button
onClick={login}
className="w-full bg-indigo-600 text-white py-3 rounded-xl hover:bg-indigo-700"
>
Login as Demo
</button>
</div>
</div>
);
}

1
frontend/studia/src/index.css Normal file
View File

@@ -0,0 +1 @@
@import "tailwindcss";

10
frontend/studia/src/main.tsx Normal file
View File

@@ -0,0 +1,10 @@
import { StrictMode } from 'react'
import { createRoot } from 'react-dom/client'
import './index.css'
import App from './App.tsx'
createRoot(document.getElementById('root')!).render(
<StrictMode>
<App />
</StrictMode>,
)

8
frontend/studia/src/pages/Admin.tsx Normal file
View File

@@ -0,0 +1,8 @@
export default function Admin() {
return (
<section className="bg-white rounded-2xl p-6 shadow">
<h2 className="text-xl font-semibold mb-2">Admin</h2>
<p className="text-gray-600">User & system management (placeholder)</p>
</section>
);
}

18
frontend/studia/src/pages/Builder.tsx Normal file
View File

@@ -0,0 +1,18 @@
export default function Builder() {
return (
<section className="bg-white rounded-2xl p-6 shadow">
<h2 className="text-xl font-semibold mb-4">Create Cards</h2>
<div className="grid md:grid-cols-2 gap-4">
<input className="border p-3 rounded-lg" placeholder="Term" />
<input className="border p-3 rounded-lg" placeholder="Definition" />
</div>
<button className="mt-4 bg-indigo-600 text-white px-6 py-2 rounded-lg">
Add Card
</button>
</section>
);
}

14
frontend/studia/src/pages/Dashboard.tsx Normal file
View File

@@ -0,0 +1,14 @@
import Builder from "./Builder";
import Learn from "./Learn";
import Admin from "./Admin";
export default function Dashboard() {
return (
<div className="min-h-screen bg-gray-100 p-6 space-y-10">
<Builder />
<Learn />
<Admin />
</div>
);
}

28
frontend/studia/src/pages/Landing.tsx Normal file
View File

@@ -0,0 +1,28 @@
export default function Landing({ onLogin }: { onLogin: () => void }) {
return (
<div className="min-h-screen bg-gradient-to-br from-indigo-600 to-purple-700 text-white">
<div className="max-w-6xl mx-auto px-6 py-24 text-center">
<h1 className="text-5xl font-bold mb-6">Cardify</h1>
<p className="text-xl opacity-90 mb-12">
Learn smarter with flashcards & spaced repetition
</p>
<div className="grid md:grid-cols-3 gap-6 mb-12">
{["HTTP", "JWT", "REST"].map(t => (
<div key={t} className="bg-white/10 p-6 rounded-xl backdrop-blur">
<h3 className="font-semibold text-lg">{t}</h3>
<p className="opacity-80 mt-2">Sample definition</p>
</div>
))}
</div>
<button
onClick={onLogin}
className="bg-white text-indigo-700 px-8 py-3 rounded-xl font-semibold hover:scale-105 transition"
>
Get Started
</button>
</div>
</div>
);
}

22
frontend/studia/src/pages/Learn.tsx Normal file
View File

@@ -0,0 +1,22 @@
export default function Learn() {
return (
<section className="bg-white rounded-2xl p-6 shadow">
<h2 className="text-xl font-semibold mb-4">Learn</h2>
<div className="bg-indigo-50 p-6 rounded-xl">
<h3 className="text-lg font-bold">HTTP</h3>
<p className="mt-2">Protocol for web communication</p>
<div className="mt-4 flex gap-4">
<button className="bg-green-500 text-white px-4 py-2 rounded-lg">
Correct
</button>
<button className="bg-red-500 text-white px-4 py-2 rounded-lg">
Wrong
</button>
</div>
</div>
</section>
);
}

28
frontend/studia/tsconfig.app.json Normal file
View File

@@ -0,0 +1,28 @@
{
"compilerOptions": {
"tsBuildInfoFile": "./node_modules/.tmp/tsconfig.app.tsbuildinfo",
"target": "ES2022",
"useDefineForClassFields": true,
"lib": ["ES2022", "DOM", "DOM.Iterable"],
"module": "ESNext",
"types": ["vite/client"],
"skipLibCheck": true,
/* Bundler mode */
"moduleResolution": "bundler",
"allowImportingTsExtensions": true,
"verbatimModuleSyntax": true,
"moduleDetection": "force",
"noEmit": true,
"jsx": "react-jsx",
/* Linting */
"strict": true,
"noUnusedLocals": true,
"noUnusedParameters": true,
"erasableSyntaxOnly": true,
"noFallthroughCasesInSwitch": true,
"noUncheckedSideEffectImports": true
},
"include": ["src"]
}

7
frontend/studia/tsconfig.json Normal file
View File

@@ -0,0 +1,7 @@
{
"files": [],
"references": [
{ "path": "./tsconfig.app.json" },
{ "path": "./tsconfig.node.json" }
]
}

26
frontend/studia/tsconfig.node.json Normal file
View File

@@ -0,0 +1,26 @@
{
"compilerOptions": {
"tsBuildInfoFile": "./node_modules/.tmp/tsconfig.node.tsbuildinfo",
"target": "ES2023",
"lib": ["ES2023"],
"module": "ESNext",
"types": ["node"],
"skipLibCheck": true,
/* Bundler mode */
"moduleResolution": "bundler",
"allowImportingTsExtensions": true,
"verbatimModuleSyntax": true,
"moduleDetection": "force",
"noEmit": true,
/* Linting */
"strict": true,
"noUnusedLocals": true,
"noUnusedParameters": true,
"erasableSyntaxOnly": true,
"noFallthroughCasesInSwitch": true,
"noUncheckedSideEffectImports": true
},
"include": ["vite.config.ts"]
}

11
frontend/studia/vite.config.ts Normal file
View File

@@ -0,0 +1,11 @@
import { defineConfig } from 'vite'
import react from '@vitejs/plugin-react'
import tailwindcss from '@tailwindcss/vite'
// https://vite.dev/config/
export default defineConfig({
plugins: [
react(),
tailwindcss(),
],
})