Added a header, all links except github only refresh the page. Also added header&footer to App and removed unneccessary login

code/frontend/src/App.tsx

@@ -2,45 +2,15 @@ import React, { use } from 'react';
 import logo from './logo.svg';
 import './App.css';
 import { useState, useEffect } from 'react';
+import Footer from './Footer';
+import Header from './header';
 
 function App() {
-  const [username, setUsername] = useState<string>('');
-  const [password, setPassword] = useState<string>('');
-  const [mail, setMail] = useState<string>('');
-  const [isCreate, setIsCreate] = useState<boolean>(false);
-
-useEffect(() => {
-  console.log(username);
-}, [username]);
-
-
-  const changeUsername = (event : React.ChangeEvent<HTMLInputElement>) => {
-    if (event.target.value.length > 20) {
-      alert("Username is too long");
-    }
-    setUsername(event.target.value);
-  }
-  const changePassword = (event : React.ChangeEvent<HTMLInputElement>) => {
-    setPassword(event.target.value);
-  }
-  const changeMail = (event : React.ChangeEvent<HTMLInputElement>) => {
-    setMail(event.target.value);
-  }
-
+  
   return (
     <div className="App">
-      {isCreate? <h1>Create Account</h1> :  <h1>Login</h1> }
-      {isCreate && <>
-        <label htmlFor="email">E-Mail</label>
-        <input id='email' type="email" value={mail} onChange={changeMail}></input>
-        <br /></>}
-      <label htmlFor="username">Username</label>
-      <input id='username' type="text" value={username} onChange={changeUsername}></input>
-      <br />
-      <label htmlFor="password">Password</label>
-      <input id='password' type="password" value={password} onChange={changePassword}/>
-      <br />
-      <input type="button" onClick={() => setIsCreate(!isCreate)} value={isCreate? "Create" : "login"}/>
+      <Header/>
+      <Footer/>
     </div>
   );
 }