Spiele Liste und Grundstruktur App Routing
This commit is contained in:
parent
5444cf7c79
commit
6862abf583
|
@ -0,0 +1,9 @@
|
|||
import React from 'react'
|
||||
|
||||
function admin() {
|
||||
return (
|
||||
<div>admin</div>
|
||||
)
|
||||
}
|
||||
|
||||
export default admin
|
|
@ -0,0 +1,11 @@
|
|||
'use client'
|
||||
|
||||
import React from 'react'
|
||||
|
||||
function error({error}: {error: Error}) {
|
||||
return (
|
||||
<div>error {error.message}</div>
|
||||
)
|
||||
}
|
||||
|
||||
export default error
|
|
@ -0,0 +1,9 @@
|
|||
import React from 'react'
|
||||
|
||||
function features() {
|
||||
return (
|
||||
<div>features</div>
|
||||
)
|
||||
}
|
||||
|
||||
export default features
|
Binary file not shown.
Binary file not shown.
Binary file not shown.
|
@ -0,0 +1,9 @@
|
|||
import React from 'react'
|
||||
|
||||
function impressum() {
|
||||
return (
|
||||
<div>about</div>
|
||||
)
|
||||
}
|
||||
|
||||
export default impressum
|
|
@ -2,33 +2,43 @@ import type { Metadata } from "next";
|
|||
import localFont from "next/font/local";
|
||||
import "./globals.css";
|
||||
|
||||
const geistSans = localFont({
|
||||
src: "./fonts/GeistVF.woff",
|
||||
variable: "--font-geist-sans",
|
||||
import Navbar from "@/components/Navbar";
|
||||
import Footer from "@/components/Footer";
|
||||
|
||||
const latoregular = localFont({
|
||||
src: "./fonts/lato-regular.woff",
|
||||
variable: "--font-lato",
|
||||
weight: "100 900",
|
||||
});
|
||||
const geistMono = localFont({
|
||||
src: "./fonts/GeistMonoVF.woff",
|
||||
variable: "--font-geist-mono",
|
||||
})
|
||||
|
||||
const latobold = localFont({
|
||||
src: "./fonts/lato-bold.woff",
|
||||
variable: "--font-lato-bold",
|
||||
weight: "100 900",
|
||||
});
|
||||
})
|
||||
|
||||
export const metadata: Metadata = {
|
||||
title: "Create Next App",
|
||||
title: "SJTKD Abteilungen",
|
||||
description: "Generated by create next app",
|
||||
};
|
||||
|
||||
export default function RootLayout({
|
||||
children,
|
||||
}: Readonly<{
|
||||
}: {
|
||||
children: React.ReactNode;
|
||||
}>) {
|
||||
}) {
|
||||
return (
|
||||
<html lang="en">
|
||||
<html lang="de">
|
||||
<body
|
||||
className={`${geistSans.variable} ${geistMono.variable} antialiased`}
|
||||
className={latoregular.variable}
|
||||
>
|
||||
<header>
|
||||
<Navbar />
|
||||
</header>
|
||||
<main className="max-w-3xl mx-auto">
|
||||
{children}
|
||||
</main>
|
||||
<Footer />
|
||||
</body>
|
||||
</html>
|
||||
);
|
||||
|
|
|
@ -0,0 +1,9 @@
|
|||
import React from 'react'
|
||||
|
||||
function mitglied() {
|
||||
return (
|
||||
<div> Mitglieder</div>
|
||||
)
|
||||
}
|
||||
|
||||
export default mitglied
|
|
@ -1,8 +1,14 @@
|
|||
import Image from "next/image";
|
||||
import Counter from "@/components/Counter";
|
||||
|
||||
export default function Home() {
|
||||
return (<div>
|
||||
|
||||
|
||||
return (<div >
|
||||
|
||||
<h1 className="text-7xl font-bold underline">My first Next App</h1>
|
||||
|
||||
< Counter />
|
||||
|
||||
</div>
|
||||
)
|
||||
}
|
|
@ -0,0 +1,9 @@
|
|||
import React from 'react'
|
||||
|
||||
function settings() {
|
||||
return (
|
||||
<div>settings</div>
|
||||
)
|
||||
}
|
||||
|
||||
export default settings
|
|
@ -0,0 +1,11 @@
|
|||
'use client';
|
||||
import React from 'react'
|
||||
|
||||
function loading() {
|
||||
return (
|
||||
|
||||
<div>loading</div>
|
||||
)
|
||||
}
|
||||
|
||||
export default loading
|
|
@ -0,0 +1,34 @@
|
|||
import React from 'react'
|
||||
import Link from "next/link";
|
||||
|
||||
type response = {
|
||||
message: string;
|
||||
games: spiel[];
|
||||
}
|
||||
|
||||
type spiel = {
|
||||
id: number;
|
||||
name: string;
|
||||
type: number;
|
||||
};
|
||||
|
||||
async function spiele() {
|
||||
|
||||
const response = await fetch("http://localhost:2006/spiele");
|
||||
const data:response[] = await response.json();
|
||||
|
||||
return (
|
||||
<div>
|
||||
<h1> Spiele </h1>
|
||||
<ul>
|
||||
{data.games.map((spiel) => (
|
||||
<li key={spiel.id}>
|
||||
<Link href={`/spiele/${spiel.id}`}>{spiel.name}</Link>
|
||||
</li>
|
||||
))}
|
||||
</ul>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
export default spiele
|
|
@ -0,0 +1,9 @@
|
|||
import React from 'react'
|
||||
|
||||
function training() {
|
||||
return (
|
||||
<div>training</div>
|
||||
)
|
||||
}
|
||||
|
||||
export default training
|
|
@ -0,0 +1,9 @@
|
|||
import React from 'react'
|
||||
|
||||
function user() {
|
||||
return (
|
||||
<div>user</div>
|
||||
)
|
||||
}
|
||||
|
||||
export default user
|
|
@ -0,0 +1,9 @@
|
|||
import React from 'react'
|
||||
|
||||
function register() {
|
||||
return (
|
||||
<div>register</div>
|
||||
)
|
||||
}
|
||||
|
||||
export default register
|
|
@ -0,0 +1,13 @@
|
|||
'use client';
|
||||
import React, { useState } from 'react';
|
||||
|
||||
export default function Counter() {
|
||||
const [count, setCount] = useState(0);
|
||||
|
||||
return (
|
||||
<div className='flex flex-col items-center w-[100px]'>
|
||||
<p className='text-5xl font-bold'>{count}</p>
|
||||
<button onClick={() => setCount(count + 1)} className='bg-blue-500 rounded hover:bg-blue-800 text-white px-4 py-2 mt-2'>Increase</button>
|
||||
</div>
|
||||
)
|
||||
}
|
|
@ -0,0 +1,9 @@
|
|||
import React from 'react'
|
||||
|
||||
function Footer() {
|
||||
return (
|
||||
<div className='max-w-3xl mx-auto'>Footer</div>
|
||||
)
|
||||
}
|
||||
|
||||
export default Footer
|
|
@ -0,0 +1,21 @@
|
|||
import React from 'react'
|
||||
import Link from "next/link";
|
||||
|
||||
function Navbar() {
|
||||
return (
|
||||
<nav className='max-w-3xl mx-auto py-4 flex gap-x-4 border-b-2'>Navbar
|
||||
|
||||
<Link href="/">Home</Link>
|
||||
<Link href="/spiele">Spiele</Link>
|
||||
<Link href="/training">Training</Link>
|
||||
<Link href="/user">User</Link>
|
||||
<Link href="/user/register">Register</Link>
|
||||
<Link href="/admin">Admin</Link>
|
||||
<Link href="/features">Feature</Link>
|
||||
<Link href="/impressum">Impressum</Link>
|
||||
|
||||
</nav>
|
||||
)
|
||||
}
|
||||
|
||||
export default Navbar
|
|
@ -3,6 +3,7 @@ const express = require("express");
|
|||
const app = express();
|
||||
const authRoutes = require("./routes/auth");
|
||||
const memberRoutes = require("./routes/members");
|
||||
const spieleRoutes = require("./routes/spiele");
|
||||
const bodyParser = require("body-parser");
|
||||
|
||||
// Middleware
|
||||
|
@ -14,6 +15,7 @@ const authenticateToken = require("./middleware/authenticateToken");
|
|||
// Routes
|
||||
app.use("/auth", authRoutes);
|
||||
app.use("/members", memberRoutes);
|
||||
app.use("/spiele", spieleRoutes);
|
||||
|
||||
// Server starten
|
||||
const PORT = process.env.PORT || 2005;
|
||||
|
|
|
@ -0,0 +1,85 @@
|
|||
const jwt = require("jsonwebtoken");
|
||||
const { Pool } = require("pg");
|
||||
|
||||
// Datenbankverbindung
|
||||
const pool = new Pool({
|
||||
user: process.env.DB_USER,
|
||||
host: process.env.DB_HOST,
|
||||
database: process.env.DB_NAME,
|
||||
password: process.env.DB_PASSWORD,
|
||||
port: 5432,
|
||||
});
|
||||
|
||||
// Registrierungsfunktion
|
||||
const newGame = async (req, res) => {
|
||||
const { name } = req.body;
|
||||
try {
|
||||
// Überprüfen, ob der Benutzer bereits existiert
|
||||
|
||||
const newGame = await pool.query(
|
||||
"INSERT INTO spiele (name) VALUES ($1) RETURNING id",
|
||||
[name]
|
||||
);
|
||||
|
||||
res.status(201).json({ message: "Spiel angelegt", id: newGame.rows[0].id });
|
||||
} catch (err) {
|
||||
res
|
||||
.status(500)
|
||||
.json({ message: "Fehler beim Anlegen", error: err.message });
|
||||
}
|
||||
};
|
||||
|
||||
const allGames = async (req, res) => {
|
||||
try {
|
||||
// Überprüfen, ob der Benutzer existiert
|
||||
const games = await pool.query("SELECT * FROM spiele");
|
||||
if (games.rows.length === 0) {
|
||||
return res.status(400).json({ message: "Keine Spiele vorhanden" });
|
||||
}
|
||||
|
||||
// Passwort vergleichen
|
||||
res.status(200).json({ message: "Login erfolgreich", games: games.rows });
|
||||
} catch (err) {
|
||||
res.status(500).json({ message: "Fehler beim Login", error: err.message });
|
||||
}
|
||||
};
|
||||
|
||||
const updateGame = async (req, res) => {
|
||||
const { id } = req.params;
|
||||
const { name } = req.body;
|
||||
try {
|
||||
const updateUser = await pool.query(
|
||||
"UPDATE spiele SET name = $1 WHERE id = $2 RETURNING *",
|
||||
[name, id]
|
||||
);
|
||||
res.status(200).json({
|
||||
message: "Benutzerdaten aktualisiert",
|
||||
user: updateUser.rows[0],
|
||||
});
|
||||
} catch (err) {
|
||||
res.status(500).json({
|
||||
message: "Fehler beim Aktualisieren der Benutzerdaten",
|
||||
error: err.message,
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
const Game = async (req, res) => {
|
||||
const { id } = req.params;
|
||||
try {
|
||||
const games = await pool.query("SELECT * FROM spiele Where id = $1", [id]);
|
||||
if (games.rows.length === 0) {
|
||||
return res.status(400).json({ message: "Spiel nicht gefunden" });
|
||||
}
|
||||
|
||||
// Passwort vergleichen
|
||||
res.status(200).json({ message: "Spiel gefunden", game: games.rows[0] });
|
||||
} catch (err) {
|
||||
res.status(500).json({
|
||||
message: "Fehler beim Aktualisieren der Benutzerdaten",
|
||||
error: err.message,
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
module.exports = { newGame, allGames, updateGame, Game };
|
|
@ -0,0 +1,17 @@
|
|||
const express = require("express");
|
||||
const {
|
||||
allGames,
|
||||
newGame,
|
||||
Game,
|
||||
updateGame,
|
||||
} = require("../controllers/gameController");
|
||||
const router = express.Router();
|
||||
const authenticateToken = require("../middleware/authenticateToken");
|
||||
|
||||
// Loginroute
|
||||
router.get("/", allGames);
|
||||
router.post("/new", newGame);
|
||||
router.get("/:id", Game);
|
||||
router.post("/:spiel", authenticateToken, updateGame);
|
||||
|
||||
module.exports = router;
|
Loading…
Reference in New Issue