diff --git a/app.js b/app.js
index 5347bf8..026d198 100644
--- a/app.js
+++ b/app.js
@@ -592,6 +592,44 @@ app.get('/register', (req, res) => {
   res.render('register'); // Stelle sicher, dass es eine register.ejs gibt
 });
 
+app.get('/spiele', async (req, res) => {
+  try {
+    const spieleResult = await pool.query('SELECT * FROM spiele');
+    const spiele = spieleResult.rows;
+    res.render('spiele', { spiele, session: req.session });
+  } catch (error) {
+    console.error('Error in Mitglied:', error);
+    res.status(500).send('Internal Server Error');
+  }
+})
+  
+app.get('/spiel/:id', async (req, res) => {
+  const { id } = req.params;
+  try {
+    const spieleResult = await pool.query('SELECT * FROM spiele WHERE id = $1', [id]);
+    const spiel = spieleResult.rows[0];
+    res.render('spiel', { spiel, session: req.session });
+  } catch (error) {
+    console.error('Error in Mitglied:', error);
+    res.status(500).send('Internal Server Error');
+  }
+})
+
+app.post('/edit-spiel', requireAuth, async (req, res) => {
+const { material, dauer, regeln, variationen, id } = req.body;
+try {
+  const queryResult = await pool.query('UPDATE spiele set material = $1, regeln = $2, dauer = $3, variationen = $4 Where id = $5 ', [material, regeln, dauer, variationen, id]);
+res.redirect('/spiel/' + id);
+} catch (error) {
+  console.error('Error in Mitglied:', error);
+  res.status(500).send('Internal Server Error');
+}
+
+})
+
 const server = app.listen(port, '0.0.0.0', () => {
     console.log(`Server is running on http://localhost:${port}/`);
   });
+
+
+  
\ No newline at end of file
diff --git a/views/partials/header.ejs b/views/partials/header.ejs
index db47ca0..b815ce7 100644
--- a/views/partials/header.ejs
+++ b/views/partials/header.ejs
@@ -15,6 +15,9 @@
     </button>
     <div class="collapse navbar-collapse" id="navbarNav">
       <ul class="navbar-nav">
+        
+        <% if (session && ( session.role =='admin' || session.role =='user' )) { %>
+
         <li class="nav-item">
           <a class="nav-link" href="/">Trainings</a>
         </li>
@@ -27,6 +30,13 @@
         <li class="nav-item">
           <a class="nav-link" href="/profile">Profil</a>
         </li>
+        
+        <% } %>
+
+        <li class="nav-item">
+          <a class="nav-link" href="/spiele">Spiele</a>
+        </li>
+
         <% if (session && session.role === 'admin') { %>
           <li class="nav-item"><a class="nav-link" href="/admin">Admin</a></li>
         <% } %>
diff --git a/views/spiel.ejs b/views/spiel.ejs
new file mode 100644
index 0000000..463d916
--- /dev/null
+++ b/views/spiel.ejs
@@ -0,0 +1,46 @@
+<%- include('partials/header') %>
+
+<h1><%= spiel.name %></h1>
+
+
+<div id="view" class="mt-5">
+    <h2>Material</h2>
+        <p><%= spiel.material %></p>    
+    <h2>Dauer</h2>
+        <p><%= spiel.dauer %></p>    
+    
+    <h2>Regeln</h2>
+        <p><%= spiel.regeln %></p>
+        <% if (session && (session.role === 'user' || session.role==='admin')) {%>
+    <button class="btn btn-primary" onclick="toggleDivs()">Zum Edit-Modus wechseln</button>
+
+</div>
+
+<div id="edit" class="mt-5 d-none">
+    <form method="POST" action="/edit-Spiel">
+        <input type="hidden" name="id" value="<%= spiel.id %>">
+        <strong>Material: </strong><input type="text" name="material" value="<%= spiel.matierial %>"></br>
+        <strong>Dauer: </strong><input name="dauer" value="<%=spiel.dauer %>"></br>
+        <strong>Regeln: </strong><input type="text" name="regeln" value="<%= spiel.regeln %>"></br>
+        <strong>Variationen: </strong><input type="text" name="variationen" value="<%= spiel.variationen %>"></br>
+        <button type="submit">Speichern</button>
+    </form>
+    <button class="btn btn-secondary" onclick="toggleDivs()">Zum View-Modus wechseln</button>
+</div>
+
+<script>
+    function toggleDivs() {
+        $('#view').toggleClass('d-none d-block');
+        $('#edit').toggleClass('d-none d-block');
+    }
+</script>
+
+<% } else{ %>
+</div>
+<% } %>
+
+</body>
+</html>
+
+
+<%- include('partials/footer') %>
\ No newline at end of file
diff --git a/views/spiele.ejs b/views/spiele.ejs
new file mode 100644
index 0000000..0642501
--- /dev/null
+++ b/views/spiele.ejs
@@ -0,0 +1,12 @@
+<%- include('partials/header') %>
+
+<h1>Spiele</h1>
+<ul>
+  <% spiele.forEach(spiel => { %>
+    <li><a href="/spiel/<%= spiel.id %>"><strong><%= spiel.name %></strong></a></li>
+  <% }) %>
+</ul>
+</body>
+</html>
+
+<%- include('partials/footer') %>
\ No newline at end of file