diff --git a/Frontend/idatg2204_project_frontend/.eslintrc.cjs b/Frontend/idatg2204_project_frontend/.eslintrc.cjs
new file mode 100644
index 0000000000000000000000000000000000000000..3e212e1d4307a332e8511f530bc48a4ad5ed6f95
--- /dev/null
+++ b/Frontend/idatg2204_project_frontend/.eslintrc.cjs
@@ -0,0 +1,21 @@
+module.exports = {
+ root: true,
+ env: { browser: true, es2020: true },
+ extends: [
+ 'eslint:recommended',
+ 'plugin:react/recommended',
+ 'plugin:react/jsx-runtime',
+ 'plugin:react-hooks/recommended',
+ ],
+ ignorePatterns: ['dist', '.eslintrc.cjs'],
+ parserOptions: { ecmaVersion: 'latest', sourceType: 'module' },
+ settings: { react: { version: '18.2' } },
+ plugins: ['react-refresh'],
+ rules: {
+ 'react/jsx-no-target-blank': 'off',
+ 'react-refresh/only-export-components': [
+ 'warn',
+ { allowConstantExport: true },
+ ],
+ },
+}
diff --git a/Frontend/idatg2204_project_frontend/.gitignore b/Frontend/idatg2204_project_frontend/.gitignore
new file mode 100644
index 0000000000000000000000000000000000000000..a547bf36d8d11a4f89c59c144f24795749086dd1
--- /dev/null
+++ b/Frontend/idatg2204_project_frontend/.gitignore
@@ -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?
diff --git a/Frontend/idatg2204_project_frontend/index.html b/Frontend/idatg2204_project_frontend/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..0c589eccd4d48e270e161a1ab91baee5e5f4b4bc
--- /dev/null
+++ b/Frontend/idatg2204_project_frontend/index.html
@@ -0,0 +1,13 @@
+<!doctype html>
+<html lang="en">
+ <head>
+ <meta charset="UTF-8" />
+ <link rel="icon" type="image/svg+xml" href="/vite.svg" />
+ <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+ <title>Vite + React</title>
+ </head>
+ <body>
+ <div id="root"></div>
+ <script type="module" src="/src/main.jsx"></script>
+ </body>
+</html>
diff --git a/Frontend/idatg2204_project_frontend/package.json b/Frontend/idatg2204_project_frontend/package.json
new file mode 100644
index 0000000000000000000000000000000000000000..f9c7f089269bef3dc3f71d1d140415bf2bfee419
--- /dev/null
+++ b/Frontend/idatg2204_project_frontend/package.json
@@ -0,0 +1,26 @@
+{
+ "name": "idatg2204_project_frontend",
+ "private": true,
+ "version": "0.0.0",
+ "type": "module",
+ "scripts": {
+ "dev": "vite",
+ "build": "vite build",
+ "lint": "eslint . --ext js,jsx --report-unused-disable-directives --max-warnings 0",
+ "preview": "vite preview"
+ },
+ "dependencies": {
+ "react": "^18.2.0",
+ "react-dom": "^18.2.0"
+ },
+ "devDependencies": {
+ "@types/react": "^18.2.66",
+ "@types/react-dom": "^18.2.22",
+ "@vitejs/plugin-react": "^4.2.1",
+ "eslint": "^8.57.0",
+ "eslint-plugin-react": "^7.34.1",
+ "eslint-plugin-react-hooks": "^4.6.0",
+ "eslint-plugin-react-refresh": "^0.4.6",
+ "vite": "^5.2.0"
+ }
+}
diff --git a/Frontend/idatg2204_project_frontend/src/App.jsx b/Frontend/idatg2204_project_frontend/src/App.jsx
new file mode 100644
index 0000000000000000000000000000000000000000..b8b8473a3696b4f77deff889a84ab45629c42079
--- /dev/null
+++ b/Frontend/idatg2204_project_frontend/src/App.jsx
@@ -0,0 +1,35 @@
+import { useState } from 'react'
+import reactLogo from './assets/react.svg'
+import viteLogo from '/vite.svg'
+import './App.css'
+
+function App() {
+ const [count, setCount] = useState(0)
+
+ return (
+ <>
+ <div>
+ <a href="https://vitejs.dev" target="_blank">
+ <img src={viteLogo} className="logo" alt="Vite logo" />
+ </a>
+ <a href="https://react.dev" target="_blank">
+ <img src={reactLogo} className="logo react" alt="React logo" />
+ </a>
+ </div>
+ <h1>Vite + React</h1>
+ <div className="card">
+ <button onClick={() => setCount((count) => count + 1)}>
+ count is {count}
+ </button>
+ <p>
+ Edit <code>src/App.jsx</code> and save to test HMR
+ </p>
+ </div>
+ <p className="read-the-docs">
+ Click on the Vite and React logos to learn more
+ </p>
+ </>
+ )
+}
+
+export default App
diff --git a/Frontend/idatg2204_project_frontend/src/main.jsx b/Frontend/idatg2204_project_frontend/src/main.jsx
new file mode 100644
index 0000000000000000000000000000000000000000..54b39dd1d900e866bb91ee441d372a8924b9d87a
--- /dev/null
+++ b/Frontend/idatg2204_project_frontend/src/main.jsx
@@ -0,0 +1,10 @@
+import React from 'react'
+import ReactDOM from 'react-dom/client'
+import App from './App.jsx'
+import './index.css'
+
+ReactDOM.createRoot(document.getElementById('root')).render(
+ <React.StrictMode>
+ <App />
+ </React.StrictMode>,
+)
diff --git a/Frontend/idatg2204_project_frontend/vite.config.js b/Frontend/idatg2204_project_frontend/vite.config.js
new file mode 100644
index 0000000000000000000000000000000000000000..5a33944a9b41b59a9cf06ee4bb5586c77510f06b
--- /dev/null
+++ b/Frontend/idatg2204_project_frontend/vite.config.js
@@ -0,0 +1,7 @@
+import { defineConfig } from 'vite'
+import react from '@vitejs/plugin-react'
+
+// https://vitejs.dev/config/
+export default defineConfig({
+ plugins: [react()],
+})