add Docker

neuefische · Jun 6, 2024 · 6ed6270 · 6ed6270
1 parent d9d1641
commit 6ed6270
Show file tree

Hide file tree

Showing 13 changed files with 337 additions and 34 deletions.
diff --git a/.idea/sonarlint/issuestore/index.pb b/.idea/sonarlint/issuestore/index.pb
diff --git a/.idea/sonarlint/securityhotspotstore/index.pb b/.idea/sonarlint/securityhotspotstore/index.pb
diff --git a/Dockerfile b/Dockerfile
@@ -0,0 +1,7 @@
+FROM --platform=linux/amd64 openjdk:22
+
+ADD backend/target/backend-0.0.1-SNAPSHOT.jar app.jar
+
+EXPOSE 8080
+
+ENTRYPOINT ["java", "-jar", "app.jar"]
diff --git a/backend/src/main/resources/application.properties b/backend/src/main/resources/application.properties
@@ -2,3 +2,4 @@ spring.application.name=backend
 spring.data.mongodb.uri=${MONGODB_URL}
 spring.data.mongodb.database=webshop
 
+
diff --git a/backend/src/main/resources/static/assets/index-DD_6ghZ4.js b/backend/src/main/resources/static/assets/index-DD_6ghZ4.js
diff --git a/backend/src/main/resources/static/assets/index-DiwrgTda.css b/backend/src/main/resources/static/assets/index-DiwrgTda.css
diff --git a/backend/src/main/resources/static/index.html b/backend/src/main/resources/static/index.html
@@ -0,0 +1,14 @@
+<!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 + TS</title>
+    <script type="module" crossorigin src="/assets/index-DD_6ghZ4.js"></script>
+    <link rel="stylesheet" crossorigin href="/assets/index-DiwrgTda.css">
+  </head>
+  <body>
+    <div id="root"></div>
+  </body>
+</html>
diff --git a/backend/src/main/resources/static/vite.svg b/backend/src/main/resources/static/vite.svg
diff --git a/frontend/src/App.tsx b/frontend/src/App.tsx
@@ -1,35 +1,20 @@
-import { useState } from 'react'
-import reactLogo from './assets/react.svg'
-import viteLogo from '/vite.svg'
 import './App.css'
+import ProductList from "./components/ProductList.tsx";
+
+
+
 
 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.tsx</code> and save to test HMR
-        </p>
-      </div>
-      <p className="read-the-docs">
-        Click on the Vite and React logos to learn more
-      </p>
-    </>
-  )
+
+
+    return (
+        <>
+            <h1>MyWebShop</h1>
+        <ProductList />
+
+        </>
+
+    )
 }
 
 export default App
diff --git a/frontend/src/ProductService.ts b/frontend/src/ProductService.ts
@@ -0,0 +1,32 @@
+import axios from "axios";
+import { ProductTypes } from './product';
+
+
+
+const ProductService = {
+
+    // Get Products
+
+    getProducts: async (): Promise<ProductTypes[]> => {
+        try {
+            const response = await axios.get<ProductTypes[]>(`/api/products`);
+            return response.data;
+        } catch (error) {
+            console.error('Fehler beim Abrufen der Produkte:', error);
+            return [];
+        }
+    },
+
+    // Add Products
+    addProducts: async (title: string, amount: number): Promise<ProductTypes | null> => {
+        try {
+            const response = await axios.post<ProductTypes>(`/api/products`, { title, amount });
+            return response.data;
+        } catch (error) {
+            console.error('Fehler beim Hinzufügen der Produkte:', error);
+            return null;
+        }
+    },
+};
+
+export default ProductService;
diff --git a/frontend/src/components/ProductForm.tsx b/frontend/src/components/ProductForm.tsx
@@ -0,0 +1,34 @@
+import React, {useState} from "react";
+
+
+
+
+interface PropTypes{
+    setProducts:any;
+}
+const ProductForm: React.FC<PropTypes> = ({ setProducts }) => {
+    const [newProductText, setNewProductText] = useState<string>("");
+
+    const handleAddTodo = () => {
+        if (newProductText.trim() !== "") {
+            const newProduct = {title: newProductText, int: 0}; // Ein einfaches Todo-Objekt erstellen
+            setProducts((prevProduct: any) => [...prevProduct, newProduct]); // Das neue Todo der Liste hinzufügen
+            setNewProductText(""); // Den Eingabetext zurücksetzen
+        }
+    };
+
+    return (
+        <div className="inputForm">
+            <input
+                type="text"
+                value={newProductText}
+                onChange={(e) => setNewProductText(e.target.value)}
+                autoFocus={true}
+                placeholder="Add a Task"
+            />
+            <button onClick={handleAddTodo}>Add Product</button>
+        </div>
+    )
+}
+
+export default ProductForm
diff --git a/frontend/src/components/ProductList.tsx b/frontend/src/components/ProductList.tsx
@@ -0,0 +1,24 @@
+import { useState, useEffect } from 'react';
+import ProductService from "../ProductService";
+import { ProductTypes } from "../product";
+import ProductForm from "./ProductForm";
+
+const ProductList = () => {
+    const [, setProducts] = useState<ProductTypes[]>([]);
+
+    useEffect(() => {
+        const fetchProducts = async () => {
+            const fetchedProducts = await ProductService.getProducts();
+            setProducts(fetchedProducts);
+        };
+        fetchProducts();
+    }, []);
+
+    return (
+        <div>
+            <ProductForm setProducts={setProducts}/>
+        </div>
+    );
+};
+
+export default ProductList;
diff --git a/frontend/src/main.tsx b/frontend/src/main.tsx
@@ -2,9 +2,17 @@ import React from 'react'
 import ReactDOM from 'react-dom/client'
 import App from './App.tsx'
 import './index.css'
+import {BrowserRouter} from "react-router-dom";
 
 ReactDOM.createRoot(document.getElementById('root')!).render(
-  <React.StrictMode>
-    <App />
-  </React.StrictMode>,
+<BrowserRouter>
+
+    <React.StrictMode>
+        <App />
+    </React.StrictMode>,
+
+
+</BrowserRouter>
+
+
 )
Original file line number	Diff line number	Diff line change
Expand Up		@@ -2,3 +2,4 @@ spring.application.name=backend
		spring.data.mongodb.uri=${MONGODB_URL}
		spring.data.mongodb.database=webshop