diff --git a/docker-compose.yml b/docker-compose.yml
index f5cfefb..5ee25f9 100644
--- a/docker-compose.yml
+++ b/docker-compose.yml
@@ -119,15 +119,15 @@ services:
       GROUP_SERVICE_URL: http://groupservice:8005
       MULTIPLAYER_SERVICE_URL: http://multiplayerservice:8006
 
-  webapp:
-    container_name: webapp-${teamname:-defaultASW}
-    image: ghcr.io/arquisoft/wiq_en2a/webapp:latest
-    profiles: ["dev", "prod"]
-    build: ./webapp
-    depends_on:
-      - gatewayservice
-    ports:
-      - "3000:3000" 
+  # webapp:
+  #   container_name: webapp-${teamname:-defaultASW}
+  #   image: ghcr.io/arquisoft/wiq_en2a/webapp:latest
+  #   profiles: ["dev", "prod"]
+  #   build: ./webapp
+  #   depends_on:
+  #     - gatewayservice
+  #   ports:
+  #     - "3000:3000" 
 
   prometheus:
     image: prom/prometheus
diff --git a/multiplayerservice/package-lock.json b/multiplayerservice/package-lock.json
index c1ed61f..15e1115 100644
--- a/multiplayerservice/package-lock.json
+++ b/multiplayerservice/package-lock.json
@@ -11,6 +11,7 @@
       "dependencies": {
         "axios": "^1.6.7",
         "body-parser": "^1.20.2",
+        "cors": "^2.8.5",
         "express": "^4.18.2",
         "mongoose": "^8.0.4",
         "socket.io": "^4.7.5",
diff --git a/multiplayerservice/package.json b/multiplayerservice/package.json
index 5e6c22b..7a28f5c 100644
--- a/multiplayerservice/package.json
+++ b/multiplayerservice/package.json
@@ -20,6 +20,7 @@
   "dependencies": {
     "axios": "^1.6.7",
     "body-parser": "^1.20.2",
+    "cors": "^2.8.5",
     "express": "^4.18.2",
     "mongoose": "^8.0.4",
     "socket.io": "^4.7.5",
diff --git a/multiplayerservice/server.js b/multiplayerservice/server.js
index f42e71c..ac5f7b9 100644
--- a/multiplayerservice/server.js
+++ b/multiplayerservice/server.js
@@ -4,9 +4,14 @@ const socketIo = require('socket.io');
 
 const app = express();
 const server = http.createServer(app);
-const io = socketIo(server);
-
-const parties = {}; // Store active parties and their corresponding sockets
+const io = socketIo(server, {
+  cors: {
+    origin: 'http://localhost:3000',
+    methods: ['GET', 'POST'],
+    credentials: true
+  }
+});
+const parties = {}; 
 
 // Generate a random code for the party
 function generatePartyCode() {
diff --git a/webapp/package-lock.json b/webapp/package-lock.json
index 531297a..c6bdaf9 100644
--- a/webapp/package-lock.json
+++ b/webapp/package-lock.json
@@ -25,6 +25,7 @@
         "react-router-dom": "^6.22.2",
         "react-scripts": "^5.0.1",
         "react-sf-building-blocks": "^1.0.87",
+        "socket.io-client": "^4.7.5",
         "web-vitals": "^3.5.1"
       },
       "devDependencies": {
@@ -5122,6 +5123,11 @@
         "type-detect": "4.0.8"
       }
     },
+    "node_modules/@socket.io/component-emitter": {
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/@socket.io/component-emitter/-/component-emitter-3.1.0.tgz",
+      "integrity": "sha512-+9jVqKhRSpsc591z5vX+X5Yyw+he/HCB4iQ/RYxw35CEPaY1gnsNE43nf9n9AaYjAQrTiI/mOwKUKdUs9vf7Xg=="
+    },
     "node_modules/@surma/rollup-plugin-off-main-thread": {
       "version": "2.2.3",
       "resolved": "https://registry.npmjs.org/@surma/rollup-plugin-off-main-thread/-/rollup-plugin-off-main-thread-2.2.3.tgz",
@@ -9467,6 +9473,46 @@
         "once": "^1.4.0"
       }
     },
+    "node_modules/engine.io-client": {
+      "version": "6.5.3",
+      "resolved": "https://registry.npmjs.org/engine.io-client/-/engine.io-client-6.5.3.tgz",
+      "integrity": "sha512-9Z0qLB0NIisTRt1DZ/8U2k12RJn8yls/nXMZLn+/N8hANT3TcYjKFKcwbw5zFQiN4NTde3TSY9zb79e1ij6j9Q==",
+      "dependencies": {
+        "@socket.io/component-emitter": "~3.1.0",
+        "debug": "~4.3.1",
+        "engine.io-parser": "~5.2.1",
+        "ws": "~8.11.0",
+        "xmlhttprequest-ssl": "~2.0.0"
+      }
+    },
+    "node_modules/engine.io-client/node_modules/ws": {
+      "version": "8.11.0",
+      "resolved": "https://registry.npmjs.org/ws/-/ws-8.11.0.tgz",
+      "integrity": "sha512-HPG3wQd9sNQoT9xHyNCXoDUa+Xw/VevmY9FoHyQ+g+rrMn4j6FB4np7Z0OhdTgjx6MgQLK7jwSy1YecU1+4Asg==",
+      "engines": {
+        "node": ">=10.0.0"
+      },
+      "peerDependencies": {
+        "bufferutil": "^4.0.1",
+        "utf-8-validate": "^5.0.2"
+      },
+      "peerDependenciesMeta": {
+        "bufferutil": {
+          "optional": true
+        },
+        "utf-8-validate": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/engine.io-parser": {
+      "version": "5.2.2",
+      "resolved": "https://registry.npmjs.org/engine.io-parser/-/engine.io-parser-5.2.2.tgz",
+      "integrity": "sha512-RcyUFKA93/CXH20l4SoVvzZfrSDMOTUS3bWVpTt2FuFP+XYrL8i8oonHP7WInRyVHXh0n/ORtoeiE1os+8qkSw==",
+      "engines": {
+        "node": ">=10.0.0"
+      }
+    },
     "node_modules/enhanced-resolve": {
       "version": "5.15.1",
       "resolved": "https://registry.npmjs.org/enhanced-resolve/-/enhanced-resolve-5.15.1.tgz",
@@ -24474,6 +24520,32 @@
         "node": ">=0.10.0"
       }
     },
