diff --git a/client/src/pages/ContainerInside/Network/index.css b/client/src/pages/ContainerInside/Network/index.css
new file mode 100644
index 0000000..ad3f0a9
--- /dev/null
+++ b/client/src/pages/ContainerInside/Network/index.css
@@ -0,0 +1,14 @@
+.con-net-det {
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+  margin-top: 20px;
+  margin-bottom: 20px;
+  color: rgb(5, 5, 82);
+}
+
+.title {
+  font-size: 25px;
+  font-weight: bolder;
+}
diff --git a/client/src/pages/ContainerInside/Network/index.tsx b/client/src/pages/ContainerInside/Network/index.tsx
index 0649d04..cc13079 100644
--- a/client/src/pages/ContainerInside/Network/index.tsx
+++ b/client/src/pages/ContainerInside/Network/index.tsx
@@ -1,7 +1,64 @@
-import React from 'react';
+import { useState } from 'react';
+import './index.css';
+import { DockerContainer } from '../../../models/container';
+import { useNavigate, useParams } from 'react-router-dom';
+import { getAllContainers } from '../../../api/container';
+import { useQuery } from 'react-query';
 
 const ContainerNetworks = () => {
-  return <div>ContainerNetworks</div>;
+  const [container, setContainer] = useState<DockerContainer | null>(null);
+  const navigate = useNavigate();
+  const { id } = useParams();
+  const fetchContainer = async () => {
+    try {
+      const containers = await getAllContainers(
+        localStorage.getItem('token') as string
+      );
+      let s = 0;
+      containers.data.forEach(cont => {
+        if (cont.Id === id) {
+          console.log(cont);
+          setContainer(cont);
+          s = 1;
+          return;
+        }
+      });
+      if (s === 0) {
+        navigate('/');
+      }
+    } catch (e) {
+      console.log(e);
+      return navigate('/');
+    }
+  };
+
+  useQuery('container' + id, fetchContainer, {
+    retry: false,
+  });
+
+  if (id === undefined) {
+    return <></>;
+  }
+
+  return (
+    <>
+      <div className="con-net-det">
+        <div className="ports">
+          <div className="title">Ports</div>
+          <div className="port-container">
+            {container?.Ports.map((port, index) => (
+              <div key={index} className="port">
+                <div className="port-name">{port.Type}</div>
+                <div className="port-name">{port?.IP}</div>
+                <div className="port-name">{port?.PrivatePort}</div>
+                <div className="port-name">{port?.PublicPort}</div>
+              </div>
+            ))}
+          </div>
+        </div>
+      </div>
+    </>
+  );
 };
 
 export default ContainerNetworks;