diff --git a/frontend/src/components/login/createAccount.js b/frontend/src/components/login/createAccount.js
index b6e65ee..2950a44 100644
--- a/frontend/src/components/login/createAccount.js
+++ b/frontend/src/components/login/createAccount.js
@@ -117,6 +117,7 @@ export default function CreateAccount() {
                                             label="Username"
                                             variant="outlined"
                                             onChange={handleChangeUSR}
+                                            value={username}
                                             className={classes.input}
                                         />
                                     </Box >
@@ -129,6 +130,7 @@ export default function CreateAccount() {
                                             label="Password"
                                             autoComplete="current-password"
                                             variant="outlined"
+                                            value={password}
                                             onChange={handleChangePW}
                                             className={classes.input}
                                         />
diff --git a/frontend/src/components/login/login.js b/frontend/src/components/login/login.js
index 68355ba..7326bbb 100644
--- a/frontend/src/components/login/login.js
+++ b/frontend/src/components/login/login.js
@@ -10,9 +10,8 @@ import Logo from "../../img/logo.png";
 import TextField from '@material-ui/core/TextField';
 import Grid from '@material-ui/core/Grid';
 import Link1 from '@material-ui/core/Link';
-import CreateAccount from './createAccount';
-
 
+const url = "/simcompanies/API/user/login"
 const useStyles = makeStyles(theme => ({
     card: {
         backgroundColor: "#0B1929",
@@ -59,8 +58,51 @@ const CssTextField = withStyles({
     },
 })(TextField);
 
+const postLogin = async (url, data) => {
+    const response = await fetch(url, {
+        method: 'POST',
+        mode: 'cors',
+        cache: 'no-cache',
+        headers: {
+            'Content-Type': 'application/json'
+        },
+        redirect: 'follow',
+        referrerPolicy: 'no-referrer',
+        body: JSON.stringify(data)
+    });
+}
+
+const checkLogin = async (url) => {
+    const response = await fetch(url);
+
+    if (response.status == "200") {
+        return true
+    } else {
+        return false
+    }
+}
+
 export default function Login() {
     const classes = useStyles();
+
+    const [username, setUsername] = React.useState("");
+    const [password, setPassword] = React.useState("");
+
+    const handleClick = (e) => {
+
+        if (username !== "" && password !== "") {
+            postLogin(url, { email: username, password: password })
+
+            setUsername("")
+            setPassword("")
+        }
+    }
+    const handleChangeUSR = (e) => {
+        setUsername(e.target.value)
+    }
+    const handleChangePW = (e) => {
+        setPassword(e.target.value)
+    }
     return (
         <Box className="loginBackground" display="flex" justifyContent="center" alignItems="center" m={1} p={1} >
             <Card className={classes.card} raised>
@@ -84,6 +126,7 @@ export default function Login() {
                                             id="usernameInput"
                                             label="Username"
                                             variant="outlined"
+                                            onChange={handleChangeUSR}
                                             className={classes.input}
                                         />
                                     </Box >
@@ -96,6 +139,7 @@ export default function Login() {
                                             label="Password"
                                             autoComplete="current-password"
                                             variant="outlined"
+                                            onChange={handleChangePW}
                                             className={classes.input}
                                         />
                                     </Box >
@@ -111,7 +155,7 @@ export default function Login() {
                                 </Grid>
                                 <Grid item xs={12}>
                                     <Box display="flex" justifyContent="center"  >
-                                        <Button variant="contained" color="secondary">
+                                        <Button variant="contained" color="secondary" onClick={handleClick}>
                                             Login
                                     </Button>
                                     </Box >