+    "node_modules/socket.io-client": {
+      "version": "4.7.5",
+      "resolved": "https://registry.npmjs.org/socket.io-client/-/socket.io-client-4.7.5.tgz",
+      "integrity": "sha512-sJ/tqHOCe7Z50JCBCXrsY3I2k03iOiUe+tj1OmKeD2lXPiGH/RUCdTZFoqVyN7l1MnpIzPrGtLcijffmeouNlQ==",
+      "dependencies": {
+        "@socket.io/component-emitter": "~3.1.0",
+        "debug": "~4.3.2",
+        "engine.io-client": "~6.5.2",
+        "socket.io-parser": "~4.2.4"
+      },
+      "engines": {
+        "node": ">=10.0.0"
+      }
+    },
+    "node_modules/socket.io-parser": {
+      "version": "4.2.4",
+      "resolved": "https://registry.npmjs.org/socket.io-parser/-/socket.io-parser-4.2.4.tgz",
+      "integrity": "sha512-/GbIKmo8ioc+NIWIhwdecY0ge+qVBSMdgxGygevmdHj24bsfgtCmcUUcQ5ZzcylGFHsN3k4HB4Cgkl96KVnuew==",
+      "dependencies": {
+        "@socket.io/component-emitter": "~3.1.0",
+        "debug": "~4.3.1"
+      },
+      "engines": {
+        "node": ">=10.0.0"
+      }
+    },
     "node_modules/sockjs": {
       "version": "0.3.24",
       "resolved": "https://registry.npmjs.org/sockjs/-/sockjs-0.3.24.tgz",
@@ -27244,6 +27316,14 @@
       "resolved": "https://registry.npmjs.org/xmlchars/-/xmlchars-2.2.0.tgz",
       "integrity": "sha512-JZnDKK8B0RCDw84FNdDAIpZK+JuJw+s7Lz8nksI7SIuU3UXJJslUthsi+uWBUYOwPFwW7W7PRLRfUKpxjtjFCw=="
     },
+    "node_modules/xmlhttprequest-ssl": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/xmlhttprequest-ssl/-/xmlhttprequest-ssl-2.0.0.tgz",
+      "integrity": "sha512-QKxVRxiRACQcVuQEYFsI1hhkrMlrXHPegbbd1yn9UHOmRxY+si12nQYzri3vbzt8VdTTRviqcKxcyllFas5z2A==",
+      "engines": {
+        "node": ">=0.4.0"
+      }
+    },
     "node_modules/y18n": {
       "version": "5.0.8",
       "resolved": "https://registry.npmjs.org/y18n/-/y18n-5.0.8.tgz",
diff --git a/webapp/package.json b/webapp/package.json
index 7e491b8..6eca272 100644
--- a/webapp/package.json
+++ b/webapp/package.json
@@ -20,6 +20,7 @@
     "react-router-dom": "^6.22.2",
     "react-scripts": "^5.0.1",
     "react-sf-building-blocks": "^1.0.87",
+    "socket.io-client": "^4.7.5",
     "web-vitals": "^3.5.1"
   },
   "scripts": {
diff --git a/webapp/src/components/game/GameMultiPlayer.tsx b/webapp/src/components/game/GameMultiPlayer.tsx
index 32779df..21c8fbc 100644
--- a/webapp/src/components/game/GameMultiPlayer.tsx
+++ b/webapp/src/components/game/GameMultiPlayer.tsx
@@ -1,11 +1,44 @@
-import { FC } from 'react'
+import { FC, useEffect, useState } from 'react'
+import io from 'socket.io-client';
 
 interface GameMultiPlayerProps {
   
 }
 
+interface SocketProps {
+  emit: (event: string, ...args: any[]) => void;
+  close: () => void; 
+}
+
 const GameMultiPlayer: FC<GameMultiPlayerProps> = ({}) => {
-  return <div>GameMultiPlayer</div>
+
+  const SERVER_URL = 'http://localhost:8006';
+  const [socket, setSocket] = useState<SocketProps | null>(null);
+
+  useEffect(() => {
+    const newSocket = io(SERVER_URL);
+    setSocket(newSocket);
+
+    newSocket.on('partyCreated', (partyCode: string) => {
+      console.log(`Party created: ${partyCode}`);
+      // Handle the party creation, e.g., store the party code in the state
+    });
+  
+    return () => {
+      newSocket.close();
+    };
+  }, []);
+
+  const createParty = () => {
+    socket.emit('createParty');
+  };
+
+  return (
+    <div>
+      <h1>Multiplayer Game</h1>
+      <button onClick={createParty}>Create Party</button>
+    </div>
+  )
 }
 
 export default GameMultiPlayer
\ No newline at end of file