diff --git a/packages/server/src/App.js b/packages/server/src/App.js
index 241ed97..83c03f9 100644
--- a/packages/server/src/App.js
+++ b/packages/server/src/App.js
@@ -1,14 +1,21 @@
-import React from 'react';
+import React, {useState} from 'react';
 import './App.scss';
 import config from './config';
 
+import socketIOClient from 'socket.io-client';
+export const socket = socketIOClient(config.apiAddress);
+
 function App() {
-  let fetchData = {};
-  fetch(config.apiAddress).then(res => {console.log(res);fetchData = res.body}).then(() => console.log(fetchData))
+  const [fetchData, setFetchData] = useState();
+  const [socketData, setSocketData] = useState();
+  fetch(config.apiAddress).then(res => res.text()).then(data => setFetchData(data));
+  socket.emit('connect');
+  socket.on('connected', data => setSocketData(data.message));
   return (
     <div className="App">
       <h1>React Boilerplate</h1>
-      {fetchData ? <p></p> : <></>}
+      {fetchData ? <p>{fetchData}</p> : <></>}
+      {socketData ? <p>{socketData}</p> : <></>}
     </div>
   );
 }
diff --git a/packages/server/src/config.js b/packages/server/src/config.js
index d54c463..150ce8e 100644
--- a/packages/server/src/config.js
+++ b/packages/server/src/config.js
@@ -1,9 +1,11 @@
 const production = {
-  apiAddress: null
+  apiAddress: null,
+  endpoint: null
 }
 
 const development = {
-  apiAddress: 'http://localhost:8000'
+  apiAddress: 'http://localhost:8000',
+  endpoint: 'http://localhost:3000'
 }
 
 const config = process.env.REACT_APP_ENVIRONMENT === 'production'