diff --git a/src/features/network/components/NetworkComponent.js b/src/features/network/components/NetworkComponent.js
new file mode 100644
index 0000000..1c1ca56
--- /dev/null
+++ b/src/features/network/components/NetworkComponent.js
@@ -0,0 +1,35 @@
+import React from "react";
+import PropTypes from "prop-types";
+import { TextField, Button } from "@material-ui/core";
+import MachinesList from "./MachinesList";
+import { makeStyles } from "@material-ui/core/styles";
+import styles from "../styles";
+
+const useStyles = makeStyles(styles);
+
+const NetworkComponent = ({ network, onPropertyChange, onReadMachines }) => {
+  const classes = useStyles();
+
+  return (
+    <div className={classes.root}>
+      <div>NetworkContainer</div>
+      <MachinesList />
+      <TextField
+        id="ertet"
+        label="Test"
+        onChange={onPropertyChange("test")}
+        value={network.test}
+      />
+      <Button variant="contained" color="primary" onClick={onReadMachines}>
+        Read machines
+      </Button>
+    </div>
+  );
+};
+
+NetworkComponent.propTypes = {
+  network: PropTypes.object.isRequired,
+  onPropertyChange: PropTypes.func.isRequired
+};
+
+export default NetworkComponent;
diff --git a/src/features/network/components/NetworkContainer.js b/src/features/network/components/NetworkContainer.js
index bfc99a5..277c499 100644
--- a/src/features/network/components/NetworkContainer.js
+++ b/src/features/network/components/NetworkContainer.js
@@ -1,11 +1,10 @@
 import React, { useContext } from "react";
-import { TextField, Button } from "@material-ui/core";
 import {
   ApplicationStateContext,
   ApplicationDispatchContext
 } from "../../../state/ApplicationContexts";
 import { readMachines } from "../api";
-import MachinesList from "./MachinesList";
+import NetworkComponent from "./NetworkComponent";
 
 const NetworkContainer = () => {
   const state = useContext(ApplicationStateContext);
@@ -21,19 +20,11 @@ const NetworkContainer = () => {
   };
 
   return (
-    <>
-      <div>NetworkContainer</div>
-      <MachinesList />
-      <TextField
-        id="ertet"
-        label="Test"
-        onChange={handleChange("test")}
-        value={state.network.test}
-      />
-      <Button variant="contained" color="primary" onClick={handleReadMachines}>
-        Read machines
-      </Button>
-    </>
+    <NetworkComponent
+      network={state.network}
+      onPropertyChange={handleChange}
+      onReadMachines={handleReadMachines}
+    />
   );
 };
 
diff --git a/src/features/network/styles.js b/src/features/network/styles.js
new file mode 100644
index 0000000..ec844e3
--- /dev/null
+++ b/src/features/network/styles.js
@@ -0,0 +1,7 @@
+const styles = () => ({
+  root: {
+    margin: "15px"
+  }
+});
+
+export default styles